对应ai-coding第 1.1 / 1.2 / 1.3 节 · 形态:Markdown 模板,可直接复制到项目仓库
用途:把「做一个卖课的网站」这种一句话,拆成 AI 能一次做对、你能验收的条目。
一、为什么要拆
「做一个卖课的网站」这句话,人和 AI 都会自己补假设。
你脑子里想的是四页静态站;它可能给你搭一个带支付、登录、后台的系统。它没有做错——是你说的话里有空间。空间就是返工。
拆条目的目的不是写得更长,是把空间填掉。
二、条目格式
每条只写三件事:谁、在什么情况下、要看到什么。再加一条验收。
### R-01 首页课程区展示三门精选
**谁**:第一次访问的访客
**情况**:打开首页并向下滚动到课程区
**看到什么**:三张课程卡片,每张含课程名、一句话说明、节数、价格
**验收(GWT)**
- Given 打开首页
- When 滚动到「课程」区
- Then 显示 3 张卡片,每张可点击,点击进入对应课程详情页
**不做**:不显示「已购买」标记(本期无账号体系)
编号的意义:后续每次对话都说编号——「R-01 的验收第 3 条改成点击进详情」,比「那个卡片的事」清楚一百倍。
三、GWT 验收怎么写
| 要素 | 写什么 | 反例 |
|---|---|---|
| Given | 前置条件(页面状态、数据状态) | 「在正常情况下」 |
| When | 用户动作(具体到点了什么) | 「使用功能时」 |
| Then | 可观察的结果(能看到什么、数值是多少) | 「正常显示」 |
「好看一点」怎么翻译成可测的
| 愿望 | 可测写法 |
|---|---|
| 好看一点 | 标题 28–32 px;卡片间距 24 px;正文对比度达到 WCAG AA(4.5:1) |
| 快一点 | 首屏内容在 3G 模拟下 2 秒内可见 |
| 清楚一点 | 每屏不超过 2 个视觉层级;主按钮每屏最多 1 个 |
| 手机上也能看 | 375 / 768 / 1280 三个宽度下无横向滚动(scrollWidth ≤ innerWidth) |
判断标准:写完这条验收,你能不能自己独立判断「过没过」?不能,就还没写完。
四、本期不做清单(比做什么更重要)
## 本期不做
| 功能 | 为什么不做 | 记录位置 |
|---|---|---|
| 用户登录 | 不做也能完成核心动作(看课、下单) | backlog |
| 在线支付 | 由第三方平台承接,站内不做 | 已决策 |
| 评论 | 需审核机制与运营投入 | backlog |
| 后台管理 | 一期用直接改数据文件的方式 | backlog |
范围每加一项,成本不是加法是乘法。 加「用户登录」会牵出:注册、找回密码、权限、会话、隐私政策、数据存储——一个功能变六个。
判断规则(一句话)
这个功能不做,用户还能不能完成核心动作?
能 → 进 backlog,不进本期。
不能 → 它是本期范围,写进条目。
注意是「记下来」而不是「拒绝」。写进 backlog 的功能,三个月后还想要,那才是真需求。
五、让 AI 先复述,再动手
贴完条目后,第一句不要是「开始做」,而是:
请先复述你对这些条目的理解,逐条说明你打算怎么做。
不要写代码。如果你认为某条需要额外假设,请单独列出。
然后做一件事:找出复述里你没说、它自己补的内容。
典型会被补的假设:
| 它可能补的 | 你实际的意思 |
|---|---|
| 用户登录 / 注册 | 不做,纯静态 |
| 购物车 | 不需要,直接外跳 |
| 后台管理 | 不需要,改数据文件 |
| 数据库 | 不需要,数据写在前端文件里 |
| 响应式框架(React/Vue) | 不需要,原生 HTML + CSS + JS |
| 分页 | 不需要,9 门课一页放得下 |
每一条多出来的假设,都是一处未来的返工。 当场划掉,不要等它做出来再说。
六、完整示例(六条,可参照改)
# 需求条目 · 课程售卖站 v1
## R-01 首页展示课程与学习路径
- 谁:第一次访问的访客
- 情况:打开首页,向下滚动
- 看到:3 门精选课程卡片 + 3 条学习路径入口
- 验收:Given 打开首页 / When 滚动到课程区 / Then 显示 3 张卡片且可点击进详情;When 滚动到路径区 / Then 显示 3 条路径,每条列出所含课程数
- 不做:不做轮播,不做自动播放
## R-02 课程列表支持分类筛选
- 谁:已了解课程、想按方向挑的访客
- 情况:进入课程列表页,点击分类标签
- 看到:列表只显示该分类的课程,当前标签有明显选中态
- 验收:Given 列表页共 9 门课 / When 点击「数据」分类 / Then 只显示该分类课程且数量正确;When 点击「全部」/ Then 恢复 9 门
- 不做:不做搜索、不做排序
## R-03 课程详情页按 id 渲染
- 谁:从列表或首页点进来的访客
- 情况:访问 `course.html?id=<课程id>`
- 看到:课程标题、节数、时长、价格、大纲、FAQ、购买入口
- 验收:Given 合法 id / When 打开 / Then 各区块有内容且价格与数据源一致;Given id 为空或不存在 / Then 显示友好提示并提供返回列表入口,不出现空白页
- 不做:不做课程内视频播放
## R-04 价格页展示三档与组合价
- 谁:准备下单的访客
- 情况:进入价格页
- 看到:单课价格、路径组合价(含省多少)、全站通价格、退款与有效期规则
- 验收:Given 打开价格页 / When 查看任一组合 / Then 组合价 = 所含单课合计 × 0.8 取整到 9 结尾,且显示省额
- 不做:不做优惠券、不做限时倒计时
## R-05 购买入口在未配置时不产生死链
- 谁:准备购买的访客
- 情况:点击购买按钮
- 看到:已配置链接 → 新窗口打开承接平台;未配置 → 按钮不可点并说明原因
- 验收:Given purchaseUrl 为空 / Then 按钮文案为「购买入口待配置」且无 href 跳转;Given purchaseUrl 合法 / Then 新窗口打开且带 rel="noopener noreferrer"
- 不做:不做站内下单流程
## R-06 全站移动端可用
- 谁:手机访问的访客
- 情况:在 375 px 宽度下浏览任意页面
- 看到:内容不横向溢出,文字不重叠,按钮可点
- 验收:Given 375 px 视口 / When 打开每个页面 / Then scrollWidth ≤ innerWidth;When 查看价格表 / Then 纵向堆叠且每项有标签
- 不做:不做独立移动端页面
七、自查
- [ ] 能把一个模糊需求拆成 ≥5 条带编号的条目
- [ ] 每条都有 GWT 验收,且你能独立判断过没过
- [ ] 有「本期不做」清单,至少 3 项,每项写了理由
- [ ] 让 AI 复述过一次,并找出了它自己补上的假设(至少 1 条)
- [ ] 知道 backlog 和「本期不做」的区别(前者可能做,后者明确不做)
*纷析云(杭州)科技有限公司 · codebiz.cn | 本材料为课程配套,随课程版本更新*