青少年启蒙营标准案例
使用建议
启蒙营案例的关键不是“做得多复杂”,而是:
- 学员 1 到 2 节课就能看到成果
- 成果一眼能看懂,方便展示
- 学员在做的过程中能体验到
Codex带来的加速感
案例总览
| 案例 | 适合亮点 | 推荐课次 |
|---|---|---|
| 猜数字闯关赛 | 最快建立成就感 | 第 3 课 |
| 我的数字名片站 | 最适合个人展示 | 第 4、7、8 课 |
| 校园故事生成器 | 最适合加入 AI 感 | 第 5 课 |
| 英语单词闯关练习器 | 最贴近真实学习 | 第 3、5 课 |
| 班级活动报名页 | 最适合做“能用起来”的作品 | 第 4、7、8 课 |
学员上课版课件与案例页
这些页面都已经补上:
- 学员上课版 PPTX 下载
- 逐页演示脚本
- 可直接复制的提示词
- 原始素材附件下载
案例 1 猜数字闯关赛
案例要求
- 页面有标题、规则区、输入框、提交按钮和结果提示
- 每次开始时随机生成 1 到 100 的数字
- 学员输入后,页面能提示“太大 / 太小 / 猜对了”
- 能记录猜了多少次,并支持重新开始
实现步骤
- 先让
Codex生成一个基础 HTML 页面骨架 - 加入输入框和按钮的交互逻辑
- 写随机数与比较大小的代码
- 补上猜测次数统计与重新开始
- 最后再让
Codex帮你做视觉美化和动效
推荐提示词
text
请帮我做一个适合中学生展示的“猜数字闯关赛”网页。
要求:
- 使用 HTML、CSS、JavaScript
- 页面要明亮、有游戏感
- 随机生成 1 到 100 的数字
- 用户输入后提示太大、太小或猜对了
- 显示已经猜了几次
- 有“重新开始”按钮
请先给我最小可运行版本,再一步步升级样式。逐步讲解
- 第一步先让学员看到“页面真的能跑起来”
- 第二步再强调:
Codex不只是写样式,也能帮你把逻辑说清楚 - 第三步让学员修改颜色、标题和规则,形成自己的版本
为什么这个案例适合用 Codex
传统方式里,零基础学生往往会卡在“随机数怎么写、事件怎么绑定、状态怎么重置”。Codex 能把这些零散知识迅速拼成一个完整作品,让学生把注意力放在理解逻辑和打磨体验上。
案例 2 我的数字名片站
案例要求
- 首页展示头像、姓名、学校 / 兴趣 / 目标
- 至少包含 3 个信息模块,例如“我的作品”“我喜欢的事”“我的梦想”
- 有 1 个互动元素,例如按钮、标签切换或展开卡片
- 整体风格要明显体现个人特色
实现步骤
- 先梳理“我想让别人记住我什么”
- 让
Codex生成页面结构和分区建议 - 把个人介绍、兴趣、作品内容填进去
- 增加交互元素,比如“查看更多”卡片
- 用
Codex帮你统一颜色、字体和版式
推荐提示词
text
请帮我设计一个适合中学生展示的个人网页,像“数字名片站”。
页面包含:
- 顶部欢迎区
- 我的兴趣
- 我的作品或经历
- 我的未来目标
- 一个互动按钮或展开卡片
风格要求:
- 青春、明亮、不要太像模板
- 手机和电脑都能看
- 用简单清晰的中文逐步讲解
- 先让学员准备自己的素材,避免页面变成空壳
- 再让
Codex把素材“排版成作品” - 最后提醒学员:真正有价值的是“你想表达什么”,不是堆太多特效
为什么这个案例适合用 Codex
传统方式里,零基础学生很难把“我想介绍自己”翻译成网页结构。Codex 可以把“想法 -> 页面 -> 文案 -> 样式”连起来,学生更容易形成作品感。
案例 3 校园故事生成器
案例要求
- 用户可以输入角色、地点或关键词
- 页面有“生成故事”按钮和结果展示区
- 至少支持 2 种故事风格,例如搞笑版、悬疑版
- 结果区要有卡片感,适合展示
实现步骤
- 先定义输入项:角色、地点、风格
- 用
Codex生成带输入区和按钮的基础页面 - 先做假数据版故事生成,保证演示稳定
- 再升级为更像 AI 作品的多风格输出
- 最后增加“再来一个”“复制结果”之类的小功能
推荐提示词
text
请帮我做一个“校园故事生成器”网页。
要求:
- 用户可以输入角色和地点
- 选择故事风格:搞笑、冒险、悬疑
- 点击按钮后生成一段故事开头
- 页面风格像创意写作工作坊
- 先做演示稳定版,不依赖复杂后端逐步讲解
- 这节课重点不在“真的接了多高级模型”,而在于让学生理解 AI 功能可以成为作品的一部分
- 课堂里可以让不同学生输入不同关键词,快速产生大量好玩的结果
为什么这个案例适合用 Codex
传统方式下,学生通常只能做静态网页。借助 Codex,他们能快速做出“输入 -> 生成 -> 展示”的互动体验,成就感会明显提高。
案例 4 英语单词闯关练习器
案例要求
- 至少有 10 个单词题目
- 用户答题后能即时判断对错
- 错题会显示正确答案和简单解释
- 结束后显示得分和鼓励语
实现步骤
- 先整理单词和中文释义
- 请
Codex设计成一题一页或卡片轮播结构 - 加入答题判断和计分逻辑
- 增加错题反馈和结算页
- 最后优化为更像“挑战赛”的视觉风格
推荐提示词
text
请帮我做一个“英语单词闯关练习器”网页,适合中学生使用。
功能要求:
- 一次显示一道题
- 可以选择答案
- 判断对错并解释
- 最后显示总分和鼓励语
- 风格像闯关游戏,不要像普通表单逐步讲解
- 这个案例能把“学习工具”做得很有游戏感
- 讲师可以先提供一组固定单词,再让学生自己替换成自己想练的学科内容
为什么这个案例适合用 Codex
传统方式做互动练习器,学生常常会在题目组织、状态切换、页面反馈上卡很久。Codex 可以先快速搭出题目流程,再留出时间给学生做美化和内容升级。
案例 5 班级活动报名页
案例要求
- 页面介绍活动主题、时间、地点和亮点
- 用户可以填写姓名、班级、想参加的岗位
- 提交后能显示“报名成功”结果
- 页面整体要像真实校园活动海报和报名页
实现步骤
- 先明确活动主题,例如读书会、科技节、义卖、运动会志愿者
- 让
Codex生成活动介绍区和报名表单 - 跑通表单填写与提交成功提示
- 增加视觉海报感,比如主视觉和倒计时条
- 让学生根据自己班级活动改造文案与风格
推荐提示词
text
请帮我做一个“班级活动报名页”网页。
页面要求:
- 看起来像真实活动海报
- 有活动介绍、时间地点、亮点说明
- 有报名表单:姓名、班级、联系方式、岗位选择
- 提交后有成功反馈
- 适合中学生展示,活泼但清晰逐步讲解
- 这类案例最适合做“作品真的有用”的感觉
- 课堂上可以让不同小组做不同活动主题,再做海报 PK
为什么这个案例适合用 Codex
如果传统方式从零搭页面、写表单、做视觉排版,学生很容易被大量细节劝退。Codex 可以把“海报感 + 表单 + 反馈”快速拼起来,让学生更聚焦在创意表达上。