宝玉 (@dotey) “【3】两天 20 个原型——AI 时代的产品迭代长什么样 以前做产品原型，两天能做出两个就” — TopicDigg

【3】两天 20 个原型——AI 时代的产品迭代长什么样 以前做产品原型，两天能做出两个就算效率高了。 Boris 花两天做了 20 个。 这不是夸张，是他开发 Claude Code 的 todo list 功能时的真实记录。他甚至把每一步的提示词和截图都分享了出来。 我们来看看这 20 个原型是怎么迭代的。 第一版，他想让 todo 列表显示在最近一次工具调用的下方。提示词很短：“让 todo 不要随着输入出现，而是在输入框上方显示一个固定的 todo 列表，标题用灰色显示 '/todo (1 of 3)'”。 看了看效果，不太满意。 第二版，改成在每个 todo 更新时内联显示。提示词：“其实不要显示 todo 列表，改成在模型开始处理一个 todo 时，把工具名称渲染成粗体标题。保留'step 2 of 4'这样的进度显示。” 还是不对。 第三版和第四版，他尝试做一个“交互式药丸”——屏幕底部一个小方块，点开能看进度。“在文字输入框下面加一个 todo 药丸，类似后台任务的样式，显示 'todos: 1 of 3'。”然后：“让这个药丸可以交互，像后台任务药丸那样。” 有点意思了，但还不够好。 第五版和第六版，他换了个思路：做个从右边滑出来的“抽屉”。“把之前的药丸和标题都撤销，改成在输入框右边显示 todo 列表，垂直居中，用灰色分隔线隔开。”“有点跳，能不能做成抽屉动画？” 看起来挺酷，但实用性存疑。 第七到第九版，他又把 todo 列表挪到输入框上方，试验不同的截断方式和标题样式。“如果超过 5 个就显示'... and 4 more'”，“加个灰色的 'Todo:' 标题”。 离答案越来越近了。 第十到二十版，他开始琢磨怎么把 todo 列表和加载动画结合起来。最后的解决方案是把进度信息放到 spinner（加载指示器）旁边，最大化可见性。 发布后，用户反馈说想看完整的 todo 列表。于是又加了一个迭代：按 Ctrl+T 可以展开全部步骤。 这就是现在线上的版本。