前言¶
技術分享、路演和內部彙報往往離不開幻燈片。傳統做法是先在 PowerPoint 裏排版，再導出 PDF 或現場投屏；若希望演示稿能在瀏覽器裏打開、帶過渡動畫、便於嵌入現有前端工程，又要自己寫 HTML/CSS，對非設計背景的同學成本偏高。下面介紹 SkillHub 上的社區 Skill「創作HTML格式的PPT」（座標 @user_be38de3d/gbot-frontend-slides），讓 Agent 按統一流程協助生成或轉換 HTML 演示稿。
這是什麼¶
「創作HTML格式的PPT」是 SkillHub 分類 office-efficiency 下的社區 Skill，當前版本 1.0.0，發佈者爲 user_be38de3d，來源標註爲 community。官方簡介說明：可從零創建帶動畫效果的 HTML 演示稿，也可將 PowerPoint（PPT/PPTX）轉爲網頁；適合用戶要做演講稿、路演頁，或把現有幻燈片搬到 Web 的場景。標籤 requires_api_key=false，表示按 SkillHub 頁面說明，安裝使用不依賴額外 API Key。
Skill 詳情頁：https://www.skillhub.cn/skills/user_be38de3d/gbot-frontend-slides
API 條目：https://api.skillhub.cn/user_be38de3d/gbot-frontend-slides
核心功能¶
依據 SkillHub 頁面與已抓取元數據，可覈實的能力包括：
- 從零生成 HTML 演示稿：輸出爲可在瀏覽器中展示的 HTML 幻燈片，強調動畫與視覺表現。
- PPT/PPTX 轉 Web：將已有 PowerPoint 文件轉換爲網頁演示格式。
- 觸發場景由 Skill 自述：當用戶要「做一份演示」「把 PPT/PPTX 轉成網頁」「爲演講或 pitch 做 slides」時，Agent 應啓用該 Skill。
- 面向非設計者的探索方式：簡介提到通過視覺探索幫助確定審美方向，而不是先抽象地選定一套設計風格（具體實現細節以安裝後的
SKILL.md爲準）。
SkillHub 統計（抓取時）：評分 100000，下載 997，安裝 15。
安裝與啓用¶
安裝前需本機有 SkillHub CLI；完整步驟以官方文檔爲準。
1. 檢查或安裝 SkillHub CLI¶
先確認是否已安裝 CLI：
command -v skillhub && skillhub --version
若未安裝，可按 SkillHub 安裝文檔執行完整安裝（CLI + 默認 Skill）：
curl -fsSL https://skillhub-1388575217.cos.ap-guangzhou.myqcloud.com/install/install.sh | bash
僅需 CLI 時：
curl -fsSL https://skillhub-1388575217.cos.ap-guangzhou.myqcloud.com/install/install.sh | bash -s -- --cli-only
2. 安裝本 Skill¶
SkillHub 頁面給出的方式是：讓 AI 根據 https://skillhub.cn/install/skillhub.md 安裝 @user_be38de3d/gbot-frontend-slides。命令行安裝時，必須用 --dir 指向當前 Agent 的 skills 目錄，否則默認裝到 ./skills/ 可能不會被識別。
在 Cursor 中，skills 目錄一般爲：
~/.cursor/skills/
示例安裝命令（將 <skills 目錄> 換成你當前環境的路徑）：
skillhub install @user_be38de3d/gbot-frontend-slides --dir ~/.cursor/skills/
其他常見客戶端路徑（摘自 SkillHub 安裝文檔，按實際客戶端選用）：
- Claude Code：
~/.claude/skills/ - Codex：
~/.codex/skills/或項目下的.agents/skills/ - Windsurf：
~/.codeium/windsurf/skills/或項目下的.windsurf/skills/
安裝後若 Agent 未立即識別新 Skill，按所用客戶端說明重啓或刷新 skills 目錄。Cursor、Codex CLI、Claude Code 的差異主要體現在 skills 目錄路徑 上，安裝命令形式相同。
典型用法¶
官方未在頁面列出固定 CLI 子命令；用法是通過自然語言驅動 Agent，並在對話中引用已安裝的 Skill。下列表述與 Skill 英文簡介中的「Use when」一致，可作爲可復現的起點。
從零做網頁演示稿：
請用「創作HTML格式的PPT」Skill，幫我做一份約 10 頁的技術分享 HTML 幻燈片，主題是 XXX，需要章節過渡動畫，輸出單個可雙擊打開的 HTML 文件。
轉換現有 PowerPoint：
請根據 https://skillhub.cn/install/skillhub.md 已安裝的 gbot-frontend-slides，把當前目錄下的 deck.pptx 轉成 HTML 演示稿，保留主要版式，並說明如何在瀏覽器裏全屏播放。
路演 / pitch：
我要做 5 分鐘產品 pitch，用 HTML slides。先給我 2～3 種視覺風格各一頁樣張，我選定後再展開全文。
經過上面的步驟，Agent 會按 Skill 內 SKILL.md 的工作流生成或轉換文件；具體文件名、目錄結構以 Skill 包內說明爲準。
適用場景與注意¶
適合誰
- 需要快速產出可分享、可託管的 HTML 演示稿，又不想從零手寫 slide 框架的開發者或產品同學。
- 已有 PPTX，希望遷移到瀏覽器演示或內網靜態頁的場景。
- 對視覺風格不確定，希望通過樣張對比再定稿的非設計背景使用者（與 Skill 自述一致）。
限制與注意
- 社區 Skill，質量與更新節奏依賴發佈者
user_be38de3d，使用前可在 SkillHub 頁查看版本與下載量。 - 轉換 PPTX 時，複雜母版、嵌入字體或專有動畫未必能一比一還原，需在瀏覽器中自行驗收。
- 生成內容爲 HTML/前端資源，部署與合規（內網、CDN、依賴腳本）需自行把控。
- 勿將 SkillHub 頁面統計與用戶線索中的舊數據混用；本文采用抓取元數據中的版本 1.0.0 與下載 997 等字段。
結尾¶
「創作HTML格式的PPT」把「寫 HTML 幻燈片」和「PPT 轉 Web」收斂到同一套 Agent Skill 流程裏，適合 office-efficiency 類辦公場景，且無需 API Key。若要安裝或查看詳情，請訪問 SkillHub：https://www.skillhub.cn/skills/user_be38de3d/gbot-frontend-slides ，API 條目：https://api.skillhub.cn/user_be38de3d/gbot-frontend-slides 。
