iT邦幫忙

2026 iThome 鐵人賽

DAY 16
0
自我挑戰組

用 AI + draw.io MCP 建立可重複使用的流程圖工作流系列 第 16

# Day 16|四種整合方式總結:實測後的比較與我的最終選擇

  • 分享至 

  • xImage
  •  

從 Day 8 到昨天,我用同一段登入流程與同一組檢查點,把四種整合方式各測了兩篇。今天將它們攤開來對照,查看設定、呈現與產出物的差異,以及最後選了哪個方案。

先回到 Day 7 的那張表

Day 7 曾整理過一張官方對照表,記錄了各自的設定方式、產圖位置以及後續編輯管道。

實測後的完整對照

App Server Tool Server Assistant Plugins Project Instructions
設定方式 加入遠端位址 npm 安裝+設定檔 指令安裝外掛 貼 Prompt 到 Project
測試環境 Claude.ai Claude Code Claude Code Claude.ai Projects
圖表呈現 對話內嵌預覽 自動開啟瀏覽器 本機 .drawio 點按鈕後開瀏覽器
產出物 對話紀錄 一組網址 一個實體檔案 一組網址
指定格式 同一工具,切換參數 呼叫對應工具 在 Prompt 內說明 在 Prompt 內說明
支援格式 XML、Mermaid XML、Mermaid、CSV Mermaid、XML Mermaid、CSV、XML

為什麼我最後選 MCP Tool Server?

如果習慣直接在 Claude.ai 網頁端作業、重視快速預覽,App Server 確實最直覺;但我平常主要待在 IDE,所以焦點集中在 Assistant PluginsMCP Tool Server

這兩者都能在 Claude Code 內完成、免切換視窗,產出的圖也能直接檢視(外掛輸出 draw.io 網址時用的壓縮函式庫雖與 Tool Server 不同,但編碼相容,網址甚至可互換)。如果目標只是「單純產出一張圖」,兩者體驗幾乎沒差。

但我的目標是建立可重複運行的工作流——改了流程文件就能一鍵重產,且只改動特定節點時其他部分不會跑版。

在這個前提下,我有兩個考量:

  1. 行為具備確定性:Tool Server 將輸入格式拆成獨立工具(XML 就調 XML、Mermaid 就調 Mermaid)。當後續要把繪圖規格封裝成 Prompt 或 Skill 時,明確的工具調用能確保行為穩定,不會這次吐 XML、下次突然切成 Mermaid。
  2. 開發時序的巧合:我著手建構這套流程時,官方市集還沒推出 Assistant Plugins。當外掛上線時,我的工作流早已圍繞 Tool Server 打造完畢。如果你現在才要從零開始,兩者都值得考慮。

我的重產策略不是讓 AI 直接修改舊圖檔,而是將「流程規格」與「繪圖規則」文件化,每次都讓 AI 依據最新文件重產——讓產圖的依據留在文件裡,而不是留在圖檔的 XML 雜訊中。

這個選擇的代價:排版能力

Tool Server 並非毫無缺點。在官方的排版功能對照中,能自動將節點排整齊的 ELK 自動排版,只有 App Server 和 Assistant Plugins(需搭配本機 draw.io Desktop)支援;Tool Server 只具備連線自動繞開形狀的能力(libavoid),不會重排節點。

這意味著畫面要好看,要麼自己在編輯器微調,要麼得把座標與版面規則寫得夠精準讓 AI 一次到位。如果你追求的是「丟一段字就自動排出漂亮圖表」,App Server 或 Assistant Plugins 會比較適合。

工具只是起點,真正的挑戰是圖畫得對不對

這四種方式都只負責「把圖畫出來」,至於畫得合不合理——AI 有沒有理解商業流程、節點有沒有遵守規格、下次重產會不會跑出奇怪的結構,需要再依靠工作流來加強規範。

明天會來討論當流程本身變得複雜,或是要在原有流程上新增節點時,版面就有機率跑掉。這也是交給 AI 畫圖最常碰到的問題,也是後面我會想要建立規格文件的原因。


上一篇
# Day 15|Project Instructions(下):網址呈現與優缺點
下一篇
# Day 17|換一段複雜的流程來畫:AI 產圖的不穩定從哪裡來
系列文
用 AI + draw.io MCP 建立可重複使用的流程圖工作流17
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言