先想后做① · 想清楚 Steve's Repair
本节课目标:在打开 Agent 之前,你会先写出 Steve's Repair 的产品单页(给谁用、解决什么、核心三件事),再画一张架构草图(网站有哪些区块),然后把它们拼成一段能直接发给 Agent 的简报。
本阶段的毕业作品是电脑维修店 Steve's Repair 的官网。本节暂不进入开发，先把目标想清楚。
很多人会告诉agent："帮我做个网站"。但是没有具体清楚的方案,Agent 就只能猜你的需求:猜你的店干嘛的、猜放哪些内容、猜该长什么样。Agent 只会按照你给出的指令执行，不会自动补全你未说明的功能——即使你认为某项功能是理所当然应该包含的。这样来回返工十几次还是不满意,问题常常不在 Agent,而在于你自己也没想明白。
先想后做准备:打开 Agent 前先写的两张纸
每次开工前，先完成两份简短的文档，想清楚后再打开 Agent。每份文档只需寥寥数行即可。
第一张:产品单页。一句话说清三件事:这网站给谁用、帮他们解决什么、核心是哪三件事。连给谁、解决什么都说不清,做出来很可能是个没人需要、却很好看的废品。
第二张:架构草图。这一页从上到下有哪些区块(比方说顶部导航、大标题、服务列表、联系方式)。先摆出骨架,Agent 才知道往哪儿填内容。
想清楚给谁、解决什么,是产品思维;想清楚有哪些块、怎么搭,是架构思维。工具会换、模型会变,这两样一直管用。
本节需要特别注意两点：
1. 先写,再开 Agent。顺序反了,就等于让 Agent 替你拿主意,可它只会猜。
2. 命题就是 Steve's Repair,现在别改成奶茶店、健身房、你朋友的公司。大家用同一个命题,是为了让你专心练"想清楚加指挥"。想发挥个性,留到后面"把这家店做到自己满意"的时候。
先看一张填好的示例表
下面这张是一份示范用的 Steve's Repair 产品单页加架构草图。注意每一栏都填写到了具体的程度，而非"修电脑的人"这类笼统表述。
样张 · Steve's Repair 的产品单页 + 架构草图(供参照, 别照抄, 用它当尺子量你自己写得够不够具体)
给谁用:附近家里或公司电脑突然坏了、急着修好、又怕被路边店坑价的普通人,大多不懂电脑。
帮他们解决:不知道找谁、担心被乱报价、想先弄清楚"这毛病你修不修得了、大概多少钱、怎么联系你"。
核心三件事:
- 都修些什么(电脑、笔记本、系统重装、清灰换件)
- 为什么靠谱(开店十年、明码标价、修不好不收费)
- 怎么找到你(电话、店铺地址、营业时间)
架构草图 · 区块从上到下:
顶部导航(店名 + 一个"打电话"按钮)
大标题区(一句话:十年老店, 电脑手机当天修好)
维修服务列表(台式机 / 笔记本 / 系统重装 / 清灰换件)
为什么选我们(十年、明码标价、修不好不收费)
联系方式(电话、地址、营业时间)
页脚(店名 + 一句版权)
这个示例展示了什么:每一格都能让一个陌生人立刻明白"这家店是干嘛的、凭什么信它、怎么联系"。你的版本不必与样张完全一致，但要达到同等的具体程度。下面由你来填写。
填写表单：产品单页 + 架构草图
▸ 操作：填写下面的表单。把空填上（给谁用、解决什么、核心三件事、页面区块），点「生成简报」，它会把你写的拼成一段话，可以直接复制发给 Agent。下一节
1.4，你就拿它去"后做"。
自检：确认内容合格后再进入下一节
▸ 操作：先点"生成简报"，再点"重新检查"。前四条由系统自动检查（如是否使用了"所有人"这类模糊表述、三件事是否全部填写、区块数量是否充足），后两条需要你自行诚实地判断。修改上方表单后，点击「重新检查」查看结果。
先在上面填几格, 再点「重新检查」, 看看哪几条还差。
遇到问题？参照以下提示修改：
1. "给谁用"写成"所有人"或"需要修电脑的人":太宽。往窄里写,他在什么处境、最怕什么。比如"附近怕被坑价、想找个靠谱师傅的电脑用户"。越具体,Agent 越知道该用什么语气、突出什么。
2. 核心三件事憋不出三件:别硬凑。回到"一个陌生人点进来,最想立刻知道哪三件事",通常就是"修什么、凭什么信你、怎么联系"。
3. 区块列不全或不知列啥:照上面那张样张的六行抄个骨架,再按你的店删掉用不上的。先有骨架,内容下一节让 Agent 填。
下面哪个"给谁用", 最能帮 Agent 做出对路的网站?
不确定"给谁用"该怎么写、区块该列哪些, 或者想让别人帮你把这份简报再打磨一遍?把你填的内容发到群里问问大家, 或者直接向 Abel 或助教提问。