guizang-ppt-skill 是 op7418(歸藏)開源的 Claude Code / Codex Skill，接收文章或大綱輸入，依七步流程與兩套完整設計系統，產出橫向翻頁、零依賴的單一 HTML 簡報檔。本手冊涵蓋安裝步驟、版式總覽、進階配置要點，以及從文章到簡報的完整流程示範。
guizang-ppt-skill 的設計前提是：移除母版選擇，以固定設計系統取代。多數 AI 簡報工具提供大量母版供填空，結果往往收斂為相似的 SaaS 落地頁風格。這個 Skill 限定兩套視覺系統，由 AI 照規格生成，而非讓使用者自由配置。技術上，它是一個放在 ~/.claude/skills/guizang-ppt-skill/ 的 Skill，由 Markdown 規格、HTML 模板、版式參考與校驗腳本組成，讓 Claude Code 或 Codex 依固定設計系統生成簡報。
它提供兩套不能混用的視覺系統。Style A 是「電子雜誌 × 電子墨水」：襯線大標、克制留白、Hero 頁才用 WebGL 流體背景，適合人文敘事、產業觀察、個人觀點表達。Style B 是 Swiss International Style：純無襯線、12 欄網格、單一高飽和錨點色、直角與髮絲線，22 個鎖定版式，適合技術產品、資料報告、工程與設計演講。兩者的 class 命名刻意不同，h-hero 在 A 是襯線、在 B 是無襯線，一份簡報只能選一套，選定後不可更換。
輸出永遠是單一 HTML 檔:橫向左右翻頁,鍵盤、滾輪、觸控、底部圓點都能導航,不需要 build、不需要伺服器,雙擊就能在瀏覽器全螢幕放映。內建 B 鍵靜態低耗模式,在效能差的會議室電腦上可以一鍵關掉 WebGL 與動效。設計哲學寫得很直接:克制大於炫技、結構大於裝飾、層級靠字體與尺寸而非顏色、圖片是一等公民。
建議使用 npx skills 安裝，一次將 SKILL.md、模板、版式參考與校驗腳本全部部署完畢。安裝後以自然語言對 Claude Code 下指令即可觸發，例如「幫我把這篇文章做成 Swiss 風 8 頁 PPT」。
不想透過 CLI,也可以把 repo 直接 clone 到 Claude Code 的 skills 目錄;Codex 環境則改放到對應的 skills 路徑即可。內容是純資料檔(Markdown + HTML + 一支 .mjs 校驗腳本),沒有編譯步驟。
guizang-ppt-skill 整合兩套視覺系統、三十多個現成版式區塊、預設主題、出圖規範、截圖外框、Swiss 校驗器，以及單檔放映執行環境。以下卡片列出各模組的具體職責。
data-layout="Sxx"。鎖定模式禁止自創未列版式,確保網格不破。B 關掉 WebGL 與 Motion 動效,簡報照常翻,不掉幀。
Skill 的需求釐清會先問你「講多久」,因為時長直接決定頁數密度;沒有現成大綱時,它會套一條固定的敘事弧:鉤子 → 背景 → 核心 → 轉折 → 收束。
| 演講時長 | 建議頁數 | 節奏重點 |
|---|---|---|
| 約 15 分鐘 | ≈ 10 頁 |
一個核心觀點,少分支,Hero/非 Hero 交錯防疲勞 |
| 約 30 分鐘 | ≈ 20 頁 |
核心展開 3–5 頁,加一頁明確轉折 |
| 約 45 分鐘 | ≈ 25–30 頁 |
多段核心,章節開場頁分隔,收束 1–2 頁 |
| 無大綱時的預設骨架 | 鉤子(1p) → 背景(1–2p) → 核心(3–5p) → 轉折(1p) → 收束(1–2p) |
|
guizang-ppt-skill 出自 op7418(歸藏)，在 Trendshift、SkillsLLM 等聚合站均有收錄。以下技巧全部來自 SKILL.md 與 references 目錄，依序執行可避免大多數常見的版面問題。
需求釐清的七個問題中，選 Style A 或 Style B 是強制第一題，因為它決定模板、版式檔、主題檔三者。此項目須在開始前確定，避免中途因 class 對不上而需要重做。
來源 · 官方 SKILL.md · Step 1Step 3.0 的飛行前檢查:你要用的每一個 class 都必須已存在於模板 <style> 裡。少一個 class = 版面直接破。別憑記憶寫 class 名。
Style A 的 10 個版式在 references/layouts.md,Style B 的 22 個在 references/layouts-swiss.md。直接抄整段 <section> 再換內容,比手寫快也不會破網格。
Style B 是鎖定模式:每個 slide 必須帶 data-layout="Sxx",正常段落不准自創 P23/P24 或未列版式。實驗版式只有在使用者明確要求時才開。
Style A 圖片網格固定 height:26vh,絕不用 aspect-ratio;且永遠不讓圖片貼齊頁面底部,用 align-items:start 的網格。這是最常見的破版來源。
image-prompts.md 的鐵律:先判斷圖片在頁面的落位與比例,再從紀實攝影、雜誌資訊圖、流程圖等七類挑一類。只用標準比例,禁卡通、3D、霓虹、SaaS 模板感。
Style B 完工前跑 node scripts/validate-swiss-deck.mjs,它會靜態抓出殘留襯線、多個強調色、漸層陰影圓角、缺 data-layout 等違規。比肉眼可靠。
repo 內附 64KB 的 assets/motion.min.js 作為 Motion One 離線 fallback,沒網路也能有進場動畫。會議室斷網時,簡報照樣完整放映。
以下以一篇「AI Agent 趨勢」文章為素材，示範 30 分鐘技術分享的完整生成流程：釐清需求、選定 Style B、複製 Swiss 模板、套用主題、依版式填入內容、以 Codex 生成三張插圖、跑校驗器，最後本地預覽。
這套流程的核心機制是：先以七個問題鎖定規格，再依固定版式系統生成。Style 選定後不可更換、每頁均帶 data-layout、完工前有校驗器靜態檢查，產出結果因此具備可重現的一致性。
模板 CSS 採參數化設計：九成的視覺調整只需修改 inline 的 font-size:Xvw、height:Yvh、gap:Zvh，在結構正確的基礎上微調，而非重寫版面。
h-hero 在 A 是襯線、在 B 是無襯線)。一份簡報只能選一套,中途想換就得整份重做。
data-layout="Sxx"。想要實驗版式,得明確跟它說「我要實驗版式」。
height:Nvh、不用 aspect-ratio,且永遠不能貼齊頁面底部。同組圖(如 S15/S16/S22)比例、高度、邊距必須一致。
nowrap,超過會折行破壞版面;標題用襯線、內文用無襯線、metadata 用等寬,不能混。
references/checklist.md 是五輪迭代踩出來的 P0–P3 品質閘。跳過它,前面所有版式紀律都會在最後一頁前功盡棄。
整個 Skill 是純資料檔，由 Markdown 規格、HTML 模板、版式參考與一支 .mjs 校驗腳本構成，無編譯步驟。所有檔案可直接閱讀與修改，可在團隊內標準化使用，無需撰寫應用程式碼。授權為 MIT，可自由 fork。
1. 在預設約束內微調主題。打開 references/themes.md 或 references/themes-swiss.md,在現有預設的 :root 變數框架內調整;保持「不自填任意 hex」的紀律,協調性才不會崩。
2. 用 S08 地圖元件。需要在 Swiss 簡報放地圖時，參閱 references/swiss-map-component.md。S08 版式內建 MapLibre 擴充，無需自行接入地圖庫。
3. 把截圖外框做成團隊資產。assets/screenshot-backgrounds/ 的 9 套 CleanShot 風格外框,可固定成你產品 demo 的標準呈現,跨簡報重用。
4. 把校驗器接進流程。把 node scripts/validate-swiss-deck.mjs 放進你的出稿檢查或 CI,讓 Swiss 規範自動把關,而不是靠人工肉眼複查。
5. 沉澱你自己的 checklist。repo 的 checklist.md 是作者五輪迭代的產物;把你團隊踩過的版面坑追加進去,它會越用越貼合你的場景。
① SKILL.md：七步流程、雙視覺系統、設計原則的完整規格。
② references/checklist.md：P0–P3 品質閘，五輪迭代累積的版面問題清單。
③ references/layouts-swiss.md：Style B 的 22 個註冊版式與實驗版式說明。