
「UML 是瀑布式的東西,敏捷不需要」「畫圖浪費時間不如直接寫 code」——這些都是誤解。
先講結論
UML 的價值不是圖本身,是畫圖時逼你想清楚的那些問題。你不需要畫完美符合規範的圖,但你需要知道什麼問題用什麼圖最容易想通。14 種 UML 圖裡,你真正常用的只有 5 種。
結構圖 vs 行為圖
結構圖(靜態):東西長什麼樣、零件之間什麼關係。
行為圖(動態):這些零件怎麼互動、什麼條件下做什麼事。
搞清楚你要回答哪種問題,就知道該畫哪種圖。
最實用的 5 種圖
1. Sequence Diagram(最常用)
回答:一個操作從頭到尾,各元件怎麼互動?
什麼時候畫:跨多個服務的操作、debug 時追蹤 request 路徑、code review 解釋複雜呼叫鏈。
思維價值:逼你想每一步的 request/response 是什麼、哪裡可能 timeout、哪裡需要錯誤處理。
2. Class Diagram(最基本)
回答:程式碼結構是什麼?物件間什麼關係?
┌──────────────┐ ┌──────────────┐
│ User │ │ Order │
├──────────────┤ ├──────────────┤
│ - id: number │ 1──N│ - status: enum│
│ - email │ │ - total │
│ + login() │ │ + submit() │
└──────────────┘ └──────────────┘
什麼時候畫:設計 domain model、理解新 codebase 的核心物件、重構前看清現有結構。
思維價值:是「擁有」(has-a)、「是一種」(is-a)、還是「使用」(uses)?畫出來你會發現很多模糊的設計決策。
3. State Diagram(最容易忽略但最有用)
回答:一個物件有哪些狀態?怎麼轉換?
stateDiagram-v2 [*] --> Draft Draft --> Submitted : 使用者提交 Submitted --> Approved : 主管核准 Submitted --> Rejected : 主管退回 Rejected --> Draft : 使用者修改 Approved --> InProgress : 開始執行 InProgress --> Completed : 完成 InProgress --> Cancelled : 取消
什麼時候畫:任何有「狀態」的核心物件(訂單、工單、申請表)、code 裡出現大量 if (status === 'xxx') 的時候。
思維價值:每個狀態可以往哪走?不可以往哪走?什麼條件觸發轉換?——這正是最常出 bug 的地方。
4. Use Case Diagram(最適合溝通)
回答:系統有哪些使用者角色?每個角色能做什麼?
什麼時候畫:專案初期定義範圍、權限設計(RBAC)、跟非技術人員溝通。
5. Activity Diagram(流程圖進化版)
回答:業務流程的步驟、分支和並行。
什麼時候畫:複雜業務流程(審批、結帳、退貨)、有並行操作的場景、文字說不清的流程。
你不需要畫的圖
UML 有 14 種圖,但以下你幾乎不會用到:Object Diagram(debug 用 console.log 更直接)、Package Diagram(看資料夾結構就好)、Communication Diagram(Sequence Diagram 能表達同樣的事)、Timing Diagram(除非你做嵌入式)。
原則:只在文字或 code 說不清楚的時候才畫圖。
工具推薦
- Mermaid:文字語法生成圖、嵌入 Markdown,日常用這個就夠了
- draw.io:拖拉式、免費,需要美觀正式文件時用
- Excalidraw:手繪風格、即時協作,白板討論用
延伸閱讀
你上次畫圖是什麼時候?如果想不起來,你可能一直在用「寫 code 來思考」——簡單問題沒差,複雜問題需要先視覺化。不然等你寫完發現架構不對,改的成本可比畫圖貴多了。