最近我在尝试一件很实用的事，把 iThinkAir 里的大纲笔记，直接变成一份可以打开观看的 HTML 演示文稿。

这件事本身不复杂，但背后有一个挺值得记录的思路，Claude Code 的 Skill 不一定只能在 Claude Code 里用。只要把技能包拿出来，传到 iThinkAir，再让 iThinkAir 按技能说明执行任务，就可以把原来偏开发者的工作流，变成一个更轻量的内容生产流程。

这篇文章就用一个真实例子来讲，我是怎么用 frontend-slides 这个 Skill，把一篇关于 NotebookLM 更新的大纲笔记，转换成 HTML 幻灯片的。

背景，为什么要把 Skill 放到 iThinkAir 里用

frontend-slides 是一个 Claude Code Skill，它的目标很明确，创建零依赖、动画丰富、视觉效果更好的 HTML 演示文稿。

它强调几个原则。

• 单个 HTML 文件即可运行，CSS 和 JavaScript 内联，不依赖 npm，也不需要构建工具
• 生成的是可以直接展示的视觉预览，而不是只给一堆抽象配置
• 每份演示文稿都应该有独特设计，避免一眼看上去就是泛化模板
• 适合把已有内容转换成可演示、可分享的网页幻灯片

如果按原始方式使用，通常需要先能运行 Claude Code，再安装或调用这个 Skill。对开发者来说问题不大，但对只想把一篇笔记变成分享材料的人来说，这个门槛就有点高了。

我的做法是，把这个技能包下载下来，传送到 iThinkAir，然后直接让 iThinkAir 使用技能生成演示文稿。

这样一来，工作流就从「先配置开发环境，再运行 Claude Code」，变成了「写好笔记，选择技能，执行任务」。

准备输入，先写一篇结构清晰的大纲笔记

这次我准备的输入，是一篇 iThinkAir 大纲笔记，标题是「这次新的 NotebookLM 更新改变了一切」。

从截图可以看到，这篇笔记不是普通散文，而是层级化的大纲。

它先给出文章核心观点，再逐层展开 NotebookLM 的变化。

• NotebookLM 从简单笔记工具升级为能自主研究、生成代码并产出成品的 AI 智能体
• 这次更新使用更强的 Gemini 模型，并集成 antigravity 能力
• 工作流从「读资料」变成「造成品」
• 输出形态从总结和引用，扩展到图表、文档、表格、幻灯片等交付物

这种大纲结构很适合转成演示文稿。

原因很简单，幻灯片不是把全文塞进页面，而是要提炼观点、拆分节奏、控制信息密度。大纲本身已经把「主线」和「层级」整理好了，后续技能只需要根据用途和风格，把它转换成可展示的页面。

进入 iThinkAir 的做任务流程

笔记准备好之后，点击 iThinkAir 界面右上角的传送按钮，进入「做任务」。

在任务界面里，可以看到当前笔记内容已经被带入任务输入框。接下来要做的是选择技能。

这里我选择的是 frontend-slides。

同时勾选「补充信息」。

这个选项很关键。它不是让用户自己写一大段复杂 Prompt，而是让 iThinkAir 根据任务需求和所选技能，自动生成一个补充信息采集表。用户只需要按表单补充几个关键选择，就能让技能更准确地理解这份演示文稿要服务什么场景。

用补充信息控制成品定位

选择技能后，iThinkAir 会生成一份补充信息表。

这一步的作用，可以理解成给生成任务补上下文。

例如这次我指定演示文稿用途为「内部分享材料」。这个信息会直接影响后续成品的叙事节奏、信息密度和视觉风格。

如果用途是外部发布，演示文稿可能需要更强的故事感和更明显的传播钩子。如果用途是内部分享，则更适合偏稳重、结构清晰、便于讲解的风格。

截图里还可以看到，补充信息表包含这些字段。

• 用途，用来决定叙事目标和交付形态
• 目标受众，用来控制解释深度
• 阅读或演讲密度，用来控制信息压缩程度
• 期望篇幅或页数，用来约束最终输出规模
• 内容边界，用来明确重点结论优先级

这类表单化补充，对使用 Skill 很有帮助。它把原来隐藏在 Prompt 里的需求拆成了可填写字段，降低了试错成本。

执行任务，生成 HTML 幻灯片

补充信息填写完成后，开始执行演示文稿生成任务。

很快，iThinkAir 返回了执行结果。

从结果可以看到，系统已经根据输入内容生成了一份内部分享用的 HTML 幻灯片。

这份成品采用 frontend-slides 的固定 16:9 舞台方式，风格选择为偏稳重、适合技术或产品更新简报的 Signal 方向。

生成结果里还给出了内容结构。

• 主题，这次新的 NotebookLM 更新改变了一切
• 用途，内部分享材料
• 规模，10 页 HTML 幻灯片
• 重点，从笔记工具到智能体、三项核心变化、对工作流的影响

点击文件链接后，就可以直接观看「NotebookLM 更新内部分享幻灯片」。

这里的体验和传统 PPT 生成不太一样。它不是生成一个需要再下载编辑的工程，而是直接输出 HTML 文件。只要浏览器能打开，就能播放和展示。

这个流程适合哪些场景

我觉得这个方法最适合三类场景。

第一类，是内部技术分享。

比如产品更新分析、竞品研究、AI 工具试用报告、项目复盘。团队成员先在 iThinkAir 里写大纲，再用 frontend-slides 转成可讲解的 HTML 幻灯片，省掉大量排版时间。

第二类，是内容创作者的选题整理。

很多时候我们已经有了文章大纲，但还没有演示稿。这个流程可以把一篇结构化笔记快速变成一份视觉材料，用于直播、课程、社群分享或视频脚本辅助。

第三类，是需要快速验证表达方式的场景。

比如你想知道某个主题适不适合做成分享材料，可以先不做正式 PPT，而是让 iThinkAir 根据大纲生成一版 HTML 演示文稿。看完之后再决定要不要精修。

技术上值得注意的几个点

这个流程真正有价值的地方，不只是「生成了幻灯片」，而是把 Skill 变成了一个可迁移、可复用的能力包。

使用时要注意几个点。

frontend-slides 的输入最好是结构化内容。大纲、分层笔记、Markdown 都比一整段没有层次的长文更适合。

补充信息不要省略。用途、受众、页数、演讲密度这些字段，会直接决定幻灯片是否可用。

如果目标是内部分享，不要只追求视觉炫酷。技术或产品简报更看重信息层级、讲解节奏和结论可见性。

生成 HTML 幻灯片后，最好用浏览器实际打开检查一遍。重点看字体大小、页面切换、首屏信息量和移动端观看效果。

小结

这次实践的完整路径是这样的。

在 iThinkAir 里写好 NotebookLM 更新的大纲笔记，然后通过「传送」进入「做任务」，选择 frontend-slides 技能，勾选补充信息，填写用途为「内部分享材料」，最后执行任务，得到一份可直接观看的 HTML 演示文稿。

它解决的问题也很明确。

不用先配置 Claude Code 环境，也不用手工做 PPT。只要技能包已经传到 iThinkAir，就可以把大纲笔记直接变成一份结构完整、视觉风格明确、浏览器可打开的演示文稿。

对经常写笔记、做分享、整理 AI 工具更新的人来说，这个流程很值得放进日常工作流里。

最后附上生成的演示文稿：