第 25 课 隔空交互课件：手势翻页、挥手答题与动作触发
本课定位
让老师从“识别到了动作”走到“动作真的能驱动课堂交互”，做出手势翻页、动作答题、隔空选择等教学机制。
本课技术框架
- MediaPipe 交互触发
- 页面状态机
- 动作映射设计
- 触发反馈 UI
学习目标
- 完成一个隔空互动课件页
- 掌握动作到页面指令的映射方式
- 知道如何设计不容易误触的课堂动作
课前准备
- 带来第 24 课的最小识别页
- 选择一个本学科适合隔空互动的环节
课堂流程（60 分钟）
| 时间 | 环节 | 讲师动作 |
|---|---|---|
| 0-10 分钟 | 展示手势翻页、挥手答题的课堂效果 | 展示手势翻页、挥手答题的课堂效果 |
| 10-20 分钟 | 讲解动作映射与误触控制 | 讲解动作映射与误触控制 |
| 20-40 分钟 | 用 Codex 为现有课件加入动作触发逻辑 | 用 Codex 为现有课件加入动作触发逻辑 |
| 40-55 分钟 | 在课堂场景下测试不同动作效果 | 在课堂场景下测试不同动作效果 |
| 55-60 分钟 | 总结“什么动作适合课堂” | 总结“什么动作适合课堂” |
核心讲授点
- 动作交互要简单、明显、容易重复，不适合太复杂的手势组合
- 隔空交互的关键是动作反馈必须足够清楚，学生和老师都要知道触发成功
- 手势交互特别适合抢答、翻页、揭晓答案、切换步骤等课堂动作
课堂案例
隔空答题与手势翻页英语 / 物理课件
让不同学科老师都能看到体感互动的落地点。
Codex 提示词
提示词 1：直接生成第一版课件
text
请直接帮我生成一版“隔空交互课件：手势翻页、挥手答题与动作触发”相关的可运行课件，不要只给页面策划或设计说明。
请直接把课件做出来。
这次课件的要求如下：
- 学科：初中英语七年级
- 课题：单词闯关课件的隔空交互版
- 动作映射：张开手掌进入下一页，挥手揭晓答案，举手暂停 10 秒思考
- 页面需求：题目区、动作识别状态条、成功反馈动画、教师重置按钮
- 本次要做的课件：手势驱动的课堂互动页
请按下面这些要求直接生成代码：
- 请直接把完整代码写出来，不要只写思路、页面说明或大纲
- 页面里的课题、知识点、题目和文案都写完整、写具体
- 页面要适合教室投屏：字号大、按钮大、对比清晰、老师在教室后排也能看清
- 页面里要有真实课堂可用的互动，不要只做成静态展示页
- 请直接给出一个可运行的网页课件
- 至少包含这些文件：index.html、style.css、script.js
- 如果需要摄像头识别，请优先用浏览器可直接运行的方案或 MediaPipe CDN 方案提示词 2：补互动和老师控制
text
请在这个课件里补上课堂互动、即时反馈、老师控制按钮、重置功能和总结页，让老师拿来就能上课。
请直接把课件做出来。
这次课件的要求如下：
- 学科：初中英语七年级
- 课题：单词闯关课件的隔空交互版
- 动作映射：张开手掌进入下一页，挥手揭晓答案，举手暂停 10 秒思考
- 页面需求：题目区、动作识别状态条、成功反馈动画、教师重置按钮
- 本次要做的课件：手势驱动的课堂互动页
请按下面这些要求直接生成代码：
- 请直接把完整代码写出来，不要只写思路、页面说明或大纲
- 页面里的课题、知识点、题目和文案都写完整、写具体
- 页面要适合教室投屏：字号大、按钮大、对比清晰、老师在教室后排也能看清
- 页面里要有真实课堂可用的互动，不要只做成静态展示页
- 请直接给出一个可运行的网页课件
- 至少包含这些文件：index.html、style.css、script.js
- 如果需要摄像头识别，请优先用浏览器可直接运行的方案或 MediaPipe CDN 方案提示词 3：加入摄像头动作交互
text
请把这个课件升级成带摄像头动作交互的版本，让学生可以通过挥手、张开手掌或举手完成翻页、揭晓答案或暂停。
请直接把课件做出来。
这次课件的要求如下：
- 学科：初中英语七年级
- 课题：单词闯关课件的隔空交互版
- 动作映射：张开手掌进入下一页，挥手揭晓答案，举手暂停 10 秒思考
- 页面需求：题目区、动作识别状态条、成功反馈动画、教师重置按钮
- 本次要做的课件：手势驱动的课堂互动页
请按下面这些要求直接生成代码：
- 请直接把完整代码写出来，不要只写思路、页面说明或大纲
- 页面里的课题、知识点、题目和文案都写完整、写具体
- 页面要适合教室投屏：字号大、按钮大、对比清晰、老师在教室后排也能看清
- 页面里要有真实课堂可用的互动，不要只做成静态展示页
- 请直接给出一个可运行的网页课件
- 至少包含这些文件：index.html、style.css、script.js
- 如果需要摄像头识别，请优先用浏览器可直接运行的方案或 MediaPipe CDN 方案本课交付物
- 一份隔空交互课堂页
创意扩展
- 加入班级 PK 模式
- 设计“动作触发闯关地图”