這(zhè)次我會(huì)講解一下如何把一個圖标設計的更好(hǎo)熱煙，中間我會(huì)分享一些自習來己訓練過(guò)程中收獲的心得，希望能(néng)幫到大家些術。

“随著(zhe)扁平風格的出現……” 這(zhè)些虛的科什我就(jiù)不說(shuō)了。

在自己開(kāi)始做圖标練習之前，我對(duì)圖标的概念僅僅是慢銀好(hǎo)看、簡單，隻要稍微動機練幾下就(jiù)可以學(xué)會(huì)了，而開(kāi)始接觸刀制之後(hòu)才知道(dào)，原來圖标設計這(zhè)票店麼(me)有講究。

在練習的過(guò)程中，我看了很多國(guó)外設計師寫的關于圖标設計說她的一些文章，從基本的視覺元素到人的系統感知，也終于理解爲什麼店西(me)如今的界面(miàn)設計中，圖标會(huì)占據如此大比例月市的原因了。

有人說(shuō)：“人們對(duì)于抽象概念或中場藝術性強的圖像的理解能(néng)力數朋并不差。” 每個人的視覺感知能(néng)力都(dōu)能(néng)輕易的理車照解一些圖像所包含的意義，因此成(chéng訊銀)熟的視覺感知是更有效的信息傳遞途徑。

所以我總結了以下三個原則來談談圖标設計需要注意的事(shì)項：

可識别性視覺統一差異性

可識别性

最新的 IOS 設計原則被(bèi)人們概括爲：大、黑理答、簡。我也去看了些相關數據，在視覺的設計中，最受藍樂歡迎的顔色也确實是黑色，其次是白色。所以沿用到圖信和标設計中，黑白圖标也是在界面(miàn)中最廣泛被(bèi)使用的。（除中區了那些概念設計）

爲了讓圖标提升界面(miàn)中信息的被(bèi快還)理解性，很多設計師也會(huì)用黑白色去設計花花圖标，原因有兩(liǎng)個刀路：一個是顔色會(huì)幹擾用戶的理解力； 界面(mi拍長àn)中顔色多了，會(huì)消耗用戶尋找圖标的時(shí)身看間；

因此顔色是識别性中需要注意的一點，爲了提高用戶的可識别性，我們的設讀能計更應該遵循用戶習慣。

有一部分設計師的想象力非常豐富，這(zhè)是設計師的一大優化小勢，但是切忌將(jiāng)圖标設計的白下過(guò)于個性，讓用戶難以理解。

Instagram 的設計就(jiù)是就(jiù)是比較典型公森的新風格界面(miàn)，圖标易于理解，且用黑色作爲人路基調，識别性高，用戶也易于理解，這(zhè間舊)也是爲什麼(me)這(zhè)些圖标沒(méi)海光有文字做解釋的一個原因。

不過(guò)我個人建議在圖标的設計中加體兵入一點點自己的創意更能(néng農算)增加産品的趣味性，所以不要太壓抑自己的天性。

上面(miàn)的說(shuō)明是爲了喝錯讓大家在設計圖标時(shí)要注意的一些細節。當然，如果是一些個性化圖标，顔色資麗也要突出。比如某些圖标的顔色盡自家可能(néng)保持實體物質的相近色，這(zhè)了上樣(yàng)也不會(huì)讓用戶在理解上有偏差。

在設計完這(zhè)些圖标後(hòu)，設計師要做兩(liǎng)個測試：數音一個是無背景測試，另一個是基于背景的志制圖标測試。

第一個意思是，把圖标單獨放在一個畫布上，看看同畫白事(shì)能(néng)不能(néng)知道(dào)這(zhè)個圖暗雜标的意思。

另一個是將(jiāng)圖标放在界面(身好miàn)中，看同事(shì)（項目化間外的同事(shì)）是否能(néng)理快船解圖标的含義。

視覺統一

不同類型的圖标有不同的特征，稍微一點變化，都(dōu都秒)會(huì)破壞整套圖标的統一性。包括複暗物雜度、形狀、線條粗細等等。

我在臨摹整套圖标的過(guò)程中，很明顯能(n玩下éng)看出原作者對(duì)于圖标的把控性有多強，每處細節都(dōu)調學費整的非常到位，以至于我在制作的區高過(guò)程中遇到不少麻煩。不過(guò)解決之後(hòu木國)，自己在創意圖标的時(shí)愛車候就(jiù)發(fā)現輕松不少。比如電舊：整體風格的統一圖标的大小控制

因爲在設計的過(guò)程中發(fā)現這弟花(zhè)兩(liǎng)個問題比較多，所跳如以在這(zhè)裡(lǐ)單獨拿出來說(s好來huō)。

整體風格的統一：我這(zhè)次設計是一套杯子的圖标，爲了統一風格我將(jiā用化ng)所有線條的粗細都(dōu)設置爲 2 px，然後(hòu)做制劇了偏 MBE 風格的設計。爲了能(néng)讓所有杯子統一，我在杯子裡議鐵(lǐ)加入了酒，所以整套圖标也就(ji吃用ù)成(chéng)了裝酒的各種(zhǒng低可)瓶子和杯子。而點小氣泡就(jiù學風)是爲了增加了一種(zhǒng)趣味性且更統一。

圖标大小的控制：前期在設計的過(guò)程中，我發(f就金ā)現我的圖标大小有波動，非常不統一，甚至是一個大一個小，所長兵以我加了個限制，一來可以約束圖标的尺寸盡量統一，二來可以顯得更加規範。

還(hái)有個問題要點一下大家：就(jiù)是在設計圖标的過作窗(guò)程中，我全程都(dōu)是用矢量工具繪制，但長然後(hòu)做布爾運算，再用錨點去調整。如果用鋼西高筆去勾可以是可以，但是如果水平不夠高，曲線就(jiù)歌作會(huì)不協調。

差異性

設計一套圖标時(shí)，要盡量放大月離圖标之間的差異性，減弱圖标之間的相似性，這(zhè愛厭)是最容易被(bèi)設計師忽略的一項原則，往往爲了保持視短靜覺風格的統一性、使用同一元素而舍棄了各務年圖标的差異性。

假如一套圖标，長(cháng)得都輛視(dōu)差不多，那用戶在界面(miàn)中找某個功能金個(néng)要花費的時(shí)間報風會(huì)比想象中的長(cháng)很分他多。他們會(huì)去探索圖标的功能(néng)作用，看跳轉的頁面(mi火照àn)是否是自己想去的界面(mià有司n)，然後(hòu)再返回。

你可以將(jiāng)設計完的一套圖标展示出來：然後(hòu)你說(志師shuō)出一個名詞，讓同事(shì)去選擇是哪個，這(站謝zhè)樣(yàng)可以很好(費生hǎo)的檢測圖标的差異性和識别性。

有人可能(néng)會(huì)誤解統一性和差異河我性的概念，統一是圖标樣(yàng)式及風格統一，而很說差異是圖标與圖标之間的含義要明确。

還(hái)有一點，在設計的過(guò)程中一定要區做業分被(bèi)選擇和未選擇的狀态，讓用戶窗商知道(dào)我們的圖标給予了他反饋。

總結

最後(hòu)來說(shuō)說(shuō)爲什麼(me)我們要設計銀議圖标：

提升用戶對(duì)信息的感知速度；通過(guò)視覺國慢的感知，提高用戶的界面(miàn)記憶；更加節省空間，避免了長(chán在家g)文的使用；增強界面(miàn)設計感，讓河作界面(miàn)更加協調。

作爲一個互聯網行業的設計師，我們更應該在圖标以離北外去尋找靈感，包括建築、字體、工業設計、心理學(xué)、自然或雪器其他領域。

現在的圖标之間，風格和設計樣(yàng)式看起(qǐ)來越電業來越像，所以每個人都(dōu)應該提高自己的水平山就，設計出區别于他們的圖标，讓自己處信船于一個領先的位置。