开卷有易:开源项目推荐,一款生成网页PPT的Skill
- 2026-10-31 14:43:59

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时代,
答案廉价,洞察昂贵。
本系列这些思考的草稿纸, 愿你参照、辨析与超越, 直至走出自己的路。