嗨,大家好,我是庆哥。最近我用Claude Code打磨了一个新技能——用网页形式生成一份PPT。
事情的起因是这样的:从去年开始,市面上出现了不少AI制作PPT的工具和大模型。体验了一圈之后,我发现它们有两个共同的瓶颈。
第一,生成的是静态的PPT模版
传统PPT本身其实可以做很多事——动画可以自定义,数据图表可以有交互效果。但目前的AI PPT工具生成的结果,动画没有,图表是静态截图,本质上是用AI操作了一个模板引擎,输出的.pptx文件并没有发挥传统PPT本身的交互能力。
第二,用AI做PPT只能靠你上传资料,读不到你电脑里的东西。
现实中做PPT的场景是什么样的?你的资料散落在各处——本地文件夹里的Word文档、飞书里的项目数据、你需要把这些信息整理、筛选、编排成一份演示文稿。
但现有的AI PPT工具只能接受你主动上传的文件。它不会帮你去翻电脑里的文件夹,也不会帮你去飞书里拉数据。这意味着在"AI生成PPT"之前,你还得自己先做一轮资料收集和整理。
这两点让我觉得,AI做PPT这件事应该还有更好的解法。也希望有更好的方法去验证我的认知:
演示从来不应该被某一个工具所定义,他也并非PPT的代名词。随着AI技术的迭代,演示的形式应该是多元化的。
直到我上周在GitHub上发现了@zarazhangrui的开源项目Frontend Slides——一个基于Reveal.js的网页演示文稿框架。它验证了一个方向:用网页做PPT,交互性和视觉效果都可以比传统PPT更强。
但开源项目提供的是基础框架,距离"让AI帮你做PPT"还有一段路。我需要把它封装成AI可以理解、可以调用的"技能"。
于是我基于这个项目进行了二次开发(后续我还会用自己的专业技能继续迭代)
1.新增了风格参考功能——用户可以提供本地PPT截图或HTML网页作为参考,AI自动提取配色、字体、排版,生成匹配的风格预设,不再局限于预设列表
2.建立了20多种布局模式库,根据内容类型(数据概览、图表、对比分析、总结)自动匹配,这是原来没有的
3.开发了页面入场动画系统,用CSS预隐藏+JS渐显的双轨方案,让每一页的呈现都有节奏感
4.加入了ECharts图表动画预设,不同图表类型(折线图、饼图、柱状图、雷达图)匹配不同的入场节奏
5.修复了CDN在国内不可用的问题、Font Awesome图标渲染异常的问题
扩充了原有的主题预设和HTML模板
最终把它封装成了一个Claude Code技能包。

顺嘴提一句:
Claude Code是Anthropic推出的一款AI编程工具(可以理解为AI编程助手)。技能包是它的一种扩展机制——你把某个领域的专业知识、工作流程、代码模板封装成一个技能文件,AI就能按照这个技能来帮你完成特定的任务。
他的使用方式是这样的:
你可以对Claude Code说:"帮我做一份关于XX的PPT。"
它会自动启动一个5阶段的工作流:确认需求 → 读取我电脑里的资料 → 生成大纲 → 让我选视觉风格 → 生成完整的HTML演示文稿。
注意第二步——它直接读取我电脑里的文件。Word文档、PDF、Markdown,都可以。不需要我先整理好再上传。这正是我前面说的"离真实场景更近"。
生成的演示文稿是一个单独的HTML文件,用浏览器打开就行。支持键盘翻页、画笔标注、浏览器内直接编辑文字,还可以一键部署到网页链接分享。
当做完这个技能包之后,我回头看整个过程,发现它恰好印证了我另一个认知:
过去我们学习一个技能,是老师把知识给你,你通过练习把它变成自己的知识。这是一个单向传递的过程。
AI时代,创作者把能力封装成技能,你使用技能完成工作,然后根据自己的需求迭代这个技能,让它越来越贴合你的场景。同时你也可以把这个迭代的技能反馈和共享。这是一个双向进化的过程。
这个技能包就是一个例子。@zarazhangrui封装了网页演示的基础能力,我在此基础上迭代出了布局系统、动画系统、主题系统,封装成了AI可调用的技能包。下一个使用者可能会在此基础上加入飞书数据看板的对接,或者加入AI自动配图的能力。每一层迭代都在让这个技能变得更强、更贴合实际场景。
而在这个链条中,最核心的能力不是你知道多少知识,而是你清晰的知道 AI能为你做什么
现在我把这个技能包开源出来了也上传到了GIT。包含完整的主题预设、布局模式库、动画系统,以及MIT开源协议。任何使用Claude Code的人都可以直接使用。
不过我很好奇一件事:这个"能力封装 到用户使用反馈 再到技能迭代"的闭环,在不同的使用场景下是否真的成立。不同行业的人做PPT的需求差异很大, 有人侧重数据展示,有人侧重故事叙述,有人侧重视觉冲击。
如果你感兴趣,可以私信我试试这个技能包,告诉我它在你的场景下哪里好用、哪里不好用。这些反馈会帮助我验证一个判断:
在AI时代,最有价值的不是知识本身,而是把能力封装成可迭代的技能,然后让AI帮你调用它。
本项目基于 Frontend Slides(MIT License, © 2025 @zarazhangrui,GitHub: zarazhangrui/frontend-slides)二次开发,由 Hongqing W 新增布局模式库、动画系统、风格参考等功能。