自從扁平化還有極簡設計開始流行之后,圖標的設計越來越重要,經(jīng)常有設計師問,到底軟件程序里面的這個圖標怎么設計?
另外網(wǎng)頁設計的設計師也會問,我們這平臺有vip會員,那vip會員的圖標要怎么設計?
還有一個app的設計,這聊天里面的群組圖標,要怎么設計?
圖標的設計,我認為是對于ui/ux設計師來說;是最難的工作之一。
圖標的用意是什么
我們會使用圖標就是用它來在使用者界面上傳達有意義的東西;而這個有意義的東西,有可能是你的對象、想法、動作,然后設計師把這些有意義東西視覺化。
圖標的優(yōu)點
1. 它是一個全世界共通的語言,不會受到你文化與語言的影響,舉個例子,大家都知道手機對吧,手機的樣式很多種,但是看下這個圖標你是不是馬上就可理解到這個是手機的圖標?
手機圖標
2. 可以快速讓使用者識別,尤其是在快速移動的時候,你可以馬上輕易的找到你要的功能與東西。
手機在移動的中圖標的形象會是這樣子,比起文字,更容易在移動的時候識別
3. 增加設計的美感。
4. 節(jié)省空間,尤其對于喜歡極簡設計或者扁化的設計。
5. 圖標是一個非常好的點擊目標。
以上說了那么多的優(yōu)點,但是這個優(yōu)點有個前提,那就是你的圖標要設計得非常好,并且可以讓使用者馬上看的出來你要表達的意思,如果不是,那么你會讓使用者產(chǎn)生困惑,導致使用者想要完成某項任務或者事情,使用者會操作失敗或者錯誤點擊。
比如:
看下一下gmail,我紅色圈起來的部分
gmail信件內(nèi)的圖標
你可以只看圖標就知道這個是什么意思嗎?
設計師通常犯的錯誤
說了那么多來看很多設計師曾經(jīng)犯的那些錯,導致使用者抱怨最多,并且造成使用者困擾。
1.經(jīng)常發(fā)明圖標,導致使用者對于圖標不是很了解導致使用者常常錯誤點擊。
2.常常抱怨只要一改版就不知道哪一個功能跑到哪里去了。
3.圖標畫得太細節(jié),太會發(fā)揮創(chuàng)意導致使用者與內(nèi)容搞混,說白點就是圖標搶了內(nèi)容的風采,讓使用者注意的點放在圖標上不是內(nèi)容上,然后在小尺寸上那么細節(jié)的圖標根本沒有必要;使用者大多也看不是很清楚。
4.使用一些通用圖標但是沒有考慮到多平臺的問題,實際上同樣是垃圾桶,ios與android本身就有很大的不同。
5.使用意義不是很明確的東西卻要用圖標表達,自己太會發(fā)揮創(chuàng)意導致使用者認知上的困難,例如app的里面的特殊圖標要怎么畫,結果往往是自己在爽,沒有考慮使用者能否領會。
6.為了省下空間而省下空間,沒有考慮使用者對于學習新圖標的學習成本。
設計與選擇圖標遵循的五個原則
所以你應該這樣子做:
一. 能不能在五秒內(nèi)判斷出你的圖標的意義
如果不行請重新設計。
二. 選擇通用性高的圖標
例如下面這些,你一看就知道什么意思
如果你是自己定義這些圖標,ios與android的雖然外型差不多,但有明顯的風格差異,有些圖標的差異性非常大,要找出適合該平臺的設計的圖標,對于ios與android平臺優(yōu)化,而不是設計一個共用圖標全部平臺通用。
比如:
這兩個差異很大的圖標,卻是分享,上面是android下面是ios
三. 保持一致性
通用性圖標選擇有些要很注意,如果你選擇的圖標在通用上常常代表兩種意思以上,那你在使用上要特別小心,這邊建議作法是保持一致性,例如愛心代表加入我的最愛,那整個平臺的愛心都是加入我的最愛。
幾個通用性高但卻代表很多意義圖標如下
四. 用文字說明抽象的圖標
如果空間允許,請你一定要使用文字說明;假設你今天要設計一個圖標這個圖標是很特殊的,例如群組、vip、天氣、快樂….etc;你所設計的這類型抽象的圖標,最好加上文字說明。
如果空間不允許,那怎么辦,那你應該不要用圖標而使用標簽來代替圖標。
空間真的不夠,改用標簽
還有設計抽象類型的圖標,一定要在真實世界中找到相關聯(lián)性,盡量不要完全無關;不然你的圖標就算用文字說明,也很難讓人明白的意思或者快速記住這個圖標的意思。
因為抽象的標簽很復雜;你這個圖標可以用許多的詞來表達它的意思,但往往使用者并不知道這個圖標的意思。
例如:
圖標加上標簽
五. 清楚的特征外觀
你在設計圖標的時候不論是抽象還是共用的;你不應該花太多時間在細節(jié)上,因為太小的圖標細節(jié)是很難被看出來,你應該要花更多時間問自己,使用這類圖標的意義在哪里。
所以在特征外型上要有真實的物理特征或者視覺效果。
例如下面這個圖標就是用來表示測試手機網(wǎng)速的。
測試網(wǎng)速
經(jīng)典的抽象圖標:設置。
設置的圖標
我想大家都看過,設置大部分會使用的圖標都是齒輪來表示,那為什么呢?
傳統(tǒng)上,機械的操作調(diào)整就是利用用齒輪位置/類型/尺寸來決定,講白一點大家看過機械時鐘表嗎,那要怎么調(diào)整速度…etc,它是怎么跑的是不是要調(diào)整齒輪就可以了?
因此,使用齒輪進行設置是一種隱喻,如果你想改變運作方式,你需要改變系統(tǒng)的內(nèi)部運作,這通常都是齒輪的圖標。
全站高品質(zhì)素材免費下載!