實驗內(nèi)容
尋找最美圖標(biāo)：找出你認(rèn)為圖標(biāo)設(shè)計和搭配做的比較好的界面，并給出理由。同時討論界面/圖標(biāo)設(shè)計過程的常見規(guī)則裳涛，提出你的見解诀拭。
實驗過程
一迁筛、 尋找圖標(biāo)設(shè)計和搭配較好的界面
我選擇的是網(wǎng)易的一款音樂App網(wǎng)易云音樂，以下為該App的界面展示：
選擇該界面的理由：
整個app的界面設(shè)計很簡潔，作為音樂類的app细卧，它的圖標(biāo)形象有非常典型的音符尉桩、電臺等音樂要素也很簡約，圖標(biāo)形象非常明確贪庙，給人傳達(dá)的功能也很清晰蜘犁。
再者，整個圖標(biāo)的風(fēng)格非常統(tǒng)一止邮，基本采用點这橙、線來構(gòu)成。除了“發(fā)現(xiàn)”界面的圖標(biāo)采用了點線面三種方式导披，其他頁面的圖標(biāo)均采用點屈扎、線的造型，包括圓角撩匕、粗細(xì)都很統(tǒng)一鹰晨。
整個圖標(biāo)的布局比較合理，在主頁面“發(fā)現(xiàn)”放置的是造型較大且功能最主要的圖標(biāo)止毕，在其余界面的圖標(biāo)也按照功能和重要性進行布局和大小安排模蜡。
二、討論圖標(biāo)設(shè)計過程中的常見規(guī)則
我從網(wǎng)易云音樂的App的圖標(biāo)設(shè)計中大概總結(jié)出這么幾點常見規(guī)則扁凛，這里我將自己總結(jié)出來的幾點和網(wǎng)易云音樂App界面的圖標(biāo)設(shè)計進行結(jié)合忍疾。
1. 形象準(zhǔn)確，意義明確：圖標(biāo)在很多時候應(yīng)該是起充當(dāng)指示令漂、提醒膝昆、概括、表述等作用叠必，所以應(yīng)該讓人容易理解它的含義荚孵，讓用戶一眼看出設(shè)計者所用表達(dá)的意思，以下四個圖標(biāo)如果沒有文字提示纬朝，我們也能通過形象聯(lián)想到它們的作用收叶，說明它們的形象比較準(zhǔn)確能讓人一眼看出其意義。
下面是有文字的圖標(biāo)共苛，沒了文字判没，我們也能基本猜對它們的功能，比如“我的消息”圖標(biāo)基礎(chǔ)造型是一封信隅茎，“個性裝扮”則以一件衣服為基礎(chǔ)造型澄峰，清晰明了。
2. 造型簡潔：在含義清楚的基礎(chǔ)上辟犀，由于圖標(biāo)面積比較小俏竞，所以過于復(fù)雜的圖標(biāo)可能會造成難以分辨以及含義模糊的現(xiàn)象，所以需要做到在去除冗余的細(xì)節(jié)的同時保證圖標(biāo)目的和功能性，做到簡潔又不失設(shè)計感魂毁。
這里選取了App里面的側(cè)面列表中圖標(biāo)玻佩，由于空間有限，圖標(biāo)的數(shù)量又比較多席楚，所以這里的圖標(biāo)造型都非常簡潔咬崔，基本都是由點和線構(gòu)成，在準(zhǔn)確保證形象意義的同時簡化了很多不必要的細(xì)節(jié)烦秩，比如“游戲推薦”用一個造型非常簡單的游戲機來表示垮斯，“聽歌識曲”同樣也是選用了一個麥克風(fēng)和一個音符來表示。
3. 設(shè)計獨特：雖然圖標(biāo)要求簡潔但是對于很多品牌來說闻镶，大部分的圖形設(shè)計會展現(xiàn)出品牌的特色甚脉，避免千篇一律，讓用戶在使用過程中能感受到來自這個公司或者品牌的風(fēng)格铆农。
從上面這張用戶的主頁牺氨，很多人能一眼認(rèn)出這是網(wǎng)易云音樂這個app，原因就在于其圖標(biāo)的造型雖然簡約但是有網(wǎng)易云音樂獨特的設(shè)計墩剖，比如這個“我的電臺”猴凹，很多app會采用一個小收音機的圖標(biāo)，而網(wǎng)易則使用這種由音樂震出波環(huán)的圖標(biāo)岭皂，尤其是有更新消息時采用紅點提醒郊霎，而不是以紅色數(shù)字提醒。
4. 視覺統(tǒng)一：風(fēng)格是一種具備獨有特點的形態(tài)爷绘，具備差異化的思路和個性书劝。在一個產(chǎn)品或者界面中圖標(biāo)的風(fēng)格必須一致，風(fēng)格造型的輪廓粗細(xì)的統(tǒng)一土至，顏色色調(diào)與調(diào)和的統(tǒng)一购对，材質(zhì)與紋理（肌理）的統(tǒng)一；當(dāng)然也包括用詞的風(fēng)格陶因，比如：我的文件夾或者這個文件夾骡苞，是有許多區(qū)別的。除了風(fēng)格還有就是圖標(biāo)的大小控制需要統(tǒng)一楷扬，同一級別的圖標(biāo)大小統(tǒng)一解幽，看起來更加規(guī)范。
以上兩排分別是“發(fā)現(xiàn)”和“我的”兩個頁面的圖標(biāo)烘苹，雖然它們之間可能存在一些差別躲株，但是在它們各自的圖標(biāo)區(qū)可以看到視覺風(fēng)格是一致的，包括線條的粗細(xì)镣衡、顏色的色調(diào)等徘溢，兩行之間的差別也是由于功能和布局的原因吞琐。
5. 布局合理：圖標(biāo)在整個界面中的位置需要根據(jù)其功能和重要性來進行合理布局。這里還是借用第④點里的兩張圖然爆，第二排紅色的圖標(biāo)整體會比第一排的圖標(biāo)大一點，原因在于其在app的最主要界面“發(fā)現(xiàn)”黍图，具有是需要突顯的功能曾雕，因此會比其他的圖標(biāo)更顯眼一些。再看下面的圖：
拿這張圖舉例助被，這里的“本地音樂”剖张、“下載管理”、“我的電臺”揩环、“我的收藏”搔弄、“關(guān)注新歌”等放在整個界面的中部金剛區(qū)，原因在于這是這個界面里較為重要的功能丰滑，而下面“我喜歡的音樂”顾犹、“私人FM”等都以卡片化的形式來表示，其中也用了圖標(biāo)的元素褒墨，設(shè)計比較新穎炫刷。
6. 配色協(xié)調(diào)：在整體界面中一般有背景色和主導(dǎo)色，所以圖標(biāo)的顏色要側(cè)重于點綴色或者著重色郁妈，其他不太重要的圖標(biāo)盡量選擇中性的顏色浑玛。這里網(wǎng)易云音樂用了他的云音樂的品牌色——紅色，所以在“發(fā)現(xiàn)”頁面的圖標(biāo)采用了品牌色來突出產(chǎn)品的個性噩咪。
這里一定要提一下顾彰，網(wǎng)易云音樂可以個性化裝扮，不僅可以設(shè)置背景圖案胃碾，還可以改變圖標(biāo)的顏色涨享。不僅如此，還能根據(jù)背景圖片的顏色自動調(diào)整圖標(biāo)的顏色以達(dá)到風(fēng)格的統(tǒng)一书在，比如說下面這張：
圖標(biāo)自動變灰色以適應(yīng)背景圖的主色調(diào)灰伟，這一點個性化裝扮真的很受年輕人喜歡！
實驗總結(jié)
總的來說儒旬，圖標(biāo)設(shè)計過程中的常見規(guī)則應(yīng)該包含規(guī)范性栏账、統(tǒng)一性、獨特性等特點栈源，要結(jié)合整個界面進行合理設(shè)計布局挡爵，不僅僅要關(guān)注圖標(biāo)本身的設(shè)計感，更要關(guān)注圖標(biāo)和整個界面的配合度。這次實驗我挑了我比較喜歡的網(wǎng)易云音樂App的界面禾酱，里面的圖標(biāo)設(shè)計不僅簡約而且有它獨特的設(shè)計感在，是我使用過的軟件中用戶體驗感比較好的一個装处，從它的界面和圖標(biāo)上也能夠?qū)W到很多設(shè)計過程中的常見規(guī)則闭翩。
