圖標設計的課程做了很久也很多，但不管怎么做，大家都還是會持續提出五花八門的問題，多數問題不是沒看完課程還是沒練習導致的，而是純粹的認知上的盲點，且這些盲點往往又非?；A。

往期教程：

所以，我要做個基礎的圖標基本概念的掃盲，讓所有初學者在學習圖標設計之前，先對 UI 圖標的設計有個統一的認知框架，尤其是對圖標的類型和使用的軟件、技法的認識，然后再去展開具體操作的學習。

一、圖標設計學習的基本認識

圖標設計是 UI 界面設計中的一環，也是一個相對特殊的技能分支。常規的 UI 界面設計過程是一個排版、布局的過程，即將幾何、文本、圖片、圖標按照一定的思路排列到一個固定的畫布區域中去。而圖標設計這是一個“繪制”過程，要使用特定的繪圖工具來實現圖標的圖形輪廓并填充適當的色彩。

既然使用的工具和技巧不同，就可以給出一個新的結論：

學習圖標設計和學習界面設計不是一件事……

也就是說，你光學會怎么做界面也做不了圖標，這是兩個沒什么相似點的獨立技能。UI 界面設計之所以好學且簡單就是因為那只是排列內容，而圖標設計就是真正的“設計”，包含了創作和繪圖的過程，這比界面設計的門檻高了不少。

這就形成了另一個反直覺的概念，即圖標雖然是界面的組成部分，圖標設計也是界面設計中的子集，但圖標設計本身卻比界面設計更難、門檻更高，入門圖標設計需要投入比界面設計更多的學習精力和練習時長。

同時，圖標作為一種平面視覺圖形的統稱，意味著它沒被限制在一個特定的設計形式還是風格中，有數之不盡的創意和拓展性，而不同的設計創意和風格就需要應用不同的設計工具或技法。

這就是圖標設計的另一個特性，想做不同風格的圖標往往就意味著你要掌握一套新的工具和技法，想要學會所有圖標風格的設計是不可能的，所以常規的圖標學習都是掌握一些基礎風格的設計以后，未來需要應用哪種圖標的風格再單獨去學習即可。

雖然圖標的每種風格都要單獨學習，但它們總還是有一些共性和基礎知識點是相通的，包含兩個部分：圖標規范和圖形繪制方法。

圖標規范即圖標作為 UI 界面的一部分需要具備的條件，如尺寸定義、柵格應用、圖形表意、一致性等要求。作為基礎知識點大家可以翻以前的分享了解，不在這里展開。

圖形繪制方法，則是使用設計軟件畫出圖標圖形輪廓的方式。而圖標大多都是比較規整、嚴謹的圖形（少數手繪風除外），所以要使用矢量繪圖的方式繪制，也就是要掌握設計軟件中矢量繪圖工具的使用。

不管是 UI 設計軟件還是平面設計軟件、3D 建模軟件都包含了矢量繪圖工具，它們的底層應用邏輯是相通的，但對矢量繪圖的功能實現上卻有一定差異。尤其是 UI 設計軟件，作為界面設計工具來說，它的矢量繪圖功能是非常簡陋的，對于圖標繪制上存在先天的短板。

所以這又有一個新的反直覺的結論，那就是：

UI 設計軟件并不適合用來畫圖標……

PS：這也導致我們做圖標課程里最大的麻煩，用 UI 軟件不適用缺陷多，用別的軟件又涉及受眾零基礎不懂操作的問題。

了解完上面這些基本概念以后，我們可以總結，圖標設計的學習可以分為三個部分，分別是：

但在真正的 UI 設計過程中，圖標設計的要求并不僅僅局限在這三個部分中，還有一個最重要也是最容易被忽視掉的能力 —— 圖標風格的選擇能力。即篩選出合適的圖標設計風格融入頁面的整體設計，不僅要提升所處頁面的視覺水平，還能保證視覺的統一性的能力。

這四點共同組成了在 UI 設計過程中和圖標有關的核心技能，前三者依靠主動練習來達成，后者則要通過經驗的積累來提升。

二、圖標設計軟件的主要解析

前面我們知道了，不同圖標設計風格需要使用的工具和技法是不同的，而這里我們就要了解，圖標設計中會涉及到的軟件有哪些，以及它們各自的特性和優缺點。

1. UI 設計軟件

首先討論的必然是 UI 設計軟件，包括 Figma、即時設計、Mastergo、Sketch 等。這些軟件設計的主要應用場景是完成 UI 界面的排版布局，只提供了非常基礎的矢量圖形編輯功能和圖層視覺效果，所以它們只能繪制一些圖形和效果都相對簡單的圖標類型，無法完成精度要求高或復雜的圖標設計。

這些軟件中 Sketch 的矢量功能是做得最好的（遙遙領先），其它軟件包括 Figma 也僅僅達到勉強能用的水平（很多細節問題和反直覺操作），所以想畫好圖標光掌握 UI 設計軟件是不夠的。

2. Adobe Ai

Adobe Ai 是最強大的矢量繪圖工具，包含了大量的矢量編輯、繪圖工具，可以實現任意復雜或精確的圖形效果。但是，Adobe Ai 有較高的入門門檻，需要單獨學習，且很多復雜的圖形還需要結合 PS 進行輸出，適合成為一個純粹的圖形輪廓繪制工具使用。

3. Adobe PS

Adobe PS 是一個多功能的平面視覺繪圖工具，相比 Ai 它的矢量圖形編輯能力較弱，但優點是它可以實現所有我們可以想到的平面視覺特效。包含了插畫、彌散、擬物等特征的風格，都可以很輕易地通過 PS 的功能實現，而這些進階視覺功能都是 UI 軟件和 Ai 提供不了的。

4. 3D 類軟件

3D 類軟件即 Blender、C4D、Maya 等包含了從建模到渲染的軟件類型，用于實現一些 3D 效果的圖標。想實現什么效果看設計師自由發揮，最后渲染完導出成位圖置入界面即可。Figma 或 Ai、PS 中雖然也有實現 3D 效果的插件，但是它們可實現的結果局限性非常大，只能生成指定一兩種風格的圖標。

5. AIGC 類工具

AIGC 類工具即 Midjouney、Stable diffusion、ChatGPT、即夢 AI 等人工智能生成軟件，通過輸入指令文本 Prompt 來生成對應的圖形結果。

不管網上怎么吹噓 AIGC 的能力，或給出完成度極高的案例成果，都不要輕易相信它們已經十全十美，可以完整接入商業應用中。圖標是一種相對嚴謹的圖形，尤其對于整套圖標來說更需要細節的統一，而這恰恰是 AIGC 最薄弱的環節，在短期內它還完全無法替代真實的繪制過程。

以上就是 UI 設計中進行圖標設計會關聯到的主要軟件類型，看起來雖然多，但一定要牢記，并不是學圖標設計就要把這些軟件全部學完，而是要根據我們的實際需求學習。

并且，如果只畫圖標，那么每個軟件內所要掌握的工具和功能是非常有限的，遠低于正常學習該軟件的難度。所以從效率角度出發，學習不同軟件盡量從實例操作教程入手，而不是看該軟件的零基礎教學。

三、認識這個圖標怎么畫？

了解完圖標涉及的軟件類型和特性以后，下面我們就要基于圖標風格出發，來認識主流的圖標設計風格有哪些以及它們適用的軟件工具。

Style1：一般工具圖標

一般線性和面性圖標通常使用最基礎幾何+布爾和少量的鋼筆錨點控制，就可以完成繪制。所以勉強可以使用 Figma 等 UI 設計軟件直接繪制，能使用 Adobe AI 可以實現更精細可控（像素完全對齊）的結果，這個看項目的實際需要決定。

Style2：復雜工具圖標

復雜工具圖標和基礎的差異，就是圖形不再只是使用簡單的矢量工具能畫出來了，所以這類圖標基本只能選用 AI 來完成，要應用更復雜的鋼筆工具以及路徑查找器功能。

Style3：玻璃擬態/新擬態/彌散型圖標

玻璃擬態、新擬態、彌散型圖標，都屬于 UI 設計獨有的圖標設計風格，而這些風格對圖標輪廓的要求并不高，只有簡單的圖形能塑造這些質感，所以使用 UI 設計軟件就足以完成。

Style4：擬物風格圖標

擬物風格雖然是前幾個世代的 UI 主流風格，但現在依舊有一定的應用場景，比如復古相機應用、DJ 調音臺工具、聲卡插件界面等等。想要實現高精度的擬物設計圖標，就只能使用 PS 來完成，因為要應用 PS 中的復雜的蒙版工具，以及繪制光影、紋理用的濾鏡和后期處理。

Style5：輕擬物風格圖標

輕擬物風格圖標是在擬物基礎上進行簡化后的圖標設計風格，保留了一定的擬物特性，但又讓圖標的視覺效果看起來沒有那么復雜。最簡單的輕擬物設計圖標可以用 Figma 等 UI 軟件勉強實現（京東閃送圖標教程里的），如果要做精度更高的輕擬物設計風格，就只能用 PS 才能完成。

Style6：插畫風格圖標

插畫類圖標分兩種，手繪型和矢量型。手繪型要借助數碼手繪工具完成，所以基本只能用 PS 來畫（iPad 上的另說）。而如果是矢量插畫型的，則使用 AI 來繪制更合理。

Style7：2.5D 風格圖標

2.5D 風格也稱軸測圖風格，屬于插畫風格的一種，但它有相對標準的繪制步驟和要求，所以算成一個獨立的分類。繪制 2.5D 圖標需要應用大量的矢量圖標，以及進行邊角的對齊，所以 AI 是完成 2.5D 風格中最合適的軟件。

Style8：3D 風格圖標

3D 類風格包含了很多細分的風格，如 lowpoly、輕質感、微軟風等就不做細分了，想要實現這些效果只能使用 3D 軟件進行建模和渲染。雖然 3D 軟件有很多，但 3D 圖標的模型和效果都很基礎，它們都能夠輕易實現。但基于免費和教程量的影響，Blender 是完成這類圖標的最佳工具。

Style9：游戲風格圖標

游戲類圖標只是個大類的統稱，也包含了各種各樣的圖標風格類型，但最有代表性的，就是手繪風格。而這類風格想要進行原創的話只能使用 PS 來繪制，但因為游戲圖標細節多，圖形要求不太嚴謹，所以可以借助 AIGC 工具生成，大幅度提高圖標設計的效率。

以上就是我們整理的日常可以接觸到的最常見的圖標風格類型，還有其它設計風格就不一一例舉。只要理解這些風格圖標的適用工具以及繪制思路，就可能在看到其它圖標設計風格后舉一反三，自己構思出它們適用的工具和技法的應用。

結尾

圖標的入門到掌握是一個比較艱苦的過程，基礎工具圖標的繪制是整個圖標設計的核心基礎，它的練習量是需要以千記的（大概需要一整個月的練習），偷懶是跨不過入門的門檻的。

最后，比掌握圖標設計技巧更重要的技能，就是選擇適合當前界面的圖標風格的能力，這也是我們在正式課程中建議優先訓練和掌握的技能。

歡迎關注作者的微信公眾號：「超人的電話亭」