最近做了一組圖標練習(xí)，通過這次設(shè)計小練習(xí)，總結(jié)和分享下對現(xiàn)在比較流行的線性圖標和插畫風(fēng)圖標的一些思路和方法，不會的朋友快快來學(xué)習(xí)吧！

我們在設(shè)計或者繪制圖標之前，首先要搞清楚圖標的定義，圖標到底是什么，為什么要畫圖標等等。圖標是具有指代意義或者象征某種特殊含義的圖形，在不同場景下圖標的表達含義也會有不同。

一個好的圖標，應(yīng)至少具有三個特征：1⃣️指代性——就是象征具體某個事物或含義。2⃣️識別性——因為有了指代性，圖標本身應(yīng)具有一定的識別性和辨識度，避免誤讀、抽象主義等。3⃣️審美性——一個優(yōu)秀的圖標，在視覺上也應(yīng)有良好的表現(xiàn)。

現(xiàn)在的圖標風(fēng)格大致可分為擬物化和扁平化，兩者都有自己的優(yōu)勢，很難說到底是擬物好，還是扁平好。但在這個信息技術(shù)和互聯(lián)網(wǎng)快速發(fā)展的當今，扁平化快速，簡單，直接的信息表達更能迎合這個時代。

而現(xiàn)流行的扁平化風(fēng)格主要有以下幾種，設(shè)計風(fēng)格因時代而變，以后甚至?xí)霈F(xiàn)更優(yōu)秀的風(fēng)格，讓我們拭目以待。

大多數(shù)初級的設(shè)計師在作一些圖標設(shè)計和練習(xí)時常常會選用素材／臨摹這種方式，而我認為用素材／臨摹是相對低輸入和低產(chǎn)出的方法，雖然我并不是很排斥這種學(xué)習(xí)方式，但是我們是否能找到一種高效高產(chǎn)出的學(xué)習(xí)方法呢？

那么今天我就以線性圖標和插畫風(fēng)格的圖標做圖標設(shè)計的思路和方法給大家。（以下圖標來源于網(wǎng)絡(luò)，作者名忘記了，不好意思，如有侵權(quán)，請與我取得聯(lián)系）

線性圖標是一種簡約，概括，可以說跟早期的印象主義有一些關(guān)系。細節(jié)想對比較少，我們這里稱它為"減法圖標"。細節(jié)比較豐富，有一些裝飾元素、描邊風(fēng)格、色塊填充，材質(zhì)填充等一系列圖標風(fēng)格都可以說是插畫圖標，我們在這里稱它為"加法圖標"。

我們先來看兩張圖，可以充分表達圖標設(shè)計的核心："形"，這是圖標的核心思想。

一個圖標的形決定你表達的圖標的含義，所以經(jīng)常有一些小伙伴會遇到這樣的問題，"這個圖標不太像啊""這個圖標是什么啊"等

那首先，我們在找一些元素或者素材本身的時候，需要確定元素本身的形，就是我們之前強調(diào)的圖標本身的識別性。

對應(yīng)剛才的圖標做了個小練習(xí)，分別是咖啡，狗，植物。在一定場景下，結(jié)合生活本身，圖標也賦予了更多的含義。比如，咖啡可以代表休息。

那接下去是我具體設(shè)計圖標的一些方法。第一步：靈感、素材的收集。

這次練習(xí)找的素材是蘋果的五個產(chǎn)品，iphone/ipad/ipod/macbook/wacth,你可以百度，也可以去蘋果的官網(wǎng)下載素材。

第二步：思考。在設(shè)計任何一個圖標作品時，我們應(yīng)多思考，多理解。首先我們要去看圖標素材的形體結(jié)構(gòu)。

思考，分解，概括。所有物體都離不開立體幾何的拼接，比如下圖macbook的外輪廓是由一個圓角矩形和長方形組合而成。通過這樣的方法，不管什么物體，我們都可以對它的外形進行一次幾何分解和組合。得到最終的圖形。

第三步：繪制。機械制圖加減法，這是我自己取的名稱。很多工業(yè)設(shè)計的同學(xué)應(yīng)該都學(xué)過機械制圖，有興趣的同學(xué)也可以學(xué)習(xí)下。加減法，之前有提到，線性圖標風(fēng)格對應(yīng)的是減法，插畫風(fēng)格圖標對應(yīng)的是加法。

物體本身都可以通過機械制圖的方法去繪制它的不同視角的視圖，我們可以通過學(xué)習(xí)這種方法，僅僅只需要一個角度的物體用線稿的方式繪制出來，這是繪制圖標的第一步，也是非常重要的一步："形"的準確性。

這次借助的設(shè)計工具時SKETCH（強烈推薦啊，好處我就不多說了。沒有mac的小伙伴裝個黑蘋果吧，雖然我沒有試過。。。）用到的工具主要為上面幾個：形狀，鋼筆，裁剪。

這是產(chǎn)品的立面圖，通過剛才說的機械制圖原理繪制的圖標。

減法圖標——一些圖標，尤其是移動端，圖標的按鈕大小決定了圖標細節(jié)的取舍。線性圖標是圖形的提煉和概括。

加法圖標——細節(jié)豐富的插畫圖標。通過添加描邊，填色，漸變，陰影、裝飾等細節(jié)來豐富圖標。

同樣，輕擬物也是一種加法的繪制方法，更多的還原物體本身的細節(jié)。

第四步：視覺統(tǒng)一。任何一個圖標，大多數(shù)情況下是以成組出現(xiàn)的，同一組圖標應(yīng)保證基本的大小視覺比重統(tǒng)一，風(fēng)格統(tǒng)一等。

圖標不是畫畫，更多的需要直接表達信息和傳遞信息，圖標設(shè)計的整個過程都需要設(shè)計師不斷的思考，提煉，才能設(shè)計出好看以用的圖標。

教程結(jié)束，以上就是線性圖標和插畫風(fēng)圖標設(shè)計思路和方法分享，希望這篇文章能對大家有所幫助！