5.2 第一个小工具（MiMo 主线）
上一讲你在浏览器里让 AI 吐出了一个会变色的「你好，世界」。这一讲做一个每天真的会用的东西：一个背单词卡片网页——能翻页、能自测「认识/不认识」、错题自动进一个清单。全程主线用 MiMo（网页起步）+ MiMo Code（进阶），免费兜底 DeepSeek/Kimi/智谱清言。
做完你会发现：vibe coding 的核心动作不是「生成」，而是提需求 → 验收 → 迭代这个循环。
本讲你将学到
- 开工前的「三问」：给谁用、解决什么麻烦、做到什么程度算好
- 两级实战：网页对话做出第一个能跑的版本 → MiMo Code 升级成多文件小工具
- 需求提示词模板（可直接复制改用）与迭代提示词的写法（改哪里、怎么改、别动什么）
- 三模型对比实验：同一需求喂 MiMo / Kimi / DeepSeek，怎么公平打分
- 翻车急救手册：四种最常见的死法与自救动作
前置：5.1 Vibe Coding 是什么（三阶路线与预期管理）；进阶部分需要先按 4.2b MiMo Code 体验 Agent 装好 MiMo Code——没装也不影响，热身和对比实验用网页版就能完成。
1. 开工三问：比提示词更重要的事
新手跳过这一步直接「帮我做一个背单词软件」，然后收获一个四不像。动手前先回答：
- 给谁用？——我本人（自用工具，不用考虑别人的习惯）；
- 解决什么麻烦？——纸质单词书翻着累，现有 App 广告多/强制打卡，我只想要「看卡片 → 自测 → 错的重看」；
- 做到什么算好？（验收标准）——写下来，例如：
- [ ] 打开就能背，不用注册登录
- [ ] 每次显示一个单词，我能标记「认识 / 不认识」
- [ ] 标「不认识」的单词自动进一个错题清单，随时能看
为什么验收标准要先写
它是你验收 AI 产出的唯一依据——AI 说「已按您的要求完成」不算数，你的清单才算数。这也是全站反复强调的验收思维在编程场景的落地。
2. 热身：网页对话做出第一个能跑的版本（零安装）
工具：MiMo 网页/App（主线；DeepSeek、Kimi、智谱清言 免费版均可）。需求提示词模板：
【角色】你是前端开发工程师，帮我做一个给零基础用户自用的网页小工具。
【需求】一个背单词卡片网页，功能：
1. 页面中央显示一张单词卡片：正面是英文单词，点击翻面显示中文释义；
2. 卡片下方两个按钮：「认识」和「不认识」；
3. 点「不认识」的单词自动进入「错题清单」，页面角落有入口随时查看；
4. 内置 10 个大学英语四级高频词作为示例数据。
【约束】
- 全部代码放在一个 HTML 文件里，不依赖网络和额外文件，保存后双击就能用；
- 浅色清爽界面，按钮大一点，手机浏览器打开也能正常显示；
- 先给我完整代码，再附一段「怎么保存、怎么打开」的说明。拿到代码后的固定流程：
- 保存：新建文本文件 → 粘贴代码 → 另存为
words.html（保存类型选「所有文件」，编码选 UTF-8，防止中文乱码）； - 打开：双击文件，浏览器里打开；
- 验收：对着第 1 节的清单逐条打勾；
- 迭代：不合格的地方，用下面的迭代提示词模板发回去。
迭代提示词的黄金结构：改哪里 + 怎么改 + 别动什么
刚才的 words.html 有两个问题，请修改：
1. 错题清单入口太小找不到——改成页面右上角一个明显的按钮；
2. 单词只有 10 个不够——把示例数据扩充到 30 个，仍然用四级高频词。
【别动】其他功能（翻卡、认识/不认识按钮）保持原样，不要重构代码结构。
把修改后的完整代码重新给我，不要只给片段。「别动什么」这句是老手与新手的分水岭：不加约束的话，AI 顺手「优化」其他部分，改好了 A 又弄坏 B，你就陷入打地鼠循环。
3. 正餐：用 MiMo Code 升级成真正的小工具
网页对话适合单文件小东西；当工具变大（多个页面、样式分离、数据单独存），就要请出 MiMo Code——小米开源的命令行 AI 编程工具，能直接在你电脑的文件夹里创建和修改文件，连续多轮迭代不必每次复制粘贴。它内置限免模型，学生党零成本上手。
**还没安装？**先去 4.2b 小米线：MiMo Code 体验 Agent——那里有保姆级安装步骤和对非计算机专业同学的终端使用提示（终端 = 用文字命令操作电脑的窗口，第一次见不慌，跟着做就行）。
装好之后，本节的玩法变化只有两点：
- 需求照样用第 1、2 节的模板发，但可以提更高的要求，例如「把单词数据单独放在一个文件里，方便我自己增删词库」「加一个每日学习记录，显示我今天背了几个」；
- 文件由 MiMo Code 自己创建和修改，你负责在浏览器里刷新验收——这就是 第 4 篇说的「从对话到委托」在编程上的样子。
不管工具多聪明，两条安全边界
4. 对比实验：同一需求喂三个模型
这是本讲最有含金量的练习——亲手验证「不要只依赖一家」（1.2 其他国产模型地图的忠告）：
- 把第 2 节的需求提示词原样分别发给 MiMo、Kimi、DeepSeek（同一时段、同一措辞，控制变量）；
- 三个版本各自保存为
words-mimo.html、words-kimi.html、words-deepseek.html，逐个打开； - 按下表打分（每项 0-2 分：0 差 / 1 一般 / 2 好）：
| 验收项 | MiMo | Kimi | DeepSeek |
|---|---|---|---|
| 功能完整（翻卡 + 双按钮 + 错题清单） | |||
| 一次就能跑起来，无需修 bug | |||
| 界面清爽、手机上不乱 | |||
| 代码说明清楚，新手能看懂怎么保存 | |||
| 总分 /8 |
怎么解读结果
- 没有永远的赢家：这一局 A 胜，换个需求可能 B 胜——所以结论不是「无脑用 X」，而是「我的这类需求谁顺手」；
- 一次实验不构成排行榜：样本只有 1，重在体会「场景实测 > 跑分」（1.4 怎么看排行榜不踩坑）；
- 想再进阶：把你的打分结果和理由发回给落后的模型，看它能不能照着反馈改到及格——这一步就是「教 AI 逼近我的标准」。
5. 翻车急救手册：四种最常见的死法
| 死法 | 症状 | 自救动作 |
|---|---|---|
| 看不懂报错 | 浏览器一片空白 / 终端一屏红字 | 整段报错原样复制发回给 AI：「运行后出现以下报错，请定位原因并修复」——不要自己瞎猜，报错信息就是 AI 的病历 |
| 功能对不上 | 做出来的东西和想的不一样 | 回到验收清单，指出具体哪条不达标——抽象抱怨（「感觉不好」）只会得到抽象修改 |
| 越改越乱 | 修好一个坏两个，代码越来越长 | 止损：回到上一个能跑的版本重来（所以每验收通过一版就另存一版，words-v2.html、words-v3.html……）；或明确要求 AI「重写这个功能，保持其他部分不变」 |
| 根本做不出来 | 迭代五轮还是四不像 | 大概率是需求太大——拆小：先砍到「只显示单词 + 翻面」能不能做出来？能再加下一个功能。参考 5.1 的三阶路线，退回「玩具」阶不丢人 |
版本备份习惯（受用终身）
每通过一次验收就另存一版。AI 改崩了随时能回到好版本——这个习惯在 5.3 把工具变成作品集时，还是你「迭代过程」的证据。
跟做练习
实践（约 40 分钟）
- 完成第 2 节热身：做出自己的
words.html，验收清单全过； - 完成第 4 节三模型对比实验，把打分表截图存档（5.3 要用）；
- 挑战题（可选）：给工具加一个「今日已背 N 个」的计数显示——用迭代提示词模板，记得写「别动什么」。
下一步
工具做出来了、对比实验也跑了，但它现在还只是「你自己用的小东西」。下一讲讲怎么把它迭代成简历上拿得出手的作品——以及怎么诚实又不吃亏地讲清楚「AI 帮你做了什么」→ 5.3 从工具到作品集
本页核验日期：2026-09-22（MiMo Code 开源与限免模型口径取自 docs/01 调研快照并经当日搜索复核；三模型对比为教学实验设计，不预设胜负结论；MiMo Code 安装细节以 4.2b 当期核验为准）