AI 做 PPT 模板看腻了？这个 Skill 让 Claude 直接给你生成可演示的 HTML Slides

每次做分享、路演、或者给客户看方案，你花最多时间的部分是什么？对我来说，永远不是内容，而是把 PPT 做得像那么回事。

直到我遇到了这个开源 Skill：frontend-slides，来自 affaan-m/ECC 这个超火的 Agent Skill 合集项目。

它是什么？

简单说，就是一个教 Claude Code 用纯 HTML 做幻灯片的 Skill。不需要 Keynote、不需要 PowerPoint、不需要任何设计软件——你给 Claude 一份讲稿或一个主题，它直接给你生成一个可以在浏览器里跑起来的 HTML 演示文稿，而且自带动画、过渡、响应式适配。

为什么我敢说它不一样？

市面上的 AI 做 PPT，本质上是”填模板”：给你套个蓝白渐变，塞几行字，完事。frontend-slides 的思路完全不同：

• 零依赖：输出就是一个 HTML 文件，内联 CSS + JS，双击就能跑，不需要任何服务器或构建步骤。
• 视口优先：每一页幻灯片严格适配屏幕，不允许滚动条，保证演示时不出意外。
• 视觉探索：不确定想要什么风格？让它先出 3 版预览页给你挑，再继续做完整 deck。
• 动画不是摆设：包含键盘导航、触摸滑动、鼠标滚轮、进度指示器，还有进入动画——不是那种为了炫技而加的噪点动画。

适合谁？

• 经常要做 pitch deck 的创业者和设计师
• 想用 AI 提升演示效率的产品经理
• 把 Claude Code 当日常工具的工程师
• 任何受够了 PowerPoint 模板审美疲劳的人

怎么用？

前提是你装了 Claude Code。然后把 frontend-slides 这个 Skill 装进去，告诉 Claude 你要做什么主题的 presentation，附上你的讲稿或要点，它就会自动走一遍工作流：识别内容模式 → 推荐风格 → 生成预览 → 构建完整 deck → 验证适配度 → 交付。

也支持把现有的 .ppt/.pptx 文件转成 HTML 演示文稿，这个功能对存量素材特别实用。

我的评价

真正的 AIGC 不是”AI 帮你填色”，而是 AI 重新定义工作流。frontend-slides 就是这类 Skill 的典型代表——不是给你一个更好的 PPT 模板，而是把”做幻灯片”这件事本身变得更像写代码、更轻量、更可自动化。

如果你用 Claude Code / Cursor / Codex，强烈建议把这个 Skill 装进你的工具箱。做 deck 的时间，可以从几小时压缩到几分钟。

GitHub：https://github.com/affaan-m/ECC/tree/main/skills/frontend-slides

项目主页：https://github.com/affaan-m/ECC

GitHub: https://github.com/affaan-m/ECC/tree/main/skills/frontend-slides