本文记录了作者在尝试使用CodeBuddy一键生成小程序过程中遇到的挑战与解决方案。作者分享了在功能生成、UI界面优化以及细节调整方面的经验，特别是指出CodeBuddy在处理复杂设计图和批量生成时的局限性。文章提出了一个包含创意、需求分析、设计图生成（MasterGo AI）、UI+功能生成（CodeBuddy）以及细节优化的完整小程序开发流程，并期待CodeBuddy能持续优化，提升开发效率。

🤖 **AI辅助开发流程的探索与实践：** 作者尝试将CodeBuddy应用于小程序开发，旨在实现从创意到功能实现的“一锅出”。尽管CodeBuddy在一次性生成完整小程序方面遭遇失败，但作者通过多次尝试和组合，逐步摸索出了一条可行的开发路径，包括利用MasterGo AI生成设计图，再由CodeBuddy生成UI和功能代码。

🎨 **UI优化的挑战与策略：** 作者发现CodeBuddy在完全遵循设计图方面存在局限性，特别是对于复杂的页面和主色调的把握。在优化过程中，作者强调了直接使用“按照”而非“参考”设计图的重要性，并建议分页面进行优化，避免AI过度发挥。同时，作者也分享了通过明确风格提示词（如蓝黑色主色调、高质感）来引导AI进行优化的方法。

🛠️ **细节调整与工具局限性：** 尽管CodeBuddy能够生成大部分UI和功能，但在细节处理上仍需人工介入。作者通过反复发送指令来微调界面元素，例如“超期提醒”的同步优化问题。文章也指出了CodeBuddy在大批量生成时可控性较低、细节问题定位不准以及命令遵从度有待提升等方面的不足。

💡 **高效小程序开发流程建议：** 作者总结了一个包含创意分析、需求文档生成、AI设计图生成、AI UI+功能生成以及逐项细节优化的完整流程。作者认为，虽然工具存在局限，但通过合理的流程设计和人机协作，能够有效提升小程序研发效率，并期待相关工具的进一步优化。

本周尝试 CodeBuddy 一口气生成完整小程序失败后，我一直在尝试各种组合。

《多次尝试用 CodeBuddy 做小程序，最终我放弃了 - 掘金》

《从CodeBuddy翻车到MasterGo救场，我的小程序UI终于焕然一新 - 掘金》

《从界面崩塌到功能完整：CodeBuddy + uniapp 小程序生成实录 - 掘金》

昨天本来计划一次性分享完全过程的，但奈何整理文章截图花费了太多时间，最终的界面优化尚未完成。

今天，我就把最后这点补上。

最终效果

经过优化，最终效果如下。

虽然距离精美还有距离，但已基本可看。

使用体验

今天的内容就不罗列具体的操作步骤了，因为每个步骤的相似度太高。

主要包括 3 类操作：

有设计图的直接优化没有设计图的参考按照设计图优化过的优化细节

按照设计图优化首页

在昨天功能基本生成的基础上，我上传了设计图，并发送指令。

执行过程

设计图

提示词没有太多技巧，重点在于“按照”而不要使用“参考”，中间有次使用了“参考”，结果 CodeBuddy 发挥太多了，和设计图相差太大。

另外一个点就是，不要想着让 CodeBuddy 根据一张设计图优化全部页面。

我已经帮你尝试了，效果如下。

它甚至连主色调都聚焦不了。

参考首页优化其他页面

这里我尝试了多次，最好是配合着提示词指明你想要保留的风格，比如蓝黑色主色调、高质感等等。

也可以参考以前使用的方法，先让 AI 帮你提炼提示词设计风格，然后放到提示词中。

优化细节

只是一遍遍地发送提示词，修改小细节。

比如首页按照设计图优化后，“超期提醒”却没有同步优化。

结语

经过这周的高强度使用，终于跑通了一套小程序“UI+功能”一锅出的流程。

创意 → 需求：你提出一个创意，AI 帮你分析整理成需求文档。需求 → 设计：MasterGo AI 帮你生成美观的设计图。设计 → 功能：CodeBuddy 一锅出 UI+功能（云函数）。功能 → 体验：根据体验效果，逐个使用 CodeBuddy 修改优化。

这个流程中的工具，你也可以根据自己喜好进行更换。

当然，整个探索过程也发现了 CodeBuddy 很多需要改进的地方。

比如大批量生成会导致可控性较低特别细节的问题修改起来容易定位不准对命令的遵从度需要优化

希望相关团队可以尽快优化升级，再次提升应用研发效率。