临界态AI教育实战课

课前准备

打开自己的 AI课程文件夹，在里面新建一个文件夹，名称为本课编号（如 lesson-10），然后在 Alma 里面新建一个聊天，设置该项目的文件夹指向新建的文件夹，再把课程资源下载并放入该文件夹。

课程目标

• 学会让 AI 分析优秀作品的特点
• 掌握基于现有作品进行个性化改造的方法
• 理解「以优秀作品为师」的实用工作方法

核心理念：以优秀作品为师

为什么这是最实用的方法？

在实际工作中，很少有人从零开始创造。大多数优秀的作品都是：

• 参考已有的优秀案例
• 分析它为什么好
• 在此基础上加入自己的想法
• 最终创造出更好的作品

AI 最强的能力之一，就是分析和模仿。

当你给 AI 一个优秀作品，它能快速理解：

• 这个作品好在哪里
• 用了什么设计风格
• 如何实现类似的效果

然后，你只需要用自然语言告诉它你想要什么改变，它就能帮你实现。

本课的学习路径

找到优秀作品 → 让 AI 分析 → 提出你的想法 → AI 帮你改造 → 验证效果

我们准备了三个不同类型的优秀作品，你将依次学习如何分析和改造它们。

项目一：数据分析报告

作品简介

这是一个「高考试卷分析报告」网页，视觉效果非常炫酷，有动态粒子背景、数据图表、键盘快捷键等功能。

课程资源包含：

• 项目1-试卷分析/2025高考生物试卷深度分析.html — 最终的可视化网页作品
• 项目1-试卷分析/2025高考生物试卷分析_湖北vs江西.md — 原始分析素材（Markdown格式）

💡 背后的故事：这个炫酷的网页，其实是用 AI 基于那份 Markdown 素材生成的！你可以打开素材看看，里面是纯文字和表格的分析内容，AI 帮它变成了有动画、有图表的可视化网页。

先看看效果：双击打开 项目1-试卷分析/2025高考生物试卷深度分析.html

第一步：让 AI 分析这个作品

把这个 HTML 文件拖入 Alma 对话框，然后输入：

请帮我分析这个网页作品：

1. 整体风格是什么样的？（配色、氛围、给人的感觉）
2. 页面有哪些主要部分？
3. 有什么特别的效果或功能？
4. 这个作品最吸引人的3个地方是什么？

请用简单易懂的语言回答，不需要展示代码。

看看 AI 的分析结果，你会发现它能准确说出这个作品的特点。

第二步：提出你的改造想法

现在，让 AI 帮你在保持内容不变的情况下，改变作品的视觉风格。继续在对话中输入：

我想改变这个作品的视觉风格，但保持所有内容和数据不变。请帮我修改：

1. 把配色从紫色系改成科技蓝色系
2. 把粒子动画的颜色也改成蓝色
3. 保留所有的数据图表和分析内容

请直接生成修改后的完整网页文件。

第三步：验证你的成果

AI 生成新文件后，保存并用浏览器打开，看看效果：

• ✅ 配色变成蓝色系了吗？
• ✅ 粒子动画颜色改变了吗？
• ✅ 所有数据和内容都保留了吗？
• ✅ 整体感觉和之前有什么不同？

恭喜！ 你刚刚完成了第一个作品的风格改造。

挑战自己（递进式）

挑战1：换一种视觉风格

帮我把这个作品改成暖色调的风格（橙色或红色系），让它看起来更有活力，但保持所有数据内容不变。

挑战2：基于同样的素材，生成不同风格的作品

现在试试从原始素材出发！把 Markdown 素材文件拖入 Alma，然后输入：

这是一份高考生物试卷分析的素材。请帮我把它做成一个网页，要求：

1. 整体风格：极简白色系，干净专业
2. 重点突出：用卡片展示各模块的分值分布
3. 交互效果：鼠标悬停时卡片有轻微上浮效果
4. 不需要粒子动画，追求简洁

请直接生成完整的 HTML 文件。

🎯 对比一下：你生成的极简版和课程提供的炫酷版，哪个更适合什么场景？同样的内容，不同的呈现方式，这就是设计的魅力。

项目二：个人作品集网站

作品简介

这是一个现代风格的个人网站，有动态光圈头像、作品展示卡片、渐变背景等效果。

先看看效果：双击打开 项目2-个人网站/kevin-v2.html

第一步：让 AI 分析这个作品

把这个 HTML 文件拖入 Alma 对话框（可以新开一个对话），然后输入：

请帮我分析这个个人网站：

1. 整体设计风格是什么？
2. 页面布局是怎样的？（左边是什么，右边是什么）
3. 有哪些动态效果？
4. 这个网站最专业的3个地方是什么？

请用简单易懂的语言回答，不需要展示代码。

第二步：改成你自己的个人网站

继续在对话中输入（把括号里的内容换成你自己的信息）：

我想把这个网站改成我自己的个人网站。请帮我修改：

## 我的信息
- 姓名：[你的名字]
- 身份：[你的学校] · [你的年级]
- 个人简介：[一句话介绍自己，比如"热爱学习，喜欢用AI创造有趣的东西"]
- 技能标签：[列出3-4个你的特长，比如：写作、绘画、编程、摄影]

## 设计要求
- 保留动态光圈头像效果
- 保留作品展示卡片的样式
- 把配色改成 [你喜欢的颜色，比如：绿色/橙色/粉色]

请直接生成修改后的完整网页文件。

第三步：验证你的成果

保存并打开新生成的文件，检查：

• ✅ 你的名字显示正确吗？
• ✅ 个人简介是你写的内容吗？
• ✅ 技能标签显示正确吗？
• ✅ 配色是你喜欢的颜色吗？
• ✅ 光圈动画还在转吗？

太棒了！ 你现在有了一个属于自己的个人网站。

挑战自己（递进式）

挑战1：修改作品卡片的内容

帮我把作品展示区的3个卡片内容改成：
- 第一个：我的摄影作品集
- 第二个：我的读书笔记
- 第三个：我的AI学习记录

挑战2：在挑战1的基础上，添加新功能

在刚才的基础上，帮我在页面底部添加一个「联系我」的区域，包含邮箱和微信二维码的占位图。

项目三：AI 应用工具

作品简介

这是一个 AI 智能写作工具，有模板系统、设置页面、输入输出区域等完整功能。

先看看效果：双击打开 项目3-AI应用/ai-studio.html

注意：这个工具需要配置 API Key 才能使用，但我们主要学习如何改造它的界面和模板。

第一步：让 AI 分析这个作品

把这个 HTML 文件拖入 Alma 对话框，然后输入：

请帮我分析这个 AI 写作工具：

1. 这个工具的主要功能是什么？
2. 界面分为哪几个部分？
3. 预设模板有哪些？是怎么用的？
4. 这个工具设计得最好的3个地方是什么？

请用简单易懂的语言回答，不需要展示代码。

第二步：改造成专用的 AI 助手

这个工具可以改造成很多不同用途的 AI 助手。选择一个你感兴趣的方向：

选项A：改成「AI 作文助手」

我想把这个工具改成专门写作文的「AI 作文助手」。请帮我修改：

1. 把应用名称改成「AI 作文助手」
2. 把侧边栏的功能入口简化，只保留「智能写作」
3. 把预设模板改成作文相关的：
   - 记叙文：帮我写一篇关于...的记叙文
   - 议论文：帮我写一篇观点是...的议论文
   - 说明文：帮我写一篇介绍...的说明文
   - 读后感：帮我写一篇《...》的读后感

请直接生成修改后的完整网页文件。

选项B：改成「AI 翻译助手」

我想把这个工具改成「AI 翻译助手」。请帮我修改：

1. 把应用名称改成「AI 翻译助手」
2. 把侧边栏简化，只保留「翻译」功能
3. 把预设模板改成：
   - 中译英：把中文翻译成地道的英文
   - 英译中：把英文翻译成流畅的中文
   - 文字润色：帮我润色这段文字，让它更通顺
   - 语法检查：帮我检查这段文字的语法错误

请直接生成修改后的完整网页文件。

选项C：改成「AI 学习助手」

我想把这个工具改成「AI 学习助手」。请帮我修改：

1. 把应用名称改成「AI 学习助手」
2. 把侧边栏简化，只保留「智能问答」功能
3. 把预设模板改成：
   - 知识讲解：用简单的语言给我讲解...
   - 题目解答：帮我解答这道题，并讲解思路
   - 概念对比：帮我对比...和...的区别
   - 学习计划：帮我制定一个...的学习计划

请直接生成修改后的完整网页文件。

选项D：你自己的想法

我想把这个工具改成「[你的想法，比如：AI 日记助手/AI 周报助手]」。请帮我修改：
[描述你想要的名称和4个预设模板]

第三步：验证你的成果

保存并打开新生成的文件，检查：

• ✅ 应用名称改了吗？
• ✅ 侧边栏简化了吗？
• ✅ 模板是你定义的内容吗？
• ✅ 点击模板能正常显示吗？

非常棒！ 你创造了一个属于自己的专用 AI 助手。

挑战自己（选做）

在你的专用助手基础上，继续优化：

帮我修改一下界面配色，让它更符合[作文助手/翻译助手/学习助手]的定位。比如作文助手用文艺的暖色调，翻译助手用专业的蓝色调。

课程总结

你学到了什么

通过这节课，你掌握了一个非常实用的工作方法：

1. 找到优秀作品 → 不需要从零开始
2. 让 AI 分析 → 快速理解作品的特点
3. 提出改造想法 → 用自然语言描述你要什么
4. AI 帮你实现 → 自动完成修改
5. 验证并迭代 → 不满意就继续调整

为什么这个方法有效

AI 的分析和模仿能力是最强的。

即使是专业的设计师和开发者，在工作中也经常：

• 收集优秀案例作为参考
• 分析别人作品的优点
• 在此基础上进行创新

这不是「抄袭」，而是「站在巨人的肩膀上」。

以后遇到类似任务怎么办

当你需要制作一个网页、报告、工具时：

1. 先找参考：在网上找一个你喜欢的类似作品
2. 让 AI 分析：把作品给 AI，问它「这个作品好在哪里」
3. 说出你的需求：告诉 AI 你想改成什么样
4. 持续优化：不满意就继续对话，让 AI 修改

这就是「以优秀作品为师」的完整流程。

课后作业

从三个项目中选择一个，完成以下任务：

1. 用 AI 分析这个作品，截图保存分析结果
2. 按照课程指引改造成你自己的版本
3. 尝试至少一个「挑战自己」的任务

提交要求：

• 分析结果截图
• 改造后的 HTML 文件
• 简单说明你做了哪些改动

恭喜你完成了「以优秀作品为师」课程！

记住：AI 是你的分析助手和创作伙伴。找到好的参考作品，用自然语言告诉它你的想法，它就能帮你实现。这是 AI 时代最实用的创作方法。