上周被李继刚老师邀请去做了场私享会，关于AI和组织的访谈。
散场之后，发现大家问得最多的一句话是：""那个PPT是什么做的，能不能开源一下？""
没想到副产品成了主产品。
索性就把它开源了，叫guizang-ppt-skill（github.com/op7418/guizang-ppt-skill）。
今天这篇文章聊聊这个Skill长什么样，以及作为一个做了十年设计的人，我为什么会觉得它好看。
它长什么样
打开Skill生成的PPT，第一眼的感觉大概是：这不太像AI做的。
几个直观特征：
•
封面：墨色底+衬线大标题，背后一层若隐若现的WebGL流体在缓缓流动
•
正文：底色切回纸白，墨字压在上面，像一本摊开的印刷杂志
•
翻页：横向左右滑动，键盘、滚轮、触屏手势都行，不是PowerPoint的下一页
•
元数据：每页四个角落有小号等宽字，写着""Act II·15/25""这类报刊页码
我给这套视觉基调起了个名字，叫""电子杂志×电子墨水""。
灵感来源是《Monocle》《卫报》《NYT》这类印刷杂志的版式传统，叠加Kindle电子纸的阅读美学，再用当代Web的交互语法串起来。
它能做什么
Skill目前提供10种页面布局、5套主题色预设，和一套完整的翻页交互。
10种布局覆盖了一场15-30页分享会用到的几乎所有页面类型：
开场封面、章节幕封、数据大字报、左文右图、图片网格、Pipeline流程、悬念问题、大引用、Before/After对比、图文混排。
每种都是一段可以直接粘贴的HTML骨架，改掉文字和图片就能用。
5套主题分别对应不同场景：
墨水经典—商业发布、通用默认
靛蓝瓷—科技、研究、AI发布会
森林墨—自然、可持续、人文
牛皮纸—怀旧、文学、独立杂志
沙丘—艺术、设计、创意
每套主题只是6个CSS变量的不同取值，切换主题只要替换:root里那6行代码。
用户不允许自定义hex，后面会说原因。
翻页交互支持键盘左右箭头、鼠标滚轮、触屏滑动、底部圆点跳转、ESC键打开缩略图索引。
尽量接近在浏览器里翻一本真实杂志的体验。
产物是一个单文件HTML，双击浏览器就能看，发给别人也只是一个文件，不用担心字体和动画在别人电脑上乱掉。
怎么用
其实这份Skill真正的价值不在模板本身，而在它定义了一套人×AI协作做PPT的接口。
下面三件事，是我自己用了一周后，觉得最值得告诉别人的。
先跟AI说清这6件事
Skill装好之后，你只需要说一句""帮我做一份杂志风PPT""，Claude会反过来主动问你6个问题：
1.
受众是谁、什么场景？（行业内部/商业发布/私享会）
2.
分享时长多久？（15分钟≈10页，30分钟≈20页）
3.
有没有原始素材？（文档、数据、旧PPT、文章链接）
4.
有没有图片、放在哪？
5.
想要哪套主题色？（5套预设里选）
6.
有没有硬约束？（必须包含XX数据/不能出现YY）
你不用一次说完，它会一条条问。答完之后，它会先给你一份大纲和主题节奏表，对齐之后再开始写代码——这一步拦截了我80%的返工。
以前用AI做PPT最痛的是什么？是它直接开始写，等你看到第10页才发现整体方向就是错的。这套澄清流程把""对齐""前置到了开头。
图片这样塞
图片放在和index.html同级的images/文件夹，文件名有规则：
ppt/
├──index.html
└──images/
├──01-cover.jpg
├──03-figma.png
└──05-dashboard.png
•
页号补零+英文语义——01不是1，cover不是fengmian。方便按顺序排，AI引用也清晰
•
照片用JPG，截图用PNG——截图带文字，PNG保真不糊
•
单张≥1600px宽——大屏投影才不糊
你只需要告诉Claude""第3页是Figma界面截图""，它会自动写成images/03-figma.png，你把同名文件丢进文件夹就行。
无损换图的秘诀：同名覆盖
文案改完想换张图，结果要全局搜替换路径，一不小心就把HTML改坏了。
正确做法只有一句话：新图用同名覆盖旧图，HTML一个字不改。
为什么长成这样
聊完怎么用，聊聊它为什么是这个样子。
好看不是玄学，是一套可以拆解的决策。我做的事，本质上是把杂志行业一百年沉淀下来的排版语言，搬到了HTML里。
字体的三级分工
•
衬线→""观点""。大标题用衬线，读者一眼就觉得""这是一句该被重视的话""。
•
非衬线→""信息""。正文密度高、阅读不累。
•
等宽→""元数据""。页眉页脚的章节号、日期、页码，像杂志页脚，也像终端里的代码。
读者不用费劲想，眼睛自己就知道这句话是正文还是附注。
色彩的纪律
纸白、墨色，加一个重点色，就够了。
纯白刺眼、纯黑暴力，印刷行业从来不这么干，Kindle也是。
Skill的5套主题，底色没有一个是#FFFFFF，字色没有一个是#000000。
每套只暴露6个CSS变量，SKILL.md里写明：不允许用户自定义hex，只能五选一。
约束越严，风格越稳。保护美学，比给用户自由更重要。
网格与节奏
7:5、6:6、8:4几套固定网格保证单页秩序。
hero页和non-hero页必须交替，保证整本的节奏。
一页密、一页疏，就是翻杂志时那种呼吸感。
Skill里写了条硬规则：连续三页以上相同主题会被判为P0错误。
没有节奏的PPT就是一沓slide堆成的PDF。
写在最后
上面这些规则，没有一条是我发明的。
我做了十年设计，UI、交互、AI特效都干过，这些其实都是行业常识。
我只是把它们一条条写进了SKILL.md和checklist.md，让AI能替我逐条执行而已。
换句话说，这个Skill就是我这十年审美的一个压缩包。
以前做一份像样的PPT，我得花两天手动调网格、选字号、抠色值。
现在把素材丢给AI，它按照这些规则直接拼出来，我只需要检查一下。
也正因为这样，我才敢把它开源。
规则本来就不是我的独家，《Monocle》的设计师比我早用了几十年，我只是把它copy到了2026年的HTML里。"