技能概述
HTML-PPT 係 Open Design 最核心嘅簡報技能，可以生成專業級嘅靜態 HTML 簡報文件。一個主題文件 = 一個視覺風格，一個佈局文件 = 一種頁面類型，所有頁面共享統一嘅設計系統。
支援 36 套主題、15 套全 Deck 模板、31 種佈局、27 種 CSS 動畫 + 20 種 Canvas FX 動畫，仲有鍵盤導航、演講者模式（彈出式 4 卡片視窗：CURRENT / NEXT / SCRIPT / TIMER）同 PNG 導出功能。
觸發關鍵字
- ppt、deck、slides、presentation、keynote、reveal、slideshow
- 幻灯片、演讲稿、分享稿、小红书图文
- pitch deck、tech sharing、technical presentation
什麼時候用
- 做簡報 / PPT / Slides / Keynote
- 做小紅書圖文（3:4 豎版 810×1080）
- 做技術分享簡報
- 做團隊週報簡報
- 做產品發布簡報
- 需要逐字稿 / 演講者模式嘅分享
- 需要做線上課程 / 工作坊材料
使用方法
自然語言觸發
幫我整一份 seed round 嘅 pitch deck
做一個技術分享簡報，用 tokyo-night 風格
做一份小紅書圖文
做一份團隊週報
我要去做技術分享，要一份帶逐字稿嘅 PPT
指定技能
用 html-ppt 技能做簡報
標準工作流程
- 確認三件事：內容 / 頁數 / 受眾是誰？
- 揀主題：從 36 套主題揀 2-3 個候選
- 商務 / 融資 →
pitch-deck-vc、corporate-clean、swiss-grid - 技術分享 →
tokyo-night、dracula、catppuccin-mocha - 小紅書 →
xiaohongshu-white、soft-pastel - 學術 / 報告 →
academic-paper、editorial-serif - 賽博 / 前衛 →
cyberpunk-neon、vaporwave、neo-brutalism
- 商務 / 融資 →
- 揀起點：用全 Deck 模板定 scratch？
輸出格式
多文件 HTML 簡報（index.html + CSS/JS 資源文件），支援：
- 鍵盤導航（← → F S O T A）
- 演講者模式（S 鍵彈出 4 卡片視窗）
- 主題循環切換（T 鍵）
- PNG 導出（render.sh）
- 深度鏈接（#/N）
設計風格
36 套內置主題：
| 類別 | 主題 |
|---|---|
| 商務 | pitch-deck-vc, corporate-clean, swiss-grid, blueprint |
| 開發者 | tokyo-night, dracula, catppuccin-mocha, terminal-green |
| 柔和 | soft-pastel, minimal-white, editorial-serif, rose-pine |
| 前衛 | neo-brutalism, cyberpunk-neon, vaporwave, y2k-chrome |
| 復古 | retro-tv, midcentury, japanese-minimal |
| 小紅書 | xiaohongshu-white, rainbow-gradient |
| 其他 | aurora, bauhaus, glassmorphism, memphis-pop 等 |
實際例子
例子 1：融資路演
用戶：「帮我做一份 Seed Round 嘅 pitch deck，我間公司叫 AIFlow，做 AI 自動化工作流。」
Agent 確認三件事後，生成 10 頁簡報：
- 封面 → 問題 → 解決方案 → 市場機會 → 產品 → Traction → 商業模式 → 團隊 → Ask → Thank you
- 用
pitch-deck-vc模板打底 - 白色背景 + 藍紫漸變 hero 頁 + traction bar chart
例子 2：技術分享 + 逐字稿
用戶：「我要去給團隊做一個關於微服務遷移嘅技術分享，20 分鐘，要逐字稿。」
Agent 用 presenter-mode-reveal 模板：
- 每頁
<aside class="notes">寫 150-300 字逐字稿 - 演講者模式 S 鍵彈出 4 卡片（CURRENT / NEXT / SCRIPT / TIMER）
tokyo-night主題 + JetBrains Mono 代碼塊