前言¶

流程圖畫到一半，發現工具要麼太重（要裝 BPMN 建模器），要麼太隨意（手畫框圖，改一次連線全亂）。更常見的是：需求評審會上要一張審批流，代碼評審時要一張系統交互圖，文檔裏要一張泳道圖，三張圖風格還不統一。

下面介紹的是一個 Agent Skill，用來把這類流程可視化需求收斂成一份可復現的代碼產物：你描述流程，它產出 Mermaid flowchart 或 PlantUML 源碼。

這是什麼¶

「流程圖繪製嚮導」（座標 @user_af163eaa/z-diagram-flow）是一個社區來源的 Agent Skill，版本 1.0.1，發佈者 user_af163eaa，在 SkillHub 上的分類爲 dev-programming。

它的定位是一份流程可視化指南：輸入業務流程描述，輸出 Mermaid flowchart 或 PlantUML 代碼。它不替代 BPMN 引擎，也不做流程仿真或表單設計。

需要說明的是，官方頁面未標註 API Key 要求（標籤爲 requires_api_key=false）。

核心功能¶

根據官方簡介，該 Skill 的能力範圍如下：

1. 繪製業務流程圖與泳道圖。
2. 輸出 Mermaid flowchart 代碼，也輸出 PlantUML 代碼，兩種語法可按需選擇。
3. 覆蓋三類常見流程：審批流、業務流程、系統交互。

它不做的事同樣明確：不做 BPMN 級別的過程引擎能力（如流程狀態管理、任務指派、超時重試），這些應由專門的 BPMN 引擎承擔。

獲取與啓用¶

官方地址：https://api.skillhub.cn/user_af163eaa/z-diagram-flow

SkillHub 頁面：https://www.skillhub.cn/skills/user_af163eaa/z-diagram-flow

已抓取資料中未提供 npx skills add 之類的安裝命令，也沒有給出目錄路徑或配置文件字段。該 Skill 基於通用 SKILL.md 格式，具體啓用方式以 SkillHub 頁面說明爲準，本文不臆造安裝步驟。

典型用法¶

官方資料未附可復現的示例輸入輸出。下面這個最小示例用於說明該 Skill 的輸出形態（Mermaid flowchart），不是官方文檔示例：

flowchart TD
    A[提交申請] --> B{金額 ≤ 10000}
    B -- 是 --> C[主管審批]
    B -- 否 --> D[部門經理審批]
    C --> E[歸檔]
    D --> E

使用方式是把流程描述交給 Agent，並指明要用 Mermaid 還是 PlantUML，再把產出代碼貼到支持對應語法的渲染環境裏查看。

適用場景與注意¶

適合的場景：文檔中的審批流說明、需求評審用的業務流程圖、多個角色或系統之間的交互圖。這類圖的價值在於把邏輯講清楚，而不在於長期維護狀態。

需要注意的限制：

1. 它產出的是源代碼，不是圖形編輯器。連線調整、樣式美化需要在渲染環境或代碼裏改。
2. 不替代 BPMN 引擎。如果流程要真正驅動任務流轉、狀態持久化、人工待辦，應使用 BPMN 引擎。
3. 泳道圖的表達能力取決於所使用的 Mermaid 或 PlantUML 語法版本，請在目標渲染環境先驗證。
4. 官方頁面沒有提供示例和詳細文檔，上手前建議先用一個小流程驗證輸出是否符合預期。

結尾¶

這個 Skill 的價值在於把「畫流程圖」這件事從打開建模工具、手動拖框，變成直接產出可版本化、可評審的 Mermaid 或 PlantUML 源碼，覆蓋審批流、業務流程和系統交互三類場景。

官方地址：https://api.skillhub.cn/user_af163eaa/z-diagram-flow