选择你的项目

现在是最有趣的部分——决定要构建什么！

在这次工作坊中，你可以从三个项目创意中选择，或者带来你自己的想法：

项目	描述
个人作品集	一个展示你是谁的精美单页网站
互动问答	一个测试知识并显示结果的有趣游戏
习惯追踪器	一个追踪日常习惯并查看进度的简单应用
你自己的想法	任何你能想象到的东西！

所有路径都通向同一个目的地：一个你可以展示的完整项目！

选项 1：个人作品集

👤

个人作品集

一个展示你是谁的精美单页网站。非常适合求职、拓展人脉，或者只是拥有属于自己的互联网一角。

查看起始提示词（点击展开）

Create a personal portfolio website with:
- A hero section with my name and a short tagline
- An "About Me" section where I can describe myself
- A "Skills" section showing 4-6 things I'm good at
- A "Projects" section with placeholder cards for 3 projects
- A "Contact" section with links to email and social media
- Modern, clean design with a color scheme of your choice
- Mobile-responsive layout
- Use HTML, CSS, and vanilla JavaScript only

选项 2：互动问答游戏

🎮

互动问答游戏

一个测试知识并显示最终得分的有趣问答游戏。非常适合学习用户交互的工作原理。

查看起始提示词（点击展开）

Create an interactive quiz game with:
- A welcome screen with a "Start Quiz" button
- 5 multiple-choice questions about [choose a topic: movies, science, history, etc.]
- 4 answer options per question
- Visual feedback showing if the answer was correct or wrong
- A progress bar showing current question number
- A results screen showing final score with a message based on performance
- Option to restart the quiz
- Fun, colorful design with animations
- Use HTML, CSS, and vanilla JavaScript only

选项 3：习惯追踪器

✅

习惯追踪器

一个追踪日常习惯并可视化你坚持情况的简单应用。非常适合养成良好的日常习惯。

查看起始提示词（点击展开）

Create a habit tracker app with:
- Ability to add new habits with a name and emoji
- A list of habits that can be marked complete for today
- Visual checkboxes or toggle buttons for each habit
- A simple streak counter showing consecutive days
- Data saved in browser localStorage (persists between visits)
- Clean, minimal design with satisfying animations when completing habits
- A weekly view showing which days each habit was completed
- Use HTML, CSS, and vanilla JavaScript only

选项 4：构建你自己的想法！

有其他想法吗？使用我们的提示词生成器来创建你自己的项目提示词！

✨ 提示词生成器

项目类型是什么？

描述你的想法（1-2句话）

主要功能（用逗号分隔）

颜色偏好（可选）

你的自定义提示词：

编写好提示词的技巧

💡 提示词编写技巧：

要具体 - “一个联系表单”太模糊；“一个包含姓名、邮箱、留言字段并带有验证功能的联系表单”才清晰
列出功能 - 使用项目符号有助于 Claude Code 准确理解你想要什么
说明技术栈 - “使用 HTML、CSS 和 JavaScript”让初学者的事情保持简单
描述外观 - “现代简约”或”有趣多彩”能引导设计方向

接下来会发生什么？

一旦你选择（或创建）了你的项目：

复制你的提示词 - 从上面的模板或从提示词生成器中获取
打开 Claude Code - 开始一个新的对话
粘贴并运行 - 将你的提示词交给 Claude Code，见证奇迹发生！

我们将在下一节中一步步引导你完成这个过程。

✅ 检查点