Item: Guizang PPT Skill
Rating: 8.5
Author: Mnet

Guizang PPT Skill 快速入门

一句话卖点：用 Markdown 指令让 AI 生成 HTML 幻灯片——两套设计系统、零外部依赖、结果直接浏览器打开。

这是什么？适合谁？

Guizang PPT Skill 是一个用 Markdown 指令驱动 AI 生成 HTML 演示文稿的 Skill，GitHub 7.2K+ Stars。不需要安装 PowerPoint、Keynote 或任何依赖——AI 按 Skill 指令直接输出一个单独的 HTML 文件，浏览器打开就是幻灯片。
核心特色：

两套设计系统：
电子杂志风格（Editorial）：大标题、留白多、适合演讲；
瑞士国际风格（Swiss International）：网格系统、极简、适合技术分享；
零外部依赖：生成的 HTML 文件内嵌所有 CSS/JS，离线可用；
纯 Markdown 指令：Skill 本身是 Markdown 格式，兼容所有 AI 编程助手。
适合谁？需要快速出演示文稿的任何人——技术分享、项目汇报、课程讲解。特别适合不想打开 PowerPoint 的开发者。
不适合需要复杂动画、视频嵌入、协作编辑的正式商务场景——HTML 幻灯片在功能和兼容性上不如 PowerPoint。

准备工作

一个 AI 编程助手（Claude Code / Cursor / ChatGPT 等）；
（可选）Web 浏览器（查看生成的 HTML 结果）。
不需要安装任何 Python 包或 Node.js 依赖。

3 步快速上手

第 1 步：安装

将 Skill 文件加载到 AI 助手：

# Clone 仓库<br>
git clone https://github.com/guizang/ppt.git<br>
# 软链到 Claude Code<br>
ln -s $(pwd)/ppt/skill.md ~/.claude/skills/ppt-skill.md<br>
# 或在 Cursor 中放到 rules 目录<br>
cp ppt/skill.md ~/.cursor/rules/ppt-skill.md<br>
```<br>
### 第 2 步：配置<br>
这个 Skill 主要通过对话中的指令选择设计风格：<br>
- 在提示中指定「使用电子杂志风格」触发 Editorial 设计系统；<br>
- 指定「使用瑞士国际风格」触发 Swiss International 设计系统；<br>
- 不指定则默认使用瑞士国际风格。<br>
无需额外配置文件。<br>
### 第 3 步：首次使用<br>
在加载了 Skill 的 AI 助手中输入：
> "请按 PPT Skill 的规范，用电子杂志风格帮我生成一个 10 页的技术分享幻灯片，主题是「为什么应该用 TypeScript」，包含代码示例页、对比页和总结页。"

AI 会输出一个完整的 HTML 文件。保存为 `slides.html`，浏览器打开：

```bash

# 保存 AI 输出

# 然后直接在浏览器打开

open slides.html   # macOS

start slides.html  # Windows

按空格键或方向键翻页，Esc 键进入总览模式。

常见踩坑

AI 生成的 HTML 太大：如果幻灯片页数过多（50+），生成的 HTML 可能超大。建议控制在 20 页以内。
代码块渲染问题：HTML 幻灯片中的代码块需要额外 CSS 高亮。如果代码显示为纯文本，在提示中补充「代码块使用 highlight.js 高亮」。
移动端显示不理想：两套设计系统主要针对桌面 16:9 屏幕优化，手机上看可能排版错乱。
浏览器兼容性：生成 HTML 使用的是现代 CSS 特性（Grid/Flexbox），IE 和旧版 Safari 可能不兼容。
设计风格混用：两个设计系统的 CSS 如果混用会导致风格冲突。确保每次只选一种。

初级用法

快速 5 页介绍：输入「5 页介绍幻灯片，主题 XXX，瑞士风格」；
带数据图表：输入「包含柱状图和饼图的数据汇报幻灯片」；
代码演示：输入「Lightning Talk 幻灯片，每页一个代码片段 + 说明」。

高级玩法

自定义设计系统：修改 Skill 文件中的 CSS 变量（颜色、字体、间距），生成专属品牌幻灯片；
批量生成多语言版本：同一内容，分别指定中英文各生成一版；
和 Anthropic PPTX Skill 配合：先用 Guizang PPT 快速出草稿，再用 PPTX Skill 转成正式 .pptx 文件。

小技巧

先列大纲：让 AI 先生成幻灯片大纲（JSON 格式），确认结构后再生成 HTML；
一页一页生成：如果一次生成 20 页，AI 可能遗漏细节；分批生成 5 页/次，质量更高；
内嵌图片用 SVG：HTML 幻灯片中的图表最好用 SVG 而非 PNG，缩放不失真；
打印友好：生成时追加「添加打印样式表」，方便导出 PDF。

常见问题 FAQ

Q1: 和 Anthropic 的 PPTX Skill 有什么区别？

A: Guizang PPT Skill 生成的是 HTML 幻灯片（浏览器播放），Anthropic PPTX Skill 生成的是 .pptx 文件（PowerPoint/Keynote 打开）。Guizang 更轻量、零依赖、适合快速分享；Anthropic 的生成正式 .pptx，适合需要二次编辑的商务场景。

Q2: 能在 PowerPoint 里打开吗？

A: 不能直接打开。HTML 幻灯片可以在浏览器全屏播放，也可以「另存为 PDF」后分发。如需 .pptx 格式，用 Anthropic PPTX Skill。

Q3: 支持动画和过渡效果吗？

A: 基础版不支持复杂动画。HTML 幻灯片内置了简单的淡入淡出过渡。如需更多动画，可以在生成时追加「添加 CSS 动画」指令。

Q4: 可以自定义主题色吗？

A: 可以。在指令中指定：「主色 #1a73e8、辅色 #34a853、背景 #ffffff」，AI 会按你的色板生成。

Q5: 支持中文排版吗？

A: 支持。两套设计系统都考虑了中文排版（行高、字间距、标点悬挂等），中文内容显示正常。

参考链接

Guizang PPT Skill 仓库：https://github.com/guizang/ppt
Anthropic PPTX Skill（互补）：https://github.com/anthropics/skills/tree/main/skills/pptx
Claude Code Skills 文档：https://docs.anthropic.com/en/docs/claude-code/skills