开卷有易:开源项目推荐,一款生成网页PPT的Skill
- 2026-05-31 05:30:13
15秒速览本文
本次推荐一个开源的AI PPT技能库，一句话让Claude/Codex生成专业演示文稿。
内置两套视觉系统：电子杂志风（讲故事）和瑞士国际主义（讲数据）。输出单文件HTML，支持AI配图、多平台封面生成，浏览器直接演示。适合分享路演，不适合复杂表格。安装只需一行命令，30秒上手。
关于Skills的相关知识，可以参考“开卷有易”系列的上一篇文章：《开卷有易：一文搞懂skills》
1 - 为什么你需要这个工具
做PPT是职场人的必修课，但传统方式费时费力。本次推荐的这个开源项目，让你只需一句话就能让AI生成专业级演示文稿。它不依赖PowerPoint或Keynote，而是直接输出单文件HTML，浏览器打开就能演示。
这个项目的核心思路很清晰：把PPT制作交给AI Agent，人只负责把关内容。它适配Claude Code、Codex等主流AI编程助手，内置两套成熟视觉系统，从内容到配图到封面一站式解决。
2 - 30秒上手：安装与使用
安装只需一行命令：
npx skills add https://github.com/op7418/guizang-ppt-skill --skill guizang-ppt-skill没装Node.js也没关系，直接把下面这段话复制给AI智能体（比如上一篇文章提到的OpenCode）：
帮我安装 guizang-ppt-skill。请把 https://github.com/op7418/guizang-ppt-skill 克隆到 ~/.claude/skills/guizang-ppt-skill，安装完成后检查 SKILL.md、assets/、references/ 是否存在。
装好后直接说人话：
"帮我基于这篇文章做一份瑞士风PPT，控制在7页左右" "帮我把这份Markdown做成杂志风演讲PPT" "基于这份PPT生成一张公众号21:9头图"
AI会自动调用技能库，按标准流程完成制作。
3 - 两套视觉系统：叙事与事实的分工
这个技能库最聪明的设计，是把PPT分成两种"性格"：
3.1 - Style A：电子杂志风
像《Monocle》杂志贴上了代码，适合讲故事、表达观点、个人分享。
10种布局：封面、章节页、数据大字报、图文混排、图片网格、流程图、对比页等 5套主题色：墨水经典、靛蓝瓷、森林墨、牛皮纸、沙丘 风格关键词：留白、呼吸感、叙事节奏、人文气息
3.2 - Style B：瑞士国际主义
网格至上、直角、发丝线、极致字号对比，适合产品发布、数据分析、方法论展示。
22种锁定版式：封面、声明页、KPI塔、循环图、双栏对比、图片英雄页、收尾宣言等 4套锚点色：克莱因蓝、柠檬黄、柠檬绿、安全橙 风格关键词：严谨、秩序、信息密度、专业可信
怎么选？ 要打动人心选A，要说服理性选B。不确定就默认用瑞士风配克莱因蓝，最稳妥。
4 - 核心能力一览
4.1 - 横向翻页体验
生成的PPT是左右滑动式，支持键盘方向键、滚轮、触屏滑动、底部圆点导航，按ESC可调出页面索引。比传统上下翻页更有现代感。
4.2 - AI配图全流程
在Codex环境中，AI可以调用GPT-Image 2.0生成配图：
人文纪实照片：富士/徕卡感的真实场景 信息图/流程图：把抽象概念可视化 截图美化：给产品截图加CleanShot X风格的背景画布 数据大字报：把关键数字做成视觉锤
配图严格遵守"素材原则"：不自带页脚、标题、角标，比例先匹配页面槽位（常用21:9或16:10）。
4.3 - 多平台封面生成
同一套视觉规则，可以延伸出：
公众号头图（21:9） 公众号分享卡（1:1） 小红书封面（3:4） 视频号横版（16:9）
4.4 - 低性能静态模式
按B键关闭WebGL动画，动态背景退回静态，老旧电脑也能流畅演示。
5 - 标准工作流程
这个技能库不是"黑箱"，而是有章法的结构化流程：
选风格：A或B，决定整体气质 需求澄清：AI会问你7个问题——风格、受众、时长、素材、图片需求、主题色、硬约束 拷贝模板：从assets目录拿基础HTML 填充内容：先做主题节奏表，再从布局骨架里挑合适的粘贴修改 可选配图：确认需要后生成并插入 自检：对照checklist.md，P0级问题必须全过；瑞士风还要跑版式校验脚本 预览迭代：浏览器直接打开，边改边看
瑞士风有专门的校验命令：
node scripts/validate-swiss-deck.mjs path/to/index.html它会拦住居中标题、实验版式、SVG内写字、图片脱离槽位等常见问题。
6 - 适合谁用？不适合谁？
适合：
线下分享、行业内部讲话、私享会 AI产品发布、Demo Day路演 带强烈个人风格的演讲 需要快速产出视觉统一的内容矩阵（PPT+封面+配图）
不适合：
大段表格数据的财务汇报 需要多人协作编辑的场景（它是静态HTML） 培训课件（信息密度不够）
7 - 设计原则：克制与结构
项目作者歸藏在多次线下分享中沉淀出8条核心原则：
克制优于炫技 — WebGL背景只在封面页点缀 结构优于装饰 — 靠字号对比和网格留白，不用阴影浮动卡片 图片是第一公民 — 对齐正文区，比例稳定，只裁底部 配图只做素材 — 不要把PPT的页脚标题画进图片里 节奏靠Hero页 — 强调页和普通页交替，眼睛不累 低性能可退场 — 动画不能成为阅读负担 术语统一 — Skills就是Skills，不中英混译 瑞士风必须守版式 — 不要为了"多样"发明不存在的页面结构
这些原则写在代码里，也写在checklist.md里，确保AI每次生成都不跑偏。
8 - 文件结构速览
guizang-ppt-skill/├── SKILL.md # 工作流、原则、常见错误├── assets/│ ├── template.html # 杂志风模板│ ├── template-swiss.html # 瑞士风模板│ └── screenshot-backgrounds/ # 截图美化背景├── scripts/│ └── validate-swiss-deck.mjs # 瑞士风校验器└── references/ ├── layouts.md / layouts-swiss.md # 布局骨架 ├── themes.md / themes-swiss.md # 主题色预设 ├── image-prompts.md # 配图提示词手册 ├── screenshot-framing.md # 截图适配指南 └── checklist.md # 质量检查清单所有文档都是Markdown，人类可读，AI可执行。
9 - 常见问题
Q：能导出PPTX吗？A：当前核心交付是HTML。可以浏览器演示、截图或录屏。需要PPTX建议把HTML当视觉稿再转换。
Q：为什么不能自定义颜色？A：自由选色容易破坏整体风格，预设主题是为了稳定产出。保护美学比给自由更重要。
Q：没有配图能做吗？A：完全可以。配图只在需要照片、信息图或封面时使用，纯文字PPT也很完整。
Q：怎么更新？A：重新运行安装命令，或在skill目录执行git pull。
10 - 写在最后
这个项目的价值不只是"让AI做PPT"，而是提供了一套可复用的视觉工程化方案。它把设计师的审美判断写成规则，把制作流程拆成 checklist，让AI在约束中发挥效率。
对于内容创作者、创业者、经常需要做分享的知识工作者来说，这是一个能实实在在省时间的工具。你不需要懂CSS，不需要调排版，只需要说清楚要什么，AI会按标准交付。
项目地址：https://github.com/op7418/guizang-ppt-skill
AI时代，
答案廉价，洞察昂贵。
本系列这些思考的草稿纸， 愿你参照、辨析与超越， 直至走出自己的路。
