連設計圖都不會畫，你還想做「系統架構師」？

關鍵時刻，第一時間送達！

作者簡介：互扯程序，某互聯網公司 P8 級專家攻城獅，曾參與過央視全台網的研發工作。目前正在做車聯網項目的雲平台的架構設計與研發工作。平時喜歡打球游泳，偶爾發表一些技術文章，有個公眾號叫「互扯程序」，本文為作者投稿。

什麼是系統架構師？

系統架構師是一個既需要掌控整體又需要洞悉局部瓶頸並依據具體的業務場景給出解決方案的團隊領導型人物。一個架構師得需要足夠的想像力,能把各種目標需求進行不同維度的擴展，為目標客戶提供更為全面的需求清單。

架構師在軟體開發的整個過程中起著很重要的作用。

如何才能成為系統架構師？

首先必須具有豐富的軟體設計與開發經驗，這有助於理解並解釋所進行的設計是如何映射到實現中去。

其次要具有領導能力與團隊協作技能，軟體架構師必須是一個得到承認的技術領導，能在關鍵時候對技術的選擇作出及時、有效的決定。

第三是具有很強的溝通能力，其實這一點好像什麼角色都最好具備，軟體架構師需要與各路人馬經常打交道，客戶、市場人員、開發人員、測試人員、項目經理、網路管理員、資料庫工程師等等，而且在很多角色之間還要起溝通者的作用。

而設計圖，它不是簡單的供你欣賞，他其實是架構師，產品經理，開發工程師，測試工程師等各種角色之間進行溝通的語言，溝通的一個橋樑，讓整個團隊更能有效的協調工作。

設計圖不單單是架構師要掌握的，在一個產品的開發過程中，任何一個環節，任何一個角色都可以通過掌握不同的設計圖來完成溝通的。

流程圖

流程是一系列的邏輯關係（包含因果關係、時間先後、必要條件、輸入輸出）產品經理做需求前一定要先把這些邏輯關係理清楚，如果非要用一句話概括的話「流程就是在特定的情境下滿足用戶特定需要的總結」。

圖就是將你頭腦中的邏輯關係以圖形化的形式呈現出來，具有圖形化、可視化的特點，因為是圖，你可以像你的版本迭代一樣，當你的邏輯需要修改的時候拿出來迭代一下，同時因為有圖，你還可以更好的給項目成員進行宣講。

產品中設計的流程圖主要有三種，業務流程圖、任務流程圖、頁面流程圖，下面我們來一一介紹。

業務流程圖

業務流程圖又稱為泳道圖，就是描述那些個體在什麼條件下做了什麼事情，他們之間有何關聯。主要分三個方面：

涉及到哪些主體？

每個主體都有哪些任務？

各個主體之間怎麼聯繫的？一般涉及到多個主體，每個主體之間有聯繫。

任務流程圖

泳道圖一般是從戰略上分析整個業務流程，讓你對公司所做的業務有個大概的了解，而任務流程圖就是在你的產品操作上，用戶通過什麼樣的操作來完成它的目標，比如你去銀行ATM機器上取錢，你是如何一步步操作把錢取出來的。

頁面流程圖

如果說業務流程圖幫助你梳理戰略，任務流程圖幫助你梳理用戶操作行為（主要給程序員看）、頁面跳轉流程在幫助你梳理各個頁面之間的跳轉關係（主要給UI和前端程序員看）這是一個逐步從整體到局部，從後端到前端的過程。

所有的產品都是由頁面組成的，不論是APP、PC、H5都是由一個個頁面組成的，頁面流程圖描述完成一個任務需要經過哪些步驟，你在畫圖的時候只需要清晰的表現出用戶點擊頁面的什麼地方，然後跳轉到那個頁面。主要由頁面、行動點、連接線組成。

UI設計圖標註

對於APP的頁面，UI設計師會給出UI設計標註圖，這樣APP客戶端開發人員，直接按照標註圖進行頁面的開發了。

產品設計完成後，架構師需要對產品進行軟體的架構設計。包括技術的選型，模塊的劃分，開發人員的任務分配，工作量的評估等等.....

系統架構設計圖

構架將在一次又一次迭代中不斷演化、改進、精鍊。

序列圖

架構師一般在做詳細設計的時候，會把程序模塊之間的每一步調用過程很詳細的畫出來，這樣開發人員拿到設計文檔，就能直接開發。

類圖

設計圖有很多種，還包括用例圖，狀態圖，活動圖...... 不再一一介紹。畫什麼樣的設計圖，不是絕對的，不同公司，不同項目，需要畫的設計圖也是不同的，有些項目需要畫原型圖，有些項目只是對外提供服務，沒有頁面也就不需要畫原型圖。另外還要根據項目的工期，預算等等因素考慮。如果一個項目的工期也就一個月甚至更短，那基本上就是怎麼簡單怎麼快就怎麼做。

畫圖工具

「工欲善其事，必先利其器」，下面就為大家介紹幾款常用設計圖繪製工具。

Visio

是微軟推出的一款流程圖繪製工具，它有很多組件庫，可以方便快捷的完成流程圖、泳道圖、結構圖的繪製，但是不支持mac電腦。

OmniGraffle

Mac下沒有Visio很多人就用這個，這個一般流程圖都能繪製，但是效率感覺沒有Visio高，優點就是畫出來的圖形比較美，同時支持外部插件，缺點就是沒有比較好的泳道流程圖插件，畫起泳道圖來不是太方便，但也可以畫，可以自己組裝泳道。

另外一個缺點是收費的，只能免費試用15天，不過我已經為大家準備好了一個最新的破解版本。

ProcessOn

是一款網頁版的在線作圖工具，優點是無需下載安裝、破解這些破事，同時支持在線協作，可以多人同時對一個文件協作編輯，而且上手比較容易，它提供很多流程圖模版，可以方便的畫出流程圖、思維導圖、原型圖、UML圖，缺點就是在繪製泳道圖需要增加泳道的時候，只能在最後一列加入，不能在中間加入這一點有點麻煩，還有要吐槽的就是由於是在線的，有時候導出圖片，導出來的並不太好，流程圖畫的大的時候也無法截圖。

在線地址：https://www.processon.com

Axure RP

這是一款產品經理經常用來畫原型的工具，它可以在頁面里定義各種按鈕點擊事件，進行頁面的跳轉，模擬提交的過程，所以非常方便使用。畫人物流程圖的時候也可以用，但是要畫泳道圖、UML圖的時候，沒有對應的模版，需要自己畫，效率不高，如果你覺得畫原型，製作文檔都在Axure里，不想來回切換軟體的畫，可以在裡面自己製作一個組件，下次直接調用。

Axure RP是可以畫出這樣效果的原型圖

PxCook

一款還不錯的標註工具.

優點：

成熟：跨平台——支持Windows和Mac

成熟2：支持PS和Sketch。

交互特別智能，也方便，一拖一放就標註完了。

相當需要說的一點：對於PSD文件或者Sketch進行了修改之後，PxCook里的標註會自動進行更新，免除了手動操作的過程。這是後面很多軟體沒有的。

支持移動設備的多單位切換。

缺點：

不能支持多個文件同時進行標註。

對於圖層樣式等信息，不能進行詳細查看。

iThoughtsX

優秀的思維導圖工具

OmniPlan

最NB的項目管理流程軟體，OmniPlan旨在幫助您可視化，維護和簡化您的項目。分解任務，優化所需的資源，控制成本，並監控您的整個計劃，都一目了然。協作與您的同事和分享每一個細節，更新日曆與你的天關，或混搭。接受和拒絕一次過改變一個接一個或所有。

OmniPlan提供了像甘特圖，時間表，摘要，里程碑和關鍵路徑的功能突出顯示，讓您管理您的所有活動。從自定義的視圖來快速輸入數據， OmniPlan幫助您管理，因為你需要他們，簡單或複雜的項目是 - 不需要複雜。

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！