自由分布
括號圖
在軟體開發領域，清晰地傳達架構設計至關重要。 C4 Model（Context、Containers、Components、and Code）正是為開發架構人員量身打造的系統架構圖解方法。它提供了一種簡單、清晰且易於理解的方式來表達系統的不同層次架構訊息，從而幫助開發人員、架構師和利害關係人更好地理解和交流架構決策。
C4 model由Simon Brown在其著作《Software Architecture for Developers》中首次提出，旨在透過一系列圖表來展示軟體系統的架構。這些圖表依照系統的不同層次進行劃分，包括系統上下文圖、容器圖、元件圖和程式碼圖。 C4模型沒有規定使用特定的圖形或建模語言，因此使用者可以非常靈活地產出架構圖。
系統環境圖位於C4模型的頂層，是軟體系統架構圖的起點。它展示了系統的全貌，包括系統邊界、系統相關的使用者、其他支撐系統以及與本系統的互動。這種圖非常適合非技術利益相關者，因為它簡單明了，不涉及技術細節。
主要元素：待描述的軟體系統、使用者、外部依賴系統等。
目標對象：軟體開發團隊內外的所有人，包括技術人員和非技術人員。
容器圖是系統情境圖的放大和補充，顯示了系統的物理結構。每個容器代表一個可單獨運作/可部署的單元，如Web伺服器、應用程式伺服器、資料庫伺服器等。容器圖也顯示了系統的主要技術選型以及容器間的通訊和互動。
主要元素：軟體系統範圍內的容器，如Spring Boot打包後的應用、MySQL資料庫、Redis等。
目標對象：軟體開發團隊內外的技術人員，包括軟體架構師、開發人員和營運/支援人員。
組件圖深入容器內部，展示了容器包含的組件以及組件之間的關係。元件通常代表系統的主要業務功能，如使用者介面、業務邏輯、資料處理等。這種圖對於開發人員和架構師來說非常重要，因為它提供了系統內部結構的詳細視圖。
主要元素：容器內的元件，如Dubbo介面、REST介面、Service等。
目標受眾：軟體架構師和開發人員。
程式碼圖展示了元件內部的類別和它們的交互，是最詳細的層次。這種圖通常用於展示單一元件的實作細節，包括類別、它們的屬性、方法和關係。然而，在註重敏捷開發的今天，一般不建議產出程式碼圖，除非是非常重要且尚未寫出程式碼的元件。
主要元素：元件內的程式碼元素，如類別、介面、物件、函數、資料庫表格等。
目標受眾：軟體架構師和開發人員。
此外，C4模型還包括系統景觀圖、動態圖和部署圖等擴展視圖，用於描述軟體系統在不同層次和場景下的組合和協作方式。
繪製C4圖表的工具很多，常見的工具有draw.io，Plantuml，ProcessOn等，使用者可以依照需求挑選適合的圖表工具。對於初學者，推薦使用ProcessOn ，這是一款專業的流程圖工具，支援線上繪製C4圖表，提供了豐富的蜘蛛圖模板。
1. 登入ProcessOn後，點選「新建檔案」按鈕。在彈出的選項中選擇“流程圖” 。
2. ProcessOn提供了多種模板，可以在新建檔案時選擇適合的C4圖表模板作為起點，這可以節省大量設定和佈局的時間。
如果選擇從空白開始，可以跳過此步驟。
3. 點擊左側圖形庫下方“更多圖形”，選擇要建立的C4圖表種類，點選“確定”。
4. 從左側圖形庫中選擇適當的元素拖放到畫布上，調整大小和位置，選擇圖形，點擊「+」可以建立連線連接到其他圖形。選取圖形或連線，頂部工具列可以設定圖形或連線的顏色、邊框、字體等屬性。
5. 可以使用ProcessOn提供的分享協作功能，將C4圖分享給團隊成員或利害關係人查看或編輯。也可以將C4圖匯出為圖片或PDF等格式，以便在其他場合使用。
以下是一個互聯網銀行系統的C4模型：
以下是一個某軟體系統資料生產發佈模組的C4模型：
以上模板皆來自ProcessOn模板社區，可以參考架構設計的想法或複製使用。
C4模型是一種強大的工具，可以幫助開發架構人員以一致和清晰的方式理解和交流軟體架構。透過在專案中使用C4圖，可以提高溝通效率，降低誤解的風險，並確保架構決策得到適當的記錄和理解。無論是資深架構師或新手開發人員，C4圖都是架構工具箱中不可或缺的一部分。
相關閱讀：
免費在線協作思維導圖和流程圖 
