從 PPT 到原型設計：歸藏 PPT Skill 與 Huashu Design 使用場景解析

Sat, 09 May 2026 08:34:23 +0800

最近兩個中文開發者做的設計類 Agent Skill 很值得放在一起看：一個是歸藏的 guizang-ppt-skill，另一個是花叔的 huashu-design。

它們都不是傳統意義上的「設計工具」，而是把一套設計流程、審美偏好、檢查清單和工程模板寫成 Agent 可以執行的 Skill。你不是打開一個 UI 慢慢拖元素，而是把需求交給 Claude Code、Codex、Cursor 這類 Agent，讓它按固定流程生成 HTML、PPT、動畫或原型。

這類專案的價值，不在於讓 AI 隨機發揮，而在於把「怎麼做才不難看」這件事流程化。

guizang-ppt-skill：專注雜誌風網頁 PPT

歸藏的 guizang-ppt-skill 定位很清楚：生成單檔 HTML 橫向翻頁 PPT，視覺基調是「電子雜誌 x 電子墨水」。它更像一套為演講準備的版式系統，而不是通用設計框架。

倉庫 README 裡列出的核心能力包括：

單檔 HTML 輸出，不需要建置和伺服器，瀏覽器直接打開。
橫向左右翻頁，支援鍵盤、滾輪、觸控滑動、底部圓點和 ESC 索引。
5 套主題色預設，包括墨水經典、靛藍瓷、森林墨、牛皮紙和沙丘。
10 種頁面版面，包括開場封面、章節幕封、資料大字報、左文右圖、圖片網格、Pipeline、懸念問題、大引用、Before/After 對比和圖文混排。
內建模板、元件說明、版面骨架、主題設定和品質檢查清單。

它適合做線下分享、產業內部講話、私享會、AI 產品發表、demo day，以及帶有強烈個人風格的演講稿。不太適合大段表格資料、培訓課件和多人協作編輯。

這個專案有一個很好的取捨：它沒有試圖覆蓋所有設計場景，而是把「雜誌風 PPT」這個場景做窄。主題色只能從預設裡選，版面也有明確骨架，這反而降低了 Agent 跑偏的機率。

如果你經常要把觀點、產業觀察、產品發表內容做成演講 deck，它的實用性會很高。

安裝命令也很直接：

`1`	`npx skills add https://github.com/op7418/guizang-ppt-skill --skill guizang-ppt-skill`

huashu-design：更完整的 HTML 原生設計工作流

花叔的 huashu-design 覆蓋面更大。它的目標不是只做 PPT，而是把 HTML 當成原生設計畫布，用 Agent 生成可交付的設計資產。

倉庫 README 裡列出的能力包括：

可點擊 App 或 Web 原型。
HTML 投影片，以及可編輯 PPTX 匯出。
產品發表動畫、MP4、GIF 和配樂版本。
多方向設計方案並排對比。
資訊圖、資料視覺化、PDF、PNG、SVG 匯出。
5 維專家評審，包括哲學一致性、視覺層級、執行工藝、功能性和創新性。

它的核心思路是：讓 Agent 先理解品牌和素材，再產出高保真設計。專案裡強調了 Core Asset Protocol，也就是遇到具體品牌時，要先確認 logo、產品圖、UI 截圖、配色、字體和品牌指南，而不是憑記憶猜。

這點很重要。很多 AI 生成設計看起來「像設計」，但不像某個真實產品或品牌。huashu-design 試圖把這個問題前置解決：先找真實資產，再做設計。

安裝命令是：

`1`	`npx skills add alchaincyf/huashu-design`

它更適合那些希望在終端裡完成較完整設計交付的人：產品原型、發表動畫、簡報、資訊圖、設計評審都可以放在一個 Agent 工作流裡處理。

兩者最大的區別

簡單說，guizang-ppt-skill 是一個更窄、更穩的演講 deck 生成器；huashu-design 是一個更寬、更完整的 HTML 原生設計系統。

如果只看 PPT：

guizang-ppt-skill 更強調雜誌感、節奏、版式和單檔瀏覽器演示。
huashu-design 更強調通用設計能力、可編輯 PPTX、品牌素材、匯出鏈路和評審流程。

如果看整體設計能力：

guizang-ppt-skill 的邊界更清晰，適合快速做一份有風格的橫向演講。
huashu-design 的能力更綜合，適合把一個產品或品牌設計任務拆成原型、動畫、投影片和資訊圖。

這兩個專案也代表了兩種不同的 Skill 寫法。前者像一套高度收斂的模板和審美約束，後者像一個小型設計團隊的工作流說明書。

為什麼這類 Skill 重要

Agent 的一個常見問題是「會做，但不穩定」。同樣一句需求，有時輸出很好，有時就會滑向紫色漸層、圓角卡片、假圖標和一堆看似高級的空話。

Skill 的意義就是把穩定性補上。它把下面這些東西固化下來：

可複用的模板。
可執行的檢查清單。
明確的審美偏好。
常見錯誤的規避規則。
輸出格式和驗證流程。
什麼時候該問問題，什麼時候該直接開始做。

這比單純寫一句「請做得高級一點」可靠得多。

尤其是設計任務，審美並不是一句 prompt 就能穩定復現的。真正有用的是流程：先確認素材，再定方向，再搭結構，再做視覺，再檢查輸出。把這個流程寫成 Skill，Agent 才更像一個可協作的執行者，而不是一次性圖片生成器。

使用建議

如果你只是想把一個主題做成線下演講或分享 deck，可以優先試 guizang-ppt-skill。它的輸出邊界窄，單檔 HTML 也方便分發和預覽。

如果你想讓 Agent 承擔更完整的設計任務，比如 App 原型、發表動畫、品牌化投影片、可匯出 PPTX 或資訊圖，可以優先看 huashu-design。它的鏈路更長，適合需要多輪迭代和交付物匯出的任務。

如果你已經在寫自己的 Codex 或 Claude Code Skill，這兩個專案也都值得參考：

想學「如何把一個窄場景做穩」，看 guizang-ppt-skill。
想學「如何把複雜工作流拆成可執行協議」，看 huashu-design。

總結

歸藏和花叔這兩個專案的共同點，是都把「設計能力」從一次 prompt 變成了可重複執行的流程。

guizang-ppt-skill 的重點是雜誌風 HTML PPT，適合高風格化演講；huashu-design 的重點是 HTML 原生設計系統，覆蓋原型、動畫、投影片、資訊圖和評審。它們解決的不是「AI 能不能生成設計」，而是「AI 能不能按一套穩定方法生成可交付的設計」。

這可能會成為 Agent 工具生態裡很重要的一類開源專案：不只是程式碼模板，而是把人的經驗、審美和工作方法打包成 Skill。

參考連結：