第二课 · 交互式学习清单

Vibe Coding 初体验 · 必做任务 + 选做任务 + 思考题 + 结业检查 + 提示词

总学习进度 0%
已完成 0
0
剩余 0

学习任务 · 共 20 项

📌 任务1:完成贪吃蛇游戏(必做)

跟着操作手册,用豆包或ChatGPT做

📌 任务2:至少加一个功能(必做)

体验"说需求→看效果→再改"的循环

📌 任务3:完成HTML概念练习(必做)

打开「第二课实战平台_Vibe_Coding沙盘.html」

🌟 任务4:给贪吃蛇加3个以上功能(选做)

🌟 任务5:自己想一个小功能(选做)

比如:加一个"穿墙模式"(蛇从一边出去从另一边进来)

🌟 任务6:做一个别的小游戏(选做)

试试让AI做一个猜数字游戏、打砖块或者2048

💭 思考题(5 项 · 不用写答案,想一想就行)

结业自检清单 · 共 27 项

对照以下每一项,确认自己是否掌握。打勾的越多,说明你学得越扎实。

📚 概念理解(10 项)

🛠 实操能力(7 项)

💬 沟通技巧(5 项)

🧠 心态准备(5 项)

🎓 全部打勾了?

恭喜你完成第二课!你已经亲手用AI做出了一个游戏,体验了Vibe Coding的完整流程。下节课我们会认识更专业的AI编程工具,继续加油!

提示词模板 · 共 7 个

使用方法:复制模板 → 发给豆包或ChatGPT → 按AI给的代码操作

模板一:贪吃蛇基础版

帮我做一个贪吃蛇游戏,要求如下:

1. 做成一个单独的HTML文件,包含所有代码,双击就能在浏览器里打开玩,不需要安装任何东西。

2. 游戏功能:
- 用键盘方向键控制蛇上下左右移动
- 屏幕上随机出现红色食物
- 蛇吃到食物后身体变长,分数加10分
- 蛇撞到墙壁或撞到自己身体就游戏结束
- 界面上方显示当前分数
- 有"开始游戏"和"重新开始"按钮
- 游戏结束后显示最终分数

3. 界面要求:
- 深色背景,蛇用绿色,食物用红色
- 界面简洁好看
- 游戏区域大小400x400像素

4. 技术要求:
- 用HTML+CSS+JavaScript写在一个文件里
- 代码要有中文注释
- 确保代码完整可以直接运行

请把完整的代码放在一个代码块里给我。

模板二:加难度选择

在游戏开始前加一个难度选择:简单、普通、困难。简单蛇移动慢,困难蛇移动快。

模板三:加音效

给游戏加上音效:吃到食物时有'叮'的声音,游戏结束时有提示音。用Web Audio API实现,不需要外部音频文件。

模板四:换颜色

把蛇的颜色改成蓝色,食物改成金色,背景改成深紫色。

模板五:加最高分记录

加一个最高分记录,用localStorage保存,关掉浏览器再打开最高分还在。

模板六:加暂停功能

加一个暂停功能,按空格键暂停/继续游戏,暂停时显示'已暂停'三个字。

模板七:加手机触屏支持

加上手机触屏支持,可以在手机上滑动屏幕控制蛇的方向。

💡 提示:打开豆包或ChatGPT,粘贴模板即可使用

0
本次检查得分(满分 100)

已保存