AI 嘴替,社交平台反杠机器人:第 3 篇-页面优化&总结

大家好,我是欧达克。

前面大致实现了 AI 嘴替 应用聊天的功能,今天主要是针对 AI 工具生成的代码进行优化。


问题丢给 DeepSeek:

我想利用 AI 工具生成图片,根据我输入的文字描述,生成对应的图片,有什么 AI 网站可以满足我的要求吗?

DeepSeek 回答:

最终亲测了几款之后,发现 Midjourney 和即梦 AI 效果比较好,这里不得不吐槽下文心一格,AI 工具收费无可厚非,但是其他的工具多多少少能免费体验下,文心一格直接引导到充值页,这波吃相未免太难看。

对比了 Midjourney 和即梦 AI 后,最后选择了 Midjourney 生成的 Logo,效果如何千人千面。

Midjourney:

即梦 AI:

UI 优化

上一篇实现了基本的前后端交互,现在针对前端做些 UI 优化,依然是用 Cursor 和 Trae。

这里就不单独对比 Cursor 和 Trae 了,实际体验下来效果差不多,都是基于最新的 Claude-3.7 模型。

Trae

现在index.vue生成的首页太简单了,我不需要顶部的蓝色框,我需要添加一些动态的背景,具有科技感,同时开始对话的按钮和 logo 图片不要显得那么突兀。

去掉顶部导航栏

帮我再优化在首页,要求图片居中,开始对话置于中下位置,同时背景动态效果更丰富一些,最好能和图片有些联动。

然后就是服务失败,检查网络。。。

最后在经过 1 小时多的调试之后,对比下优化前后效果。

引导页:

旧:

新:

对话页:

旧:

新:

下面是使用 qwen-plus的对话效果:

前后端的代码都已提交到 GitHub,有兴趣的朋友可以翻翻往期文章。

总结

本章主要使用 Trae 对 UI 做了一些优化,让页面看起来更酷炫一点。

产品主体功能就这样了,但是很难说服自己做的东西不是个垃圾,但这并不是 AI 的问题。实际体验下来,你只要给它一个明确的功能需求,它能够做得很好,甚至很多页面动态效果,对于一个不太了解前端的同学,可能需要花很长的时间去实现,但是 AI 在 30 秒内完成。这里因为我给 AI 的描述很宽泛,并没有明确动态效果应该是什么样,所以 AI 就自由发挥。

总体感觉当前市面上的 AI 确实是很好的编程辅助工具,特别是对于有一定编程基础的人,在工作中能大大提效。不管是像 Cursor、Trae 这种自带编辑器的 AI 工具,还是像通义灵码、cline 这种插件,实际体验下来都不错。很多人会说 AI 早晚会替代程序员,也许是对的,但是 not today!what do we say to the God of Death? -Not today! )。普通人能做的,就是多接触 AI 工具,用好 AI 工具,但就算完全不懂 AI,又有什么关系呢,每次的技术革新都是少数人推动的,普通人处在时代的洪流下,能过好自己的生活就很好了,致敬每一位为了生活负重前行的我们。

我是欧达克,祝你幸福。

相关推荐
换日线°1 天前
NFC标签打开微信小程序
前端·微信小程序
程序员鱼皮1 天前
刚刚,Claude Opus 4.6 和 GPT-5.3-Codex 同时炸场!AI 编程要变天了
计算机·ai·程序员·互联网·软件开发
菜鸟una1 天前
【微信小程序+Taro 3+NutUI 3】input (nut-input) 、 textarea (nut-texteare)类型使用避坑
前端·vue.js·微信小程序·小程序·taro
计算机毕设指导61 天前
基于微信小程序的校园二手交易系统【源码文末联系】
java·spring boot·spring·微信小程序·小程序·tomcat·maven
Stephen_Young2 天前
32岁程序员猝死:让我想起了我曾经的加班经历,庆幸自己还活着
程序员·工控
良许Linux2 天前
51单片机都有哪些优缺点
单片机·程序员·嵌入式·编程
Java.慈祥2 天前
速通-微信小程序 2Day
微信小程序·小程序·前端框架
2501_933907212 天前
宁波小程序公司是什么?主要提供宁波微信小程序制作与服务吗?
科技·微信小程序·小程序
码云数智-大飞2 天前
微信商城小程序怎么弄?2026年主流小程序商城平台对比
微信小程序
计算机毕设指导62 天前
基于微信小程序的非物质文化遗产推广管理系统【源码文末联系】
java·spring boot·mysql·微信小程序·小程序·tomcat·maven