前段时间 dsV4 刚出的时候，我就接到了 Claude code 里试了试，跑了几个模型的对比和消融实验，发现性价比确实不错。
偶尔刷抖音会刷到一些 vibe coding 作品，便有了尝试的想法。

选番茄钟主要是因为我对这种 APP 的开发流程的了解是浅薄的，因此，我应该可以较好的作为一个没有相关多少专业基础的人，试试看使用 AI 工具实现作品需要多少精力和成本。

其次也是因为它不需要过于复杂的逻辑和功能的同时也能切实有点用，不至于做不出来或者做个纯玩具。
总结一下：

1. 用时：一周内集中是在晚六点到十点左右，因为我在并行地做别的事，给权限后大段时间都是代码自己在跑，所以只是大致一个参考。
2. 配置：Claude code 接 dsV4-flash
3. 花费：20 块不到，没有太仔细地统计，换算过来不会超过 4 亿 token ，这其中还有很多是因为试错产生的。
4. 成果：一个 13MB 的轻量级本地番茄钟，一些细碎的经验。

下面简单看看成果：

2. 成果#

2.1 主界面#

2.2 挂件窗口#

3. 感受和经验#

3.1 比主干内容更耗时的是各种边界和约束#

大多可以直接感受的内容基本很早就完成了，更多的时间是我打开-发现 bug -让AI修改再打开-继续发现 bug 的过程，包括但不限于：

• 标签只能加不能删
• 标签太长会把按钮挤出去
• 专注时间设计了但是改不了
• 标签全部都是一个颜色
• 分不清物理窗口和内部组件边框导致脏区
• 计时结束的弹窗提醒被杀毒软件拦截
• 挂件窗口打开了关不了
• 挂件窗口停止回到主窗口就再也打开不了挂件窗口
• 加载时使用的启动图布局抖动
• 每次唤出主界面都会加载启动图而不只是首次
• 挂件窗口也会加载启动图
• 标签删除统计里仍然存在
• 主界面和窗口切换时在屏幕上的唤出位置不固定

这些都是比较明显的，还有很多细碎的内容。
这部分很耗费心力的一点是除去最基础的调调窗口尺寸（以我的水平而言）外，任何问题都需要再抛给 AI。
有时它给出了看起来很专业的解决方案但实施后并没有解决问题。
有时我一眼就知道这一定是改 1 行代码就能解决的问题，但是我因为不了解仍然做不到去手动更改。

因此，如果想要在这部分改善体验，要么就是换更强大的 AI ，要么就是下一点内容。

3.2 专业名词的了解是必须的#

这点最关键的地方在于它会直接影响你如何描述问题。
因为用很白的话去描述问题一定是会影响 AI 对问题的定位的，尤其是涉及到 UI 这种没有实际报错但是确实存在问题的方面。

在这个项目里最关键体现就是上面的脏区问题，我最初的描述大致是这样的：

当前项目的 UI 设计中出现问题，窗口的四角存在灰色区域，修复它，让主界面的 UI 色调统一。 

AI 进行了一些很专业的改动，但测试没有解决问题，我又这么说：

问题仍然存在，现在的情况是整个主界面的四角有圆角，存在灰色区域，让整个窗口出现了“双重边框”的视觉效果，排查问题，让整个主界面只有一个外边框。

继续改，依旧没有解决问题，但是我从它的回复里知道了，它叫这块为“脏区”。

到这我已经发现了如果我不能给出更精确的提示词，问题很难解决，于是我把问题给 GPT，让它给我生成了一版提示词：