第一部分：痛点与破局
有没有过这种经历：为线下分享赶制 PPT，翻遍几十套模板不是土得掉渣就是千篇一律，花一下午调排版调配色还是不满意，导出后字体乱掉、图片糊掉，分享还要传大几 MB 的文件，到场又得担心对方电脑有没有装对应软件？
特别是 AI 产品发布、行业私享会、Demo Day 这类需要强个人风格的场合，传统幻灯片根本撑不住场子。你以为想做一套有格调的 Slides 必须自己写前端代码？大可不必。最近在 云栈社区 挖到的宝藏项目 guizang-ppt-skill 就是专门解决这些痛点的——它原生适配 Claude Code / Codex 等 AI Agent，能直接生成 单文件 HTML 横向翻页 PPT，视觉风格融合“电子杂志 × 电子墨水”，格调直接对标 Monocle 杂志，而且你一行代码都不需要写。
第二部分：核心功能深挖
✅ 全链路审美预设，零排版基础也能出大片
所有设计规则全部内置，再也不用纠结审美搭配：
- 字体分工默认拉满：衬线大标题 + 非衬线正文 + 等宽元数据三级体系，省去自己调配的烦恼。
- 5 套官方认证主题色，禁止自定义 hex，确保审美下限不打折：
- 🖋 墨水经典：通用默认、商业发布，不知道选啥就用它
- 🌊 靛蓝瓷：科技 / 研究 / AI / 技术发布会
- 🌿 森林墨：自然 / 可持续 / 文化 / 非虚构
- 🍂 牛皮纸：怀旧 / 人文 / 文学 / 独立杂志
- 🌙 沙丘：艺术 / 设计 / 创意 / 画廊
- 10 种现成页面布局，直接复制粘贴即可上手：开场封面、章节幕封、数据大字报、左文右图、图片网格、Pipeline、悬念问题、大引用、Before/After 对比、图文混排。
✅ 丝滑交互，克制不炫技
交互完全服务内容，不抢视觉焦点：
- 横向左右翻页，覆盖全场景：键盘 ← → / 滚轮 / 触屏滑动 / 底部圆点 / ESC 唤出索引，全平台流畅切换。
- WebGL 流体 / 色散背景仅在 hero 首屏展示，正文页完全克制，内容为王。
- 输出纯净单文件 HTML，不需要构建工具，也不需要服务器，任何浏览器直接打开就能用。
✅ AI 原生工作流，全程交给 Agent 搞定
从需求到成品全流程 AI 引导，不用自己动手：
- 适配所有带 shell 权限的 AI Agent，用自然语言说出想法即可触发。
- 支持
GPT-M 2.0 自动生成配图，覆盖三大类：
- 人文纪实照片：富士 / 徕卡质感，增强人文表现力
- 信息图 / 流程图 / 系统关系图：直观解释抽象概念
- 截图再设计 / UI 情景图：统一视觉风格
- 配图自动遵守规则：不带任何页脚、角标、页码等冗余元素，并自动匹配页面比例。
✅ 内置质量校验，避免低级错误
规则前置，减少返工：
- 内置分级 checklist，P0 级问题必须全部通过才能交付。
- 所有样式走 CSS 变量，切换主题只需修改
:root 下 6 行变量，无需改动其他代码。
- 全部布局类名预先定义，不会出现样式错乱。
第三部分：实战演示
安装方式
方式一：一行命令安装（推荐）
npx skills add https://github.com/op7418/guizang-ppt-skill --skill guizang-ppt-skill
方式二：直接发给 AI 自动安装
把下面这段话复制给 Claude Code / Cursor / 任何有 shell 权限的 AI Agent 即可：
帮我安装 guizang-ppt-skill 这个 Claude Code skill。请按下面步骤做:
- 确保
~/.claude/skills/ 目录存在（不存在就创建）
- 执行
git clone https://github.com/op7418/guizang-ppt-skill.git ~/.claude/skills/guizang-ppt-skill
- 验证：
ls ~/.claude/skills/guizang-ppt-skill/ 应该看到 SKILL.md、assets/、references/ 三项
- 告诉我安装好了，之后我说“做一份杂志风 PPT”之类的话就会触发这个 skill
方式三：手动命令行安装
git clone https://github.com/op7418/guizang-ppt-skill.git ~/.claude/skills/guizang-ppt-skill
触发方式
安装完成后，对 AI 说出以下任意关键词即可触发：
- “帮我做一份杂志风 PPT”
- “生成一个 horizontal swipe deck”
- “editorial magazine style presentation”
- “electronic ink 风格演讲 slides”
使用流程
AI 会自动按照以下 7 步引导你完成整套幻灯片：
- 需求澄清 — 6 问清单：受众、时长、素材、图片、主题色、硬约束
- 拷贝模板 — 复制
assets/template.html 到项目目录，修改 <title>，选择主题色
- 填充内容 — 从 10 种布局骨架中选择，粘贴修改文案，提前做好节奏规划
- 可选配图 — 可选择用
GPT-M 2.0 生成对应配图，按页面比例插入
- 自检 — 对照
references/checklist.md，所有 P0 级问题必须通过
- 预览 — 浏览器直接打开生成的 HTML 文件即可
- 迭代 — 如需微调，可直接修改 inline style 调整字号、间距等参数
第四部分：避坑指南与总结
⚠️ 注意这几个坑，避免踩雷：
- 不适用场景：需要展示大段表格数据的培训课件（信息密度不够）、需要多人协作编辑的场景（输出为静态 HTML）
- 主题色只能从官方 5 套中选择，不允许自定义 hex 值，保证整体审美统一
- 自动生成的配图不能自带页脚、标题、角标、页码等元素，比例必须匹配对应布局
- WebGL 背景仅首屏展示，不要私自给正文页添加动效，避免喧宾夺主
这个工具完全是为追求演讲个人风格的同学量身定做的，尤其适合线下分享、行业私享会、AI 产品发布、Demo Day 的朋友——不必再花大把时间调排版、找模板，交给 AI 几分钟就能生成一套格调拉满的幻灯片，而且仅一个单文件就能随时分享，走到哪里只要有浏览器就能打开，彻底告别兼容噩梦。类似这样的优质开源项目，在云栈社区的 开源实战板块 还有更多，值得深度探索。
GitHub 开源地址：https://github.com/op7418/guizang-ppt-skill
| 
发表于 4 天前
|
查看: 40|
回复: 0
