diagram-design：讓智慧體按品牌畫出 44 種編輯級圖表

當開發者讓智慧體“畫一張架構圖”時，常見的結果是一段 Mermaid 程式碼，渲染出來灰濛濛、帶陰影、字型隨機的方框。cathrynlavery/diagram-design 針對的正是這個小而真實的痛點。它是一個智慧體技能（Agent Skill），讓智慧體把圖畫成一個自包含的 HTML 加 SVG 檔案，雙擊即可開啟，並且遵循你自己的品牌。專案自稱提供 44 種圖表型別，口號很直接：沒有陰影，沒有 Mermaid 式的粗糙輸出。README 還掛著 Trendshift 榜單徽章，說明它正在被開發者圈子關注。

使用方式刻意做得很輕。使用者用自然語言提需求，例如“給我的應用畫一張架構圖：前端、後端、資料庫、Redis 快取”，或者“用象限圖展示第二季度專案的影響與投入”。智慧體自己挑選圖表型別，先說明計劃，再寫出一個 .html 檔案。安裝也只有一行命令 npx skills add cathrynlavery/diagram-design。它面向所有能讀取 Agent Skills 的宿主，README 列出 Cursor、Claude Code、Codex、GitHub Copilot、Gemini CLI、Cline、Windsurf 和 Amp。這種跨宿主的寫法，讓技能不再繫結某一家工具，是它值得關注的第一個原因。

第二個原因是品牌入駐。使用者可以對智慧體說“把 diagram-design 入駐到我的網站”，技能會拉取該網站的配色和字型，此後生成的每一張圖都與網站保持一致。這一步把“圖表風格”從每次對話裡的臨時提示詞，變成可複用的持久設定。對內容團隊和設計團隊而言，這比反覆在提示詞裡描述顏色可靠得多。README 還提供從 draw.io、Mermaid 和 Excalidraw 匯入的路徑，以及匯出 PNG 和 SVG 的路徑，所以舊資產不必丟棄，成品也能放進文件與幻燈片。 分發方式也值得細看。在 Claude Code 中，可以透過外掛市場安裝，獲得更新和斜槓命令，如 /export-diagram、/import-mermaid、/profile 和 /doctor。透過 skills CLI 的獨立安裝只裝 Agent Skill 本體，不含這些命令，更新需要手動執行 npx skills update diagram-design。當所選宿主目錄不止一個時，CLI 推薦符號連結：一份標準副本，連結到各個目錄，一次更新即可覆蓋全部；也可以用 --copy 為每個宿主單獨複製。在無法使用符號連結的環境，例如未開啟開發者模式的 Windows，CLI 會退回複製並報告結果。這些細節說明作者認真考慮過多宿主環境裡最常見的版本漂移問題。

信任與來源方面，README 說得剋制。官方版本只來自這個倉庫；釋出外掛目錄條目的是作者 Cathryn Lavery 的公司 LittleMight，其他名稱下的條目屬於非官方副本。PRIVACY.md 列出技能會透過網路傳送的內容。專案採用 MIT 許可證，並有持續整合徽章和版本徽章。對於一個會在你的程式碼庫裡被智慧體執行的技能，這種來源宣告和網路行為披露，是企業採用時必須先看的底線。 從行業角度看，這個專案反映了智慧體工具的一種新分工。一個常見現象是，編碼智慧體的競爭集中在誰寫程式碼更準，而交付物周邊的小環節，例如圖表、文件封面和演示稿，大多被留給預設模板。diagram-design 把其中一個環節單獨拎出來，用一份技能說明，加上參考資料、素材和指令碼，去約束智慧體的審美與輸出格式。技能目錄裡包含 references、assets 和 scripts，說明它不是一段冗長的提示詞，而是一個有結構的小型工程。這種做法的好處是可維護：風格規則寫在檔案裡，可以被評審、被回滾，也可以隨版本更新分發給所有宿主。

再看具體場景。技術寫作者需要給部落格配一張系統結構圖，產品經理需要一張影響對投入的象限圖，後端工程師需要一張帶令牌重新整理的呼叫時序圖，這些都出現在 README 的示例請求裡。它們的共同點是：內容簡單，但外觀要求高，而且要與站點風格保持一致。傳統做法是在白板工具裡手繪，再匯出圖片，之後很難修改。單檔案 HTML 加 SVG 的形式，讓修改回到文字層面：改一個標籤、換一種顏色，只需要讓智慧體重寫檔案，差異也能在版本庫裡逐行檢視。這正是文字化圖表相對於點陣圖的長期優勢，也是它適合進入團隊工程流程的根本原因。 與同類方案相比，還有一點值得注意。Mermaid、draw.io 和 Excalidraw 各自都有穩定的使用者群，diagram-design 並不要求使用者放棄它們，而是提供匯入路徑，把舊圖重新畫成統一的風格。這意味著它更像一層風格與流程的外殼，而不是替代品。對已經積累大量 Mermaid 文件的團隊，這是一種低風險的試點方式：先挑出最常被引用的一批圖，讓智慧體按品牌重畫，再比較可讀性與維護成本。如果結果令人滿意，再把技能納入團隊的標準配置，並透過外掛市場的自動更新保持版本一致。 我們的判斷是：diagram-design 的價值不在於又多了一個畫圖工具，而在於它把“設計約束”打包成智慧體可呼叫的技能。輸出是單檔案 HTML 加 SVG，可以納入版本管理，可以審查差異，也不依賴外部渲染服務。風險同樣清楚：44 種型別的實際質量需要使用者自行在畫廊裡評估；品牌入駐依賴目標網站的樣式是否規整；技能生態仍在快速變化，跨宿主行為未必完全一致。建議團隊先用它畫兩三類最常用的圖，例如架構圖和時序圖，與現有 Mermaid 流程對比後，再決定是否推廣。