20251022
试了试 Google AI Studio 新的 build 功能，30分钟 vibe coding 成果：
将多张图片垂直拼接成一张长图，支持多格式输入、重新排序、旋转、预览、调整输出选项
从任意图片中提取代表性颜色并生成调色盘横条，提供3种颜色量化方法（MedianCut、FastOctree、KMeans++），支持预览、更改色块样式、与原图上下合成输出或仅导出色条
实际上是把之前写过的 Python 小工具用 ReactJS 快速实现了，在本地 npm build 后快速部署云端，更加轻量级。使用的模型是 Gemini 2.5 Pro，实测思考时间比较久，好处是能实时预览效果，前端样式调整还比较听使唤。
20251119
花了大约半天的碎片时间，用 Gemini 3（辅以少量 Codex）vibe 了一个带有三维预览界面的网页端景深模拟器，效果挺不错。
工作流小记：
1、在 AI Studio 使用 Gemini 3 模型聊天框，输入基本需求和大致界面描述，要求扩展成完整功能描述；再上传计算所需的公式和参考资料作为补充，重复对话几轮后形成编程 prompt；
2、打开 Build 界面输入 Prompt，很快就用 React + Three 框架生成了第一版界面，已经有不错的三维呈现和正确的基本运算功能了；
3、让 Build 文字总结代码结构，针对我自己想改的参数（特别是界面文字和布局参数）问它具体在第几行，方便我手动调整尝试，快速预览；
4、调整 UI 布局花费的时间最多，采用“局部截图+文字修改指示”作为输入会更有效率，多轮迭代慢慢优化成强迫症看了也说得过去的版本；
5、Build 的一大问题是，聊天框上下文长了之后，经常出现只分析不改代码的情况，需要手动提醒它“你的更新没有同步代码库，重新更改”，久而久之这个方法也不奏效，只能清空聊天记录；同时，即使某个源文件只改动了一行，也要再把整个文件重新生成一遍，相对效率较低；
6、一键同步推送 GitHub 后，对于一些难搞的bug，转去 Codex 读代码库再修改，发现 Codex 指哪打哪的能力似乎还是更强一些，特别是在自适应布局的细节微调方面；
7、下载代码包，本地 npm 构建，同步云端运行。
转载请注明来源。欢迎留言评论，欢迎对文章中的引用来源进行考证，欢迎指出任何有错误或不够清晰的表达。