guizang-ppt-skill:把 PPT 做成一个可校验的网页

AI 做 PPT，最烦人的地方不一定是“做不出来”。

它当然做得出来。你给一篇文章，让它列大纲、分页面、写标题、补总结，通常都能凑出一份看上去像 PPT 的东西。

问题是，像归像，气质很容易散。

封面一个大标题，中间三张卡片，再来一页流程图，最后“谢谢观看”。你让它高级一点，它就加渐变、阴影、玻璃拟态；你让它极简一点，它又只剩大面积留白和几句口号。

这时候你会发现，AI 不是缺勤快。它太勤快了，什么都敢往上放。

guizang-ppt-skill^[1] 走的是另一条路。它没有急着生成传统 PPTX，而是先生成单文件 HTML，再用模板、版式、主题色、图片槽位和校验脚本，把容易跑偏的地方一块一块按住。

这篇就拆它。

1. 先把来源说清楚

仓库地址在这里：

https://github.com/op7418/guizang-ppt-skill

README 里写得很清楚，它面向 Claude Code、Codex 这类本地 Agent 环境，主要做三件事：

单文件 HTML 横向翻页 PPT
PPT 配图
多平台封面

它内置两套视觉系统。

Style A 是“电子杂志 × 电子墨水”，适合观点分享、个人表达、行业观察，偏叙事。

Style B 是“瑞士国际主义”，适合产品、数据、方法论、分析型内容，强调网格、字号对比和锚点色。

所以别把它当成一个 PPT 主题包。更准确地说，它是一套网页演示系统，顺手把配图和封面也管了。

2. 为什么主流程选 HTML

README 里专门解释了“为什么是 HTML PPT”。

这个选择挺聪明。

PPTX 对人熟，对 Agent 没那么友好。HTML / CSS 是文本，Agent 可以直接读、改、搜索、替换，也可以交给脚本检查。

一页幻灯片可以写成这样：

<section class="slide" data-layout="S08">
  ...
</section>

这一页用了什么版式、图片放在哪个槽位、有没有写 data-layout，都能被脚本扫出来。

传统 PPTX 就麻烦一点。文件当然也能解析，但对 AI 来说，不如 HTML 这种明面上的结构好处理。你让它改一页 PPT，它经常像隔着毛玻璃摸东西；让它改 HTML，至少元素、类名、属性都摆在那儿。

交付也轻。一个 HTML 文件，浏览器直接打开，左右键翻页，触屏滑动，ESC 看索引。线下分享、内部演示、私享会，很多时候已经够用。

当然，它不是什么场景都合适。大段表格数据、多人协作编辑、必须交 PPTX 的项目，还是常规 PPT 工具更稳。

这个 Skill 更适合演讲型 deck：要有风格，要能反复改，还要让 AI 不至于每一页重新发明一次设计。

3. 它把“风格”拆成了文件

很多人给 AI 写 PPT 需求，会这么说：

做成瑞士国际主义风格，高级，极简，有网格系统。

这话听着挺像那么回事，实际很松。

AI 可能字体像一点，颜色像一点，标题却跑到中间，图片不进网格，页面结构也全靠临场发挥。最后看着像瑞士风，细看是散装瑞士风。

guizang-ppt-skill 没把风格只写在一句 prompt 里，而是拆成了一组文件：

SKILL.md
assets/template.html
assets/template-swiss.html
references/layouts.md
references/layouts-swiss.md
references/themes.md
references/themes-swiss.md
references/swiss-layout-lock.md
references/checklist.md
scripts/validate-swiss-deck.mjs

SKILL.md 管总规则和工作流。

template.html 是电子杂志风模板。

template-swiss.html 是瑞士风模板。

layouts.md 和 layouts-swiss.md 给页面骨架。

themes.md 和 themes-swiss.md 限定主题色。

swiss-layout-lock.md 专门锁瑞士风版式。

checklist.md 放踩坑后的检查项。

validate-swiss-deck.mjs 负责校验。

这就比一句“做得高级一点”实在多了。审美经验被拆成模板、版式、主题、检查表和脚本，AI 不用猜那么多。

4. 两套风格，其实是两种做法

Style A 是电子杂志风。

它有 WebGL 流体背景、衬线标题、杂志感图文排版，适合讲故事。行业观察、个人分享、观点型演讲，用它会自然一些。

Style B 是瑞士风。

它更硬，也更适合让 AI 执行。正文页只能从 S01 到 S22 里选，每页都要写 data-layout="Sxx"。不能临时发明新页面结构，SVG 只负责几何图形，不要在 SVG 里写可见文字。

图片也要进槽位。比如 S22 的主图，要绑定 s22-hero-21x9。

这些规矩看着有点烦，其实正好治 AI 的老毛病。瑞士风最怕“差不多”：颜色差不多，字体差不多，骨架已经跑了。

这个 Skill 没把瑞士风当皮肤，它把瑞士风当版式系统。

5. 实现方式：先有模板，再填内容

它的工作流大概是这样：

选风格
问清需求
复制模板
选择布局
填充 slide 内容
可选生成配图
运行检查
浏览器预览
继续迭代

这里最要紧的是前半段：复制模板，选择布局。

它不鼓励 AI 从零写一份 HTML。这个限制很对。从零写最容易出事：类名乱用，CSS 越写越碎，每一页都像临时拼的。

所以它要求先复制模板。

电子杂志风用：

assets/template.html

瑞士风用：

assets/template-swiss.html

模板里已经有 CSS、JS、字体、翻页逻辑、动画、WebGL 或点阵背景。AI 要做的，是把内容填进已经定义好的结构里。

这就像你请设计师做 PPT，先给一套设计系统，而不是只说“你自由发挥吧”。自由发挥听着潇洒，最后往往是返工。

6. 瑞士风为什么还要校验器

这个仓库里有个很有意思的文件：

scripts/validate-swiss-deck.mjs

它是一个 Node 脚本，专门检查生成出来的瑞士风 HTML。

它会看这些问题：

有没有 <section class="slide">
每页有没有 data-layout
data-layout 是不是登记过的 S01-S22
有没有使用 P23/P24 这类实验版式
非 statement 页的顶部标题有没有居中
SVG 里有没有写可见文字
本地图片有没有 data-image-slot
S22 有没有使用 s22-hero-21x9
照片有没有错误地使用 object-position: top center

这些检查不玄乎，但很管用。

AI 做 PPT 最常见的毛病，是每页都偏一点：标题偏一点，图片槽位随手写一点，SVG 里塞几个文字标签，字号再小一点。

单页看还行，十页连起来就散。散得还很平均，挺气人。

校验器的好处，是把这些“差一点”变成能拦下来的错误。能用脚本检查的地方，就别只靠提示词提醒。提示词会被忽略，脚本会报错。

7. 配图和封面也放进同一套系统

这个仓库不只做 PPT，也管配图和多平台封面。

它覆盖这些场景：

公众号 21:9 头图
公众号 1:1 分享卡
小红书 3:4 封面
视频号横版封面
PPT 内部信息图
截图美化
截图再设计

这点很实用。一次分享结束以后，通常还要发公众号、做分享卡、做小红书封面。如果每个平台都重新设计一套，风格很快就散。

guizang-ppt-skill 的处理方式是：PPT、配图、封面都吃同一套视觉规则。

比如瑞士风配图要保持单一锚点色、直角、无阴影、无圆角。生成图只做素材，不要把标题、页脚、页码、角标画进图片里。

这条很细，但很有用。

配图是嵌进 PPT 的素材，不是另一页 PPT。很多 AI 生成配图会自带标题、边框、签名和角标，放进 PPT 后，页面标题和图片标题打架。这个 Skill 直接把这类错误提前禁掉。

8. 怎么安装和使用

把这个 GitHub 地址给 AI：

https://github.com/op7418/guizang-ppt-skill

然后说：

帮我安装 guizang-ppt-skill。

装好后，可以这样用：

帮我基于这篇文章做一份瑞士风 PPT，控制在 7 页左右，需要 2-3 张配图。

或者：

帮我把这份 Markdown 做成电子杂志风演讲 PPT。

也可以让它直接做封面：

基于这份 PPT 的核心观点，生成一张公众号 21:9 头图。

新手可以先从瑞士风试起。它未必更高级，但约束更清楚。对 AI 来说，约束越清楚，越不容易飘。

如果是观点分享、个人表达、线下演讲，电子杂志风会更有味道。产品分析、方法论、技术分享，瑞士风更稳。

9. 公开反馈我会怎么看

我查到的公开资料里，比较扎实的主要是项目 README、Skill 目录页和作者说明。

guizang-ppt-skill 的 README^[1] 里提到，这套 Skill 来自歸藏线下分享 PPT 的实践沉淀。SPONSORS.md^[2] 里也写了项目获得 360 安全龙虾金牌赞助和真格 Token Grant 支持。

这些信息至少能说明，它不是随手写出来玩的。

但我没找到足够稳定的一手长评，没法写“大家用下来都怎样”。这种地方就别硬编口碑了。这篇主要看源码和文档。

就实现看，我更愿意记住这一点：它把美学经验拆成了可复用文件，没有把所有希望都压在一段 prompt 上。

10. 如果自己写一套类似的 PPT Skill

这套 Skill 能迁移的地方很直接。

第一，先决定交付物。

你要的是 PPTX、HTML，还是一组图片？别混在一起。guizang-ppt-skill 很清楚：主流程走 HTML deck，PPTX 不在这条主线上。

第二，先做模板，再让 AI 填内容。

如果想写自己的公众号演讲 Skill，可以先有一个模板：

封面页
问题页
案例页
原理页
步骤页
总结页

每类页面给结构和约束。AI 只负责选用和填充，不要每次从零发明。

第三，主题色要少。

这个仓库不鼓励随便自定义颜色，而是把主题色预设好，让用户选。听起来不自由，但对 AI 正合适。给它太多自由，它不会更有审美，只会更忙乱。

第四，给版式编号。

S01 到 S22 不是形式主义。它让人和 AI 都能说清楚：“这一页用 S08，不要自己写新结构。”有编号以后，检查、复用和修改都容易很多。

第五，能校验的地方写脚本。

是否缺 data-layout，是否用了未登记版式，图片是否缺槽位，标题是否居中，SVG 里是否写文字，这些都不需要大模型判断。用脚本更稳。

第六，把踩坑写进 checklist。

checklist.md 不是泛泛而谈的“注意美观”。它写的是具体错误：瑞士风顶部标题不要居中，字号不能太小，底部分页安全区不要被遮挡，图片不要自带页眉页脚。

这种规则才真的能复用。

11. 我的判断

guizang-ppt-skill 值得学的地方，不在“网页也能做 PPT”。网页 PPT 本身不新。

它有意思的地方，是把分工拆清楚了：模板负责稳定，布局文件负责选择，主题文件负责审美边界，检查表负责留下经验，校验脚本负责拦住跑偏。AI 当然也在里面，但它主要负责理解内容、填充页面、生成配图和迭代。

如果只靠一句“帮我做一份高级 PPT”，AI 大概率会回到默认模板。但你给它模板、版式、槽位、主题色、禁止项和校验器，它就有机会按一套系统工作。

好的 Skill，不靠一句很长的 prompt 撑场面。它得把任务拆成能反复用的工作方法。