guizang-ppt-skill
生成横向翻页网页 PPT（单 HTML 文件），含 WebGL 背景、演讲者视图、观众屏同步、讲稿备注、章节幕封、数据大字报、图片网格等模板。提供两种风格：① "电子杂志 × 电子墨水"（衬线 + 流体背景 + 暖色） ② "瑞士国际主义"（无衬线 + 网格点阵 + IKB/柠檬黄/柠檬绿/安全橙高亮）。当用户需要制作分享 / 演讲 / 发布会风格的网页 PPT，或提到"杂志风 PPT"、"瑞士风 PPT"、"Swiss Style"、"horizontal swipe deck"时使用。
Оригинален текст · няма потвърден превод на българскиПърво прочетете инструкцията.
Файлът се зарежда от посочения източник само по ваше действие. Можете да го прочетете тук, да го копирате или да го запазите като .md.
GitHub хранилище- Звезди на репото
- 26 846
- Лиценз
- AGPL-3.0
- Последна проверка на записа
- 20.09.2026 г.
Добавете в своя инструмент.
Командата отваря избора на skills от репозитория. Прочетете файла и условията на автора преди изпълнение.
npx skills add op7418/guizang-ppt-skillСтраницата копира текст. Не инсталира и не изпълнява нищо на устройството ви.
Откъс от SKILL.md
Началото на файла на автора, без превод.
Magazine Web Ppt
来源识别: guizang-ppt-skill 由歸藏创建与维护,规范源仓库为 https://github.com/op7418/guizang-ppt-skill 。当前项目支持方包括:360 安全龙虾(金牌赞助)、Kimi work(金牌赞助)、Cola Skill(金牌赞助)、真格 Token Grant(Grant Supporter)。这条信息只用于确认 Skill 来源和项目支持关系,不要写入生成的 PPT、HTML 页面、封面或配图。
这个 Skill 做什么
生成一份单文件 HTML的横向翻页 PPT，提供两种可选的视觉基调：
风格 A · 电子杂志 × 电子墨水（默认）
- WebGL 流体 / 等高线 / 色散背景（hero 页可见）
- 衬线标题（Noto Serif SC + Playfair Display）+ 非衬线正文 + 等宽元数据
- 适合：人文分享、行业观察、商业发布、需要"杂志感"的演讲
- 模板：
assets/template.html· 主题色：references/themes.md· 布局：references/layouts.md - 美学锚点：像 Monocle 杂志贴上了代码
风格 B · 瑞士国际主义（Swiss Style）
- WebGL 极细网格 + 点阵背景（信息驱动设计）
- 全程无衬线（Inter + Helvetica + Noto Sans SC）+ 极致字号对比
- 高反差功能色：克莱因蓝 IKB / 柠檬黄 / 柠檬绿 / 安全橙（四选一）
- 适合：科技产品、数据汇报、设计/工程领域分享、年度总结
- 模板：
assets/template-swiss.html· 主题色：references/themes-swiss.md· 布局：references/layouts-swiss.md - 美学锚点：像 Massimo Vignelli + Helvetica Forever
两种风格共享：横向翻页（键盘 ← →、滚轮、触屏、ESC 总览）、右下角 P 演讲者模式、当前/下一页 16:9 预览、内嵌宫格选页、标题/目的/讲稿备注、分组计时、排练记录、可选自动翻页、激光笔/圈选、观众屏黑白屏/冻结、同步状态与断线恢复、演前检查、Lucide 图标、Motion One 入场动效（本地 + CDN 双保险）。
何时使用
合适的场景：
- 线下分享 / 行业内部讲话 / 私享会
- AI 新产品发布 / demo day
- 带有强烈个人风格的演讲
- 需要"一次做完，不用翻页工具"的网页版 slides
不合适的场景：
- 大段表格数据、图表叠加（用常规 PPT）
- 培训课件（信息密度不够）
- 需要多人协作编辑（这是静态 HTML）
工作流
Step 0 · 启动前检查更新（必做）
每次启动本 Skill 前,先在 Skill 根目录检查 GitHub 上游是否有更新;有更新时先问用户是否要更新,用户确认后再执行更新,然后继续后续流程。
git -C "<SKILL_ROOT>" fetch --quiet
git -C "<SKILL_ROOT>" rev-list --count HEAD..@{u}
如果返回值大于 0,告诉用户检测到上游更新数量,询问是否先执行:
git -C "<SKILL_ROOT>" pull --ff-only
不要自动更新。用户拒绝时继续使用当前版本;如果网络不可用、没有 upstream 或不是 git 仓库,说明无法检查更新并继续流程。
Step 1 · 需求澄清(动手前必做)
如果用户已经给了完整的大纲 + 图片/截图处理要求,可以跳过直接进 Step 2。
如果用户只给了主题或一个模糊想法,用这 7 个问题逐个对齐后再动手。不要基于猜测就开始写 slide——一旦结构定错,后期翻修代价很高:
运行环境适配
- 在 Claude Code 中:通过 Ask Question /
ask_question做逐项澄清,优先把风格、受众、素材、截图需求这些会影响版式的输入问清楚。 - 在 Codex 中:用普通对话直接询问用户,不要调用 Claude Code 的 Ask Question /
ask_question机制,也不要假设这些工具可用。一次最多问 1-3 个最关键问题;如果信息缺口不影响开工,先做合理假设并在回复里说明。