第 3 课 MVP 与页面树

本课定位

如果不提前做页面树，学生很容易一口气想做十几页。我们要学会只保留最关键的 3 到 5 页。

学习目标

• 理解什么叫最小可展示版本
• 画出页面树
• 删掉不必要的页面

本课会用到的技术与方法

• MVP
• 页面树
• 功能取舍

课前准备

• 准备项目标题和对象说明

60 分钟课堂流程

环节	讲授安排
0-10 分钟	回顾项目进度，用 作业规划助手页面树 说明今天的里程碑。
10-20 分钟	拆解今天要完成的页面、交互或项目决策，让每个人都知道先做什么。
20-35 分钟	讲师示范核心做法，并讲清这一步和整个项目主流程的关系。
35-50 分钟	小组推进，边做边记录问题，先保证主流程能跑通。
50-60 分钟	做一次小验收，记录已完成项、卡点和下一步。

核心讲授点

• MVP 不是做得差，而是先把最核心的价值做出来。
• 页面树可以帮你看出哪里重复、哪里太散。
• 删掉一页无关页面，常常比多做一页更重要。

本课完整素材

页面树示例

1. 首页：今天要做什么
2. 任务录入页：填写科目、截止时间、备注
3. 今日优先页：自动按紧急程度显示
4. 总结页：完成情况与提醒

可直接复制给 Codex 的提示词

提示词 1：先做第一版

我是一名中学生，现在想做 一个能直接在浏览器里运行的网页作品。
主题是：作业规划助手页面树

请直接把第一版做出来，页面里一定要有：
- 3 到 5 个核心页面
- 每页一句功能说明
- 第一版不做的功能
- 先做顺序

这次要用到的内容如下：
页面树示例：
1. 首页：今天要做什么
2. 任务录入页：填写科目、截止时间、备注
3. 今日优先页：自动按紧急程度显示
4. 总结页：完成情况与提醒

整体感觉希望是：清爽、字大、适合课堂展示。
请把文件拆清楚，方便我继续改。

提示词 2：把互动做完整

我是一名中学生，我已经有了第一版页面，现在想把互动和课堂节奏补完整。
请帮我继续完善 作业规划助手页面树，重点把下面这些效果补上：
- 3 到 5 个核心页面
- 每页一句功能说明
- 第一版不做的功能
- 先做顺序

这节内容的素材还是这些：
页面树示例：
1. 首页：今天要做什么
2. 任务录入页：填写科目、截止时间、备注
3. 今日优先页：自动按紧急程度显示
4. 总结页：完成情况与提醒

我更在意的是：学生一眼能看懂、按钮明显、操作顺序清楚。

提示词 3：上课或展示前再打磨

我是一名中学生，我准备把 作业规划助手页面树 用在展示或课堂讲解里。
请帮我再检查一遍这个网页，重点把文字、颜色、按钮大小、页面顺序和提示语调顺一点。

课件里一定不能漏掉这些内容：
- 3 到 5 个核心页面
- 每页一句功能说明
- 第一版不做的功能
- 先做顺序

参考内容：
页面树示例：
1. 首页：今天要做什么
2. 任务录入页：填写科目、截止时间、备注
3. 今日优先页：自动按紧急程度显示
4. 总结页：完成情况与提醒

我希望最后拿到的是一版看起来完整、讲起来顺手的成品。

本课产出

• 完成 作业规划助手页面树 的课堂成品
• 完成 作业规划助手页面树 的第一版并能现场演示

课后任务

• 完成项目页面树
• 删掉至少 1 个现在不必要的功能
• 准备下节课的流程草图

讲师提醒

• 先保住本课最小成品，再决定要不要继续加效果。
• 遇到错误时先描述现象，不要急着乱改。
• 提醒学员边做边记录自己改了什么。

下一课衔接

下一节进入 第 4 课 用户流程和低保真草图，把这节课的成果继续推进成更完整的作品或流程。