1、強化視覺(jué)

不是所有圖片都能驚艷用戶(hù)，很多時(shí)候，圖片也不足以撐起整個(gè)設計的視覺(jué)和形式感。

這個(gè)時(shí)候，圖標的重要性就顯現出來(lái)了。許多有趣的圖標和圖片結合起來(lái)使用，能夠強化圖片的內容，提供額外的信息，給予用戶(hù)以交互的提示，從視覺(jué)、交互、體驗三個(gè)層面提升設計感。

以上網(wǎng)站為例，整體的設計十分有趣，親切，且充滿(mǎn)活力。網(wǎng)頁(yè)中的人物角色旁邊的燈泡圖標中，就加入了牙齒的元素，非常點(diǎn)題。網(wǎng)頁(yè)左右側的色彩對比也平衡了整體視覺(jué)，左側偏白的部分和白色的圖標相互呼應。網(wǎng)頁(yè)其他的地方也合理地運用小圖標來(lái)強化視覺(jué)，很明顯的一個(gè)牙醫網(wǎng)站不是么?

2、引導交互

盡管有許多網(wǎng)頁(yè)和APP模板中都會(huì )采用三欄式的圖片+文字的布局，但實(shí)際上圖標并不需要在特定的地方出現。

圖標本身就是驅使界面交互性的一個(gè)關(guān)鍵元素，可以出現在任何地方，也可以結合視差滾動(dòng)的設計手法，使圖片隨著(zhù)滾動(dòng)而不斷運動(dòng)，橫跨多屏，引導用戶(hù)與屏幕不停地互動(dòng)。

Boone Selections 這個(gè)網(wǎng)站就使用各種圖片展現了葡萄酒從生產(chǎn)到運輸的流程，借助圖標來(lái)驅動(dòng)整個(gè)視覺(jué)，引導用戶(hù)不停的滾動(dòng)瀏覽。隨著(zhù)用戶(hù)的滾動(dòng)，圖標和各種元素之間不斷地進(jìn)行互動(dòng)。

3、使用動(dòng)效

雖然絕大多數的圖標都是靜態(tài)的。那么，就讓圖標動(dòng)起來(lái)吧!

不過(guò)，動(dòng)態(tài)圖標的設計也應該是有規則、有目的的。優(yōu)秀的動(dòng)態(tài)圖標的運動(dòng)方式和內容應該是有關(guān)聯(lián)的，同時(shí)它的運動(dòng)速度應該是適中的，因為過(guò)快的變化可能會(huì )讓用戶(hù)猝不及防，但是太慢了又會(huì )讓用戶(hù)等待太久?？刂坪霉澴?，動(dòng)效效果對用戶(hù)的吸引力還是很大的。

Sweet Punk 這個(gè)網(wǎng)站同樣采用了燈泡這樣的圖標元素，但是和之前的案例不同的地方在于，設計師在其中暗藏了許多可用鼠標光標觸發(fā)的動(dòng)效。圍繞著(zhù)燈泡的三圈線(xiàn)條會(huì )緩慢的浮動(dòng)，當光標靠近的時(shí)候會(huì )靠近光標，如同活物一樣。而當光標移動(dòng)到燈泡上的時(shí)候，其中的火焰會(huì )快速地閃動(dòng)，速度非?？?，和周?chē)膭?dòng)效形成速度差。

4、創(chuàng )建圖標集群

不同形狀、不同風(fēng)格的圖標一旦成群結對地出現在屏幕上，總能帶來(lái)不一樣的體驗。雖然這樣的應用方式常見(jiàn)于圖標推薦類(lèi)的網(wǎng)站，但是它實(shí)際上有著(zhù)更為廣泛的應用范疇。

你可以考慮將圖標擺成不同的陣列，如果你想強化視覺(jué)，甚至可以將圖標放大來(lái)使用。圖標本身可以用作鏈接，也可以單純只是當作指引性的圖片。圖標集群可以用很多圖標，也可以只包含兩三個(gè)。如何使用，使用多少，更多取決于你的設計決策過(guò)程。

使用圖標集群的一個(gè)重要好處在于，它會(huì )讓你跳出日常圖標的使用窠臼，重新思考圖標的使用方法。它的另外一個(gè)好處在于，你可以基于某個(gè)圖標包來(lái)設計，也可以根據需求自定義。這個(gè)時(shí)候，你可以一邊“玩弄”圖標，一邊做設計。

5、結合流行元素

圖標是整個(gè)設計項目的諸多組成部分之一，它需要契合整個(gè)設計策略。仔細審視你所需要設計的內容和風(fēng)格，再將圖標和流行的元素結合起來(lái)，營(yíng)造出符合現代風(fēng)格的美學(xué)特征。

圖標的一大特色就是它的靈活性。它從形狀到細節都可以充滿(mǎn)藝術(shù)性，從手繪風(fēng)到扁平化，從精致擬物到藝術(shù)化處理都很容易實(shí)現。一旦你確定了整體風(fēng)格，設計一套風(fēng)格匹配的圖標并不是太難的事情。

上示例子中的圖標所呈現出來(lái)的風(fēng)格、色彩、使用方法和規格都非常值得研究學(xué)習。

6、稍加調整

雖然圖標是可以自由設計的，但是許多特定功能、特定場(chǎng)合所能使用的圖標最好不要標新立異，比如社交媒體鏈接、搜索、購物車(chē)、導航箭頭等圖標。這些圖標的基本特征是約定俗成的，太過(guò)“富有創(chuàng )意”的構思可能會(huì )毀掉它們的基本可用性。

但你可以在調整色彩、修改形狀，甚至重新繪制這些方面下功夫。

簡(jiǎn)單的修改其實(shí)能做的事情不少。將圖標有針對性的結合你的整體設計來(lái)進(jìn)行修改，讓它們更加貼合你的設計和風(fēng)格。

Little Puds & Co. 的網(wǎng)站就是這么做的。這個(gè)品牌色本身是瑪卡龍綠，為了讓網(wǎng)站的整體風(fēng)格保持一致，設計師將社交媒體鏈接和搜索按鈕的色彩都調整成了品牌色，這樣保持了視覺(jué)的一致性。

結語(yǔ)

雖然圖標設計可能是設計項目中被考慮的最少的元素，但是它們可能是最有趣的設計元素之一。一套精心設計的圖標用好了，能給整個(gè)設計增色不少。