这篇文章记录了我完全使用AI制作此网页的经历，由于篇幅限制，内容不能称为翔实，但起码很是忠实的。主要是记录我从一知半解，到能做出来这样一个完整项目所碰到的问题，以及随之产生开发思路的变化和学习路径。首先必须提到GitHub上的easy vibe教程，其教学精度，知识补盲、产品思维以及措辞的谦逊与平实感，都是最优秀的一档，我会推荐任何开始入门vibe coding的人学习此教程。
▲ easy vibe 教程示例
做这个网页的初衷，是想让别人能轻负担地了解我的能力，不用费劲巴拉地看我做那20分钟信息密集的动画视频。代码能力不过关，那就用AI来做，刷视频看AI做的网页美观和完整度已经很高，这会是个好主意——天真的我这样以为。
如果我们需要的内容，每次生成都能够上AI官网贴出来的示例水准，那自然是妙不可言。
▲ AI 官网示例 vs 实际生成效果对比
看看这提示词，简单、克制。再看看网页效果，高级、完善。但当我们真正上手做项目时，很快就会察觉问题。
01、资源管理问题
首先是对图像资源的管理。以Qwen-3.6为例，其对PNG格式文件的合规调用，控制难度相当大。以至于它只能用CSS来复刻我的IP形象，但这种路径复刻的精度可以说相当幽默。此外，你可能注意到了Hero页那只猫头眼睛的高光会跟随鼠标移动，对Qwen来说，这个功能实现起来并不困难，第一次生成就达到了预期的效果。但问题在于，素材的准确性和这项小功能的实现似乎起了冲突（我的IP形象直接被改得面目全非），在往后很长一段时间的修改中，这个效果一直以错误的方式出现。不止Qwen，后续开发中，智谱的GML也没能有效地解决这个问题。于是我开始考虑更换素材为svg格式（矢量图）。但网页版并不支持上传，只能采用AI IDE流程，于是转至TRAE进行开发。
02、自然语言仍非最优解
与此同时，我发现在执行的前一步，用自然语言对AI输入命令，得出的结果往往非常粗糙。于是采取先与chatgpt对话需求，让它输出一版提示词，我再将提示词转给编程AI，而不是从一开始就与编程AI对话。现阶段的AI似乎存在一个“more is less”的魔咒，即你以为已经描述得很详细和清晰，但这段话的信息量对AI来说，却卡于一个尴尬的位置。反倒不如让AI先提炼一份提示词出来——反正都是开盲盒，不如用AI喜欢的方式。
▲ 本地环境中，可以先做好充足准备再跑项目。
03、AI IDE优势与注意事项
此时AI IDE的优势尽显，只要前期工作如素材，需求文档够扎实，上下文的限制，工作流程中的意外情况对你项目的影响都会减小很多，起码不至于像玩一个没有存档的游戏，一失误就要从头再来一样，这对保持我们的项目热情有很大帮助，但也有一些细微的坑需要注意。首先是出于经济考虑，编程我选择调deepseek v4的API，其显著的短板在于没有视觉能力，所以我先用GML5.1把素材过一遍，做一个md文件，间接地充当deepseek的眼睛。但切换模型一定要注意，多提一句让它完整阅读上下文，否则它会将你的下一步指令当成第一步来处理，非常浪费时间。
▲ 切换模型后忘记让AI阅读上下文，它会把你的话翻译一遍。
04、调试与优化不再折磨
总之，到了这一步，做出令人满意的原型并在其基础上调试，直到成为一个上得了台面的产品，已经是水到渠成的事，接下来就是无尽的微调，素材的大小、位置、排版，这一步可能会花费你非常多的时间和金钱，但如果知道自己在做什么，并且一点点看着它丰满，其中的乐趣还是大于怨言的。
▲ 五千万token几乎全花在优化和调试上
用简洁的短语总结：明晰目标，找对工具，遇阻思变。其中又属找对工具为最重要，毕竟花的是真金白银。无论如何，我的愿景还是比较不错地实现，真实地做一个项目，从中收获的知识和抗风险能力是比看一百条教学视频还要多。
05、正式上线
总之，在大大小小的调试完成后，我们要让工作能正式上线，被大家看到还需要准备两样东西：域名和服务器。为了方便，我们可以直接去大厂的云服务平台购买这两样必需品，但这其中也有坑踩。以腾讯云为例，我建议是注册账号后先买服务器，因为这样会便宜——其中涉及一些具体的优惠措施我就不详细讲。如果不小心在域名这一步挑花眼下了单，从经济角度讲，我建议是买轻量应用服务器，deepseek TUI一年只需要68，相对来说会便宜很多。
而围绕服务器展开的后续必要工作还有不少，会需要3到5天的时间给腾讯云审核和到工信局备案，上线了要在公安登记，虽然麻烦，不过好在都能在线上完成，只是预期上线的期限要放宽些。