Guizang Ppt Skill

生成横向翻页网页 PPT(单 HTML 文件),含 WebGL 背景、章节幕封、数据大字报、图片网格等模板。提供两种风格:① "电子杂志 × 电子墨水"(衬线 + 流体背景 + 暖色) ② "瑞士国际主义"(无衬线 + 网格点阵 + IKB/柠檬黄/柠檬绿/安全橙高亮)。也支持生成多平台封面(公众号 21:9、Facebook 1.91:1、Instagram 1:1/9:16、LINE 16:9、YouTube 缩图、LinkedIn 横幅等)。当用户需要制作分享 / 演讲 / 发布会风格的网页 PPT,或提到"杂志风 PPT"、"瑞士风 PPT"、"Swiss Style"、"horizontal swipe deck"、"封面"、"cover"、"Facebook 封面"、"LINE 封面"、"Instagram 封面"时使用。

Install

skills CLI (Claude Code, Cursor, Codex and more)
npx skills add alingowangxr/guizang-ppt-skill --skill guizang-ppt-skill
Manual install
git clone --depth 1 https://github.com/alingowangxr/guizang-ppt-skill.git /tmp/guizang-ppt-skill
mkdir -p ~/.claude/skills
cp -r /tmp/guizang-ppt-skill/. ~/.claude/skills/guizang-ppt-skill

Personal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.

From the SKILL.md

# Magazine Web Ppt

## 这个 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 索引)、Lucide 图标、Motion One 入场动效(本地 + CDN 双保险)。

## 何时使用

**合适的场景**:
- 线下分享 / 行业内部讲话 / 私享会
- AI 新产品发布 / demo day
- 带有强烈个人风格的演讲
- 需要"一次做完,不用翻页工具"的网页版 slides

**不合适的场景**:
- 大段表格数据、图表叠加(用常规 PPT)
- 培训课件(信息密度不够)
- 需要多人协作编辑(这是静态 HTML)

## 工作流

### Step 1 · 需求澄清(**动手前必做**)

**如果用户已经给了完整的大纲 + 图片**,可以跳过直接进 Step 2。

**如果用户只给了主题或一个模糊想法**,用这 6 个问题逐个对齐后再动手。不要基于猜测就开始写 slide——一旦结构定错,后期翻修代价很高:

#### 运行环境适配

- **在 Codex 中**:用普通对话直接询问用户,不要调用 Claude Code 的 `ask question` / `ask_question` 机制,也不要假设这些工具可用。一次最多问 1-3 个最关键问题;如果信息缺口不影响开工,先做合理假设并在回复里说明。
- **在 Claude Code 中**:可以继续使用原有的 `ask question` 交互方式来逐项澄清。

#### 7 问澄清清单

| # | 问题 | 为什么要问 |
|---|------|-----------|
| 1 | **风格 A 还是 B?**(电子杂志风 / 瑞士国际主义风) | **必须先问**,决定用哪个 template + layouts + themes 文件 |
Read the full skill on GitHub

Details

Skill name
guizang-ppt-skill
License
MIT
Repo updated
13 May 2026

FAQ

What does the Guizang Ppt Skill skill do?

生成横向翻页网页 PPT(单 HTML 文件),含 WebGL 背景、章节幕封、数据大字报、图片网格等模板。提供两种风格:① "电子杂志 × 电子墨水"(衬线 + 流体背景 + 暖色) ② "瑞士国际主义"(无衬线 + 网格点阵 + IKB/柠檬黄/柠檬绿/安全橙高亮)。也支持生成多平台封面(公众号 21:9、Facebook 1.91:1、Instagram 1:1/9:16、LINE 16:9、YouTube 缩图、LinkedIn 横幅等)。当用户需要制作分享 / 演讲 / 发布会风格的网页 PPT,或提到"杂志风 PPT"、"瑞士风 PPT"、"Swiss Style"、"horizontal swipe deck"、"封面"、"cover"、"Facebook 封面"、"LINE 封面"、"Instagram 封面"时使用。

How do I install the Guizang Ppt Skill skill?

skills CLI (Claude Code, Cursor, Codex and more): npx skills add alingowangxr/guizang-ppt-skill --skill guizang-ppt-skill. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.

Is Guizang Ppt Skill popular?

It lives in alingowangxr/guizang-ppt-skill, which has 11 GitHub stars and 0 forks.

Related skills

Redbook Creator

11

BoomSky0416/redbook-creator

Use this skill when the user wants to create Xiaohongshu (小红书/RedBook) posts. Trigger phrases: 小红书创作, create redbook, 小红书, 红书, 笔记创作, 帖子创作. The user will provide images, videos, or text content. This skill analyzes the content, searches for trending Xiaohongshu posts as reference, generates post title and copy, auto-edits videos (merge, subtitles, BGM, narration), attempts auto-upload to Xiaohongshu creator platform, and generates a local preview HTML file.

Images, Video & Audio

Folio

11

Ramakm/folio-anatomy

Build a museum-style exhibition plate that explains a technical idea - an invented scientific instrument drawn as a live, engraved isometric figure in three views (SVG, WebGL light, and a 3D bench you can turn through 360 degrees) with internal parts that really rotate and interact, with numbered specimen pins, a catalogue key, a working model behind every number, and wall texts that walk through the formula term by term. Use for explanatory figures, interactive explainers, "how does X work" visuals, or technical illustrations for docs, courses, posts and landing pages, even when the request n

Images, Video & Audio

Screenstudio Export

8

vignesh-sabhahit/screenstudio-export

Export a .screenstudio (Screen Studio) project bundle to MP4 with ffmpeg only — no Screen Studio app, no paid export — reproducing the project's effects: cuts/trims, click-following zooms, animated cursor + click ripples, webcam bubble, rounded corners + shadow, background (user-supplied "frame" image, or the project's gradient/color). Use when the user wants to convert, export, render, or "get an mp4 out of" a .screenstudio bundle/package/project, or mentions rendering a Screen Studio recording without the app.

Images, Video & Audio

Youtube Advisor

10

AlexanderAbramovPav/youtube-advisor

Build or update a Claude Code advisor skill from any YouTube channel. Use when the user pastes a YouTube channel URL or handle, names a creator, or says "make an advisor on …", "build a skill from …", "обнови … advisor", "refresh that advisor". Triggers on bare URLs like https://youtube.com/@channel, @handles, or creator-name mentions.

Images, Video & Audio

Etsy Listing Helper

9

silennsong/etsy-listing-helper

Generate complete, copy-paste-ready Etsy listing content (title, tags, description, materials, category, attributes, alt text, variation ideas) from POD product spec text and/or white-background product photos. Use this skill whenever the user provides product information (Material Description, Product Size, Printing Technique, etc.) and/or e-commerce product images and wants Etsy listing info, listing copy, SEO tags, or anything related to publishing a product on Etsy — in any language. Also trigger when the user only sends product images in a session where product base info was given earlier

Images, Video & Audio

Talking Head Video

10

Vibetool/talking-head-video

Turn a raw 口播 / talking-head selfie video plus its script into a finished explainer, vertical 9:16 or landscape 横屏 16:9 — synced burned-in subtitles, animated knowledge graphics in three selectable styles (darkcard 深色科技卡 default, watercolor 纸上水彩, inkline 白纸简笔; both style and orientation are confirmed with the user first), and a circular picture-in-picture avatar that shrinks the speaker to the top-left while a graphic or B-roll fills the screen during explanations. THE pipeline whenever someone has a clip of a person talking to camera and wants it "剪成成片", subtitles auto-added from a 逐字稿/脚本, th

Images, Video & Audio

Browse the most popular Claude skills, all images, video & audio skills, or write your own with the skills generator.