分享程序員常用的畫圖軟件和小技巧

大家好，我是魚皮。

說實話，我覺得做個程序員挺好的。日常工作有很多，寫代碼、對需求、寫方案等等，但我最愛畫圖：流程圖、架構(gòu)圖、交互圖、功能模塊圖、UML 類圖、部署圖、各種可視化圖表等等五花八門。

通過圖的形式，可以更好地展示系統(tǒng)、更清晰地表達自己的思路，便于理解；還能鍛煉自己的畫功，真是一舉多得的事。

今天就分享下我常用的畫圖軟件和一點小技巧。

常用圖

我平時畫的比較多的是流程圖、交互圖和架構(gòu)圖，一般使用 Draw.io 這款免費的在線網(wǎng)頁繪圖工具就可以搞定了。

之所以選擇這款繪圖工具，主要是以下幾個原因：

1. 使用方便

無需登錄，直接進入網(wǎng)頁，可以直接使用海量模板新建項目：

然后進入編輯頁面，在左側(cè)選擇需要的圖形，拖到繪圖區(qū)進行編輯，然后在右側(cè)修改樣式就好了：

可以直接搜索需要的圖形，比如服務(wù)器，當然也可以直接粘貼本地或網(wǎng)絡(luò)圖片：

2. 樣式美觀

Draw.io 提供了幾種默認主題和預(yù)設(shè)圖形風格，比如我最喜歡的手繪風格：

當然也可以對圖形進行高度靈活的定制，如果對界面開發(fā)比較熟悉的話，甚至可以直接編輯圖形的屬性值：

3. 豐富導(dǎo)出

可以將繪制好的圖形一鍵導(dǎo)出為圖片、矢量圖、PDF、HTML 文檔等：

其實這些都沒什么，我最喜歡的一點是，它可以直接生成在線網(wǎng)頁，分享給別人就能快速瀏覽了，還提供了小工具欄，可以縮放、截圖、打印和快速編輯：

此外，還可以導(dǎo)出繪圖為嵌入式網(wǎng)頁！這樣就能把各種作圖直接無縫集成我們自己開發(fā)的網(wǎng)頁中了：

4. 便于存儲和導(dǎo)入

可以隨時保存繪圖為本地文件，或存儲到 GitHub 等在線空間中；當需要再次編輯時，從同樣的地方導(dǎo)入即可。

對于習(xí)慣用 GitHub 來存放和分享代碼的同學(xué)來說，這點太實用了，意味著你可以和其他同學(xué)協(xié)作繪圖。

除了 Draw.io 外，我也比較喜歡 EdrawMax（億圖圖示），一款本地作圖軟件，功能也很強大。

ER 圖

后臺開發(fā)同學(xué)可能會接觸到 ER 圖，常用于數(shù)據(jù)庫設(shè)計中，表示數(shù)據(jù)的屬性和關(guān)系。

我一般不會手動去畫這玩意，需要的時候直接用數(shù)據(jù)庫管理軟件（比如 Navicat、JetBrains DataGrip 等）根據(jù)已有的庫表生成就好了。

UML 類圖

UML 類圖用于表示類與類之間的關(guān)系，幫助快速了解整個系統(tǒng)的設(shè)計結(jié)構(gòu)。

和 ER 圖一樣，我也不會自己去畫這破玩意兒，累死個人。一般直接用集成開發(fā)環(huán)境（比如 JetBrains IDEA）自動根據(jù)代碼去生成 UML 類圖就行了，如圖：

這不比我自己畫的好看？

可視化圖表

圖表可以更直觀地展示數(shù)據(jù)和趨勢，在 PPT 匯報中扮演著舉足輕重的地位。

常見的圖表有條形圖、柱狀圖、餅圖、折線圖等等。

雖然 Excel、PPT 都可以畫圖表，但相對有點丑，我比較推薦 Flourish ，一款在線生成可視化圖表的網(wǎng)站。

內(nèi)置了豐富的圖表類型模板：

選擇圖表類型后，配置要展示的數(shù)據(jù)和圖表樣式即可：

我最喜歡這個網(wǎng)站提供的 動態(tài)圖表 和 URL 分享 功能，可以快速制作那種動態(tài)變化數(shù)值的實時排行榜。

做好之后可以一鍵分享網(wǎng)頁地址，讓他人瀏覽，也可以嵌入到自己的網(wǎng)頁中：

思維導(dǎo)圖

我最常用的思維導(dǎo)圖軟件是 XMind ，使用方便、主題豐富：

但一般我不會直接在 XMind 中去寫思維導(dǎo)圖，而是先編寫好 Markdown 文檔，然后直接在 XMind 中導(dǎo)入文檔就能自動根據(jù)標題、列表等元素自動生成思維導(dǎo)圖了：

我之前的前端、Java、全棧學(xué)習(xí)路線的思維導(dǎo)圖都是用這種方法生成的，自己一個個編輯真的要累死。

靈感

為什么在這篇文章中，我沒有花太多的筆墨去講述各個圖表分別是什么作用、分別怎么畫呢？

因為畫圖這東西，可以模仿，多看多畫，熟能生巧。

當我需要畫圖時，如果畫不出來、沒有思路，就直接去網(wǎng)上搜索其他人畫的同類圖，照貓畫虎就行了~

Process On 里提供了大量的繪圖模板，大家都可以參考下：

以上就是本期分享，我是魚皮，有幫助還請 點贊 支持下 ??

最后再送大家一些 幫助我拿到大廠 offer 的學(xué)習(xí)資料：

指路：https://t.1yb.co/qOJG

歡迎閱讀 我自學(xué)進入騰訊的編程學(xué)習(xí)和求職經(jīng)歷，不再迷茫！

指路：https://t.1yb.co/w66s