編輯導(dǎo)讀：圖標(biāo)一直是UI設(shè)計(jì)中很重要的部分，工作中我們經(jīng)常需要思考怎么做出好看、差異化的圖標(biāo)。圖標(biāo)為什么這么重要？圖標(biāo)怎么做的好看？怎么針對(duì)不同的產(chǎn)品做出圖標(biāo)的差異性？本文作者對(duì)總結(jié)了自己對(duì)于圖標(biāo)的理解和思考，一起來(lái)看一下。

圖標(biāo)一直是UI設(shè)計(jì)中很重要的部分，工作中我們經(jīng)常需要思考怎么做出好看、差異化的圖標(biāo)。圖標(biāo)為什么這么重要？圖標(biāo)怎么做的好看？怎么針對(duì)不同的產(chǎn)品做出圖標(biāo)的差異性？將最近自己研究的關(guān)于圖標(biāo)的理解以及工作中遇到的問(wèn)題思考，梳理輸出分享給大家，希望能對(duì)大家在工作中遇到的關(guān)于圖標(biāo)的問(wèn)題有所幫助。

01 什么是圖標(biāo)

圖標(biāo)作為一種視覺(jué)語(yǔ)言，廣義上指具有指代意義的圖形符號(hào)，具有高濃度并快捷傳達(dá)信息、便于記憶的特性。常見(jiàn)的如，交通標(biāo)志、男女衛(wèi)生間的標(biāo)志等等。

而UI圖標(biāo)大致可以分成兩大類(lèi)：標(biāo)志性圖標(biāo)及功能性圖標(biāo)。標(biāo)志性圖標(biāo)，即手機(jī)桌面應(yīng)用圖標(biāo)的啟動(dòng)入口，這里是用戶接觸到產(chǎn)品的第一印象，決定了用戶的去留，同時(shí)也是品牌傳播的重要渠道；另一個(gè)是功能圖標(biāo)，出現(xiàn)在app或網(wǎng)站中，用于功能性性引導(dǎo)用戶進(jìn)行各種操作的圖像。

02 圖標(biāo)的優(yōu)勢(shì)

1. 節(jié)省屏幕空間

相對(duì)說(shuō)明的長(zhǎng)文字來(lái)說(shuō)，圖標(biāo)只需占用一個(gè)字符的位置就可以傳遞給用戶操作信息。比如在個(gè)人中心頁(yè)，我們經(jīng)?？吹降目头δ?，用文案表示需要“聯(lián)系客服”四個(gè)字（當(dāng)然英文或其他語(yǔ)言可能更長(zhǎng)），而用可以傳達(dá)信息的圖標(biāo)代替只需要占據(jù)一個(gè)字符的位置。

2. 不受地域語(yǔ)言限制

各個(gè)國(guó)家和地區(qū)都有自己的語(yǔ)言和文字，因此當(dāng)某一應(yīng)用在其他地區(qū)使用時(shí)需要進(jìn)行本地適配。圖標(biāo)卻不同，經(jīng)過(guò)不同平臺(tái)應(yīng)用長(zhǎng)時(shí)間的培養(yǎng)，很多圖標(biāo)已經(jīng)能夠被大多數(shù)用戶快速識(shí)別，甚至成為國(guó)際通用的圖標(biāo)，比如放大鏡圖標(biāo)意味著搜索，齒輪圖標(biāo)意味設(shè)置。圖標(biāo)的使用打破了語(yǔ)言的地域限制，在完全不用懂應(yīng)用文字意思的前提下，也不妨礙圖標(biāo)意思的理解，以及應(yīng)用的相應(yīng)功能操作。

比如，instagram上tab bar及主要操作都是直接使用圖標(biāo)表示并且沒(méi)有文字備注，并不影響用戶理解及操作。

3. 減少用戶辨識(shí)時(shí)間

人類(lèi)的左右腦分工是不同的，左腦主要從事邏輯思維，比如語(yǔ)言、數(shù)據(jù)、邏輯推理等；右腦主要從事形象思維，比如音樂(lè)、繪畫(huà)、空間幾何、想象等；而右腦處理圖形圖像的速度是左腦處理文字速度的60萬(wàn)倍。

根據(jù)美國(guó)國(guó)家生物技術(shù)信息中心（National Center for Biotechnology Information）的數(shù)據(jù)顯示，人類(lèi)的平均注意力跨度已經(jīng)從2000年的12秒下降到2013年的8秒。人類(lèi)大腦對(duì)圖形圖像的記憶也遠(yuǎn)勝于對(duì)文字的記憶，人類(lèi)會(huì)記住80%看過(guò)的東西，20%閱讀過(guò)的內(nèi)容和10%聽(tīng)過(guò)的東西。文字圖像化，引導(dǎo)用戶快速接收信息進(jìn)行操作，減少用戶的思考時(shí)間。

4. 提升整體視覺(jué)體驗(yàn)

好的一套圖標(biāo)能夠從圖標(biāo)的獨(dú)特性、象征性、記憶性、應(yīng)用性、組合性、變化性上打動(dòng)人心，從而激發(fā)人們點(diǎn)擊欲望。同時(shí)，圖標(biāo)集的統(tǒng)一性，一致性也會(huì)使的整個(gè)應(yīng)用給用戶傳遞視覺(jué)感受是統(tǒng)一、愉悅的，提升整個(gè)應(yīng)用的視覺(jué)體驗(yàn)。下圖為馬蜂窩推出V9改版視覺(jué)升級(jí)中的品類(lèi)圖標(biāo)優(yōu)化方案。

03 圖標(biāo)的歷史

如果要追溯圖標(biāo)的歷史，可以追溯到史前時(shí)代。在當(dāng)代由于圖標(biāo)高度濃縮信息、快速傳達(dá)信息、便于記憶等優(yōu)勢(shì)，在其他方面的應(yīng)用范圍也極為廣泛，比如國(guó)家的圖標(biāo)國(guó)徽，商品的品牌注冊(cè)商標(biāo)，app應(yīng)用的啟動(dòng)圖標(biāo)等等。關(guān)于GUI的圖標(biāo)史要從80年代第一臺(tái)桌面比擬電腦施樂(lè)奧托（Xerox Alto）開(kāi)始。

1. 80年代，圖標(biāo)先行者

1973年，Xerox的帕羅奧多研究中心（Xerox PARC）為了方便新用戶快速理解與掌握，首度公開(kāi)了第一臺(tái)使用桌面比擬的電腦施樂(lè)奧托（Xerox Alto），它是最早使用圖形用戶界面（GUI）的電腦之一。后來(lái)安迪·貝托爾斯海姆設(shè)計(jì)出的SUN工作站；蘋(píng)果公司的麥金塔電腦，最初都是參考了Xerox Alto的設(shè)計(jì)?？梢钥吹疆?dāng)時(shí)的用戶界面只有應(yīng)用程序本身的顯示圖標(biāo)及數(shù)據(jù)程序的啟動(dòng)圖標(biāo)。

直到1981年數(shù)學(xué)家戴維·史密斯（David Smith）博士和藝術(shù)家諾爾姆·考克斯（Nor Cox）結(jié)合藝術(shù)和技術(shù)，由考克斯設(shè)計(jì)、史密斯發(fā)明了一套圖標(biāo)用于Alto的繼承者Star的圖形用戶界面。此時(shí)對(duì)圖標(biāo)的定義是“計(jì)算機(jī)系統(tǒng)中數(shù)據(jù)或進(jìn)程的象形表示，用來(lái)取代命令和菜單，作為計(jì)算機(jī)支持與最終用戶對(duì)話的手段”?？梢钥吹竭@套圖標(biāo)都是方形的線性圖標(biāo)，具備簡(jiǎn)單的外觀和一致的設(shè)計(jì)風(fēng)格。

1983年史蒂夫·喬布斯推出了一款面向廣泛商業(yè)用戶的個(gè)人計(jì)算機(jī)，并以自己的女兒“Lisa”命名。當(dāng)時(shí)的Lisa系統(tǒng)界面十分簡(jiǎn)陋，并沒(méi)有給大眾留下太深刻的印象。次年喬布斯雇傭了Susan Kare為蘋(píng)果設(shè)計(jì)一套特有的圖標(biāo)和字體，應(yīng)用在1984年發(fā)布的麥金塔電腦中。麥金塔的圖形界面雖然不是第一個(gè)界面設(shè)計(jì)，但卻定義了之后絕大多數(shù)圖標(biāo)的外形，比如用來(lái)放置刪除文件的廢紙簍，表示保存的磁盤(pán)，以及蘋(píng)果鍵盤(pán)上的功能鍵「command」，這套圖標(biāo)不但個(gè)性而且經(jīng)典，這也Susan Kare為什么會(huì)被稱(chēng)為圖標(biāo)設(shè)計(jì)之母。（沒(méi)有物理感知的同學(xué)，建議配合B站up主“老師好我叫何同學(xué)”2020年11月發(fā)布的《80年代的電腦能做什么？》一起服用）。

在這之后的圖標(biāo)演化，經(jīng)歷了微軟的第一套電腦系統(tǒng)界面Windows 1.0的多色顯示；走極簡(jiǎn)風(fēng)格的ATARI TOS折疊式圖標(biāo)，這套圖標(biāo)的等距特點(diǎn)也成為電腦系統(tǒng)的標(biāo)準(zhǔn)之一；有四種顏色的AMIGA WORKBENCH用戶定制化圖標(biāo)；GEOS的輪廓著色圖標(biāo)；APPLE GS/OS的“文件夾繪畫(huà)“圖標(biāo)。這個(gè)階段的圖標(biāo)外型沒(méi)有太大，只是由于技術(shù)的不斷更新使圖標(biāo)開(kāi)始出現(xiàn)顏色。

直到1989年，當(dāng)時(shí)的史蒂夫·喬布斯已經(jīng)離開(kāi)了蘋(píng)果并創(chuàng)立了NeXTSTEP，這時(shí)的NeXTSTEP圖標(biāo)開(kāi)始出現(xiàn)陰影和高度，向我們展示了一種全新的圖標(biāo)設(shè)計(jì)方法。NeXTSTEP的圖標(biāo)也是第一個(gè)被認(rèn)為擬態(tài)的圖標(biāo)，圖標(biāo)開(kāi)始進(jìn)入擬態(tài)時(shí)代。

80年代末，圖標(biāo)已經(jīng)由最初簡(jiǎn)單的線性圖標(biāo)演變出顏色，以及3個(gè)基本尺寸?；镜某Ｓ脠D標(biāo)外形也被確定，比如文件、計(jì)算機(jī)、鉛筆和垃圾桶。此時(shí)圖標(biāo)也開(kāi)始進(jìn)入擬物時(shí)代。

2. 90年代，圖標(biāo)現(xiàn)實(shí)主義

WINDOWS 3.0時(shí)，微軟請(qǐng)來(lái)了Susan Kare為他設(shè)計(jì)桌面圖標(biāo)，我們可以看到和之前的圖標(biāo)有很多相似之處。蘋(píng)果的MACINTOSH SYSTEM 7.0也開(kāi)始出現(xiàn)了灰色的陰影，這個(gè)時(shí)候的圖標(biāo)基本趨向雷同。Geoworks在相同中采用靛藍(lán)色的邊緣以區(qū)分。BeOS則使用出現(xiàn)與現(xiàn)在2.5d類(lèi)似的設(shè)計(jì)風(fēng)格。IRIX使用陰影將圖標(biāo)漂浮起來(lái)。

蘋(píng)果在RHAPSODY DR2的應(yīng)用界面中使用等軸測(cè)圖結(jié)合透明遮罩，以及新技術(shù)的支持，這版圖標(biāo)設(shè)計(jì)更加細(xì)膩、細(xì)節(jié)更加豐富。

AMIGA OS 3.5則還是保持粗的像素顆粒感。

90年代時(shí)期的圖標(biāo)都是現(xiàn)實(shí)主義的等軸測(cè)擬物化圖標(biāo)，但受限于技術(shù)此時(shí)的圖標(biāo)像素的質(zhì)感還很強(qiáng)，圖標(biāo)使用投影增加空間感。

3. 新千年，圖標(biāo)擬物化

到了2000年，技術(shù)的革新帶來(lái)新的圖標(biāo)設(shè)計(jì)風(fēng)格，這時(shí)的圖標(biāo)開(kāi)始具有超高的拋光度、層次感、透明光澤、多陰影、模糊、柔化等等。這時(shí)候的蘋(píng)果和Windows界面出現(xiàn)了我們熟悉的樣子，圖標(biāo)類(lèi)似照片的質(zhì)感，使得圖標(biāo)不再只是單純的符號(hào)。

07年Windows的Windows AERO「Authentic（真實(shí)）、Energetic（動(dòng)感）、Reflective（反射）及Open（開(kāi)闊）」透明玻璃質(zhì)感是這種輕快、精致、細(xì)膩“圖標(biāo)洛可可風(fēng)格”的重要代表?，F(xiàn)在依然有很多人喜歡這套閃閃發(fā)光的界面。到這時(shí)，圖標(biāo)還是指計(jì)算機(jī)數(shù)據(jù)或進(jìn)程的象形表示。

2007年，蘋(píng)果發(fā)布第一代iPhone以及iOS系統(tǒng)，在iPhone 1代前，人們與手機(jī)的交互方式主要是鍵盤(pán)和手寫(xiě)筆，電容屏支持多點(diǎn)觸控技術(shù)使用iPhone用戶可以用手指直接與屏幕進(jìn)行交互。iOS的操作界空間也相對(duì)更大，因此系統(tǒng)桌面依然延續(xù)了寫(xiě)實(shí)的圖標(biāo)風(fēng)格，甚至可以更精致。（2009年，從iOS 3版本開(kāi)始，蘋(píng)果開(kāi)始采用擬物化設(shè)計(jì)風(fēng)格）

Google在2007年年底才與HTC、LG、摩托羅拉和三星一同推出以Android為主要操作系統(tǒng)的手持設(shè)備聯(lián)盟。為了協(xié)調(diào)不同廠商Google一開(kāi)始采用開(kāi)放的組件系統(tǒng)，使得各家廠商可以修改底層文件，應(yīng)用各放異彩的同時(shí)也是使得Android手機(jī)應(yīng)用界面設(shè)計(jì)也越來(lái)越碎片化，使得后期Google為了統(tǒng)一設(shè)計(jì)風(fēng)格不得不推出基于物理世界的Material Design設(shè)計(jì)風(fēng)格，當(dāng)然這是后話。這時(shí)的Android手機(jī)界面也在追求極致的擬物化。

2001年喬布斯提出電腦是數(shù)碼生活的中樞，但從2007年蘋(píng)果推出一代iPhone開(kāi)始，由于手機(jī)的便攜、快速、方便，手機(jī)的使用場(chǎng)景不斷占據(jù)人類(lèi)生活場(chǎng)景，從這個(gè)時(shí)候開(kāi)始圖標(biāo)更多指的是移動(dòng)端手機(jī)應(yīng)用的啟動(dòng)圖標(biāo)和應(yīng)用內(nèi)部的功能性圖標(biāo)。

4. 扁平風(fēng)格下的又一個(gè)十年

這個(gè)時(shí)候界面都使用極致擬物化圖標(biāo)，此時(shí)的用戶經(jīng)過(guò)多年的使用，已經(jīng)不需要通過(guò)與現(xiàn)實(shí)同樣的物理視覺(jué)來(lái)解決所謂“學(xué)習(xí)成本”的問(wèn)題。2010年微軟為了打通多設(shè)備的聯(lián)通，保證手機(jī)、電腦、平板多設(shè)備有一致的體驗(yàn)，發(fā)布了帶有明顯磁貼風(fēng)格（又稱(chēng)Metro風(fēng)格）的windows phone 7系統(tǒng)，圖標(biāo)開(kāi)始變得扁平統(tǒng)一的白色面型圖標(biāo)，也就是扁平風(fēng)格的開(kāi)端。（沒(méi)錯(cuò)扁平設(shè)計(jì)風(fēng)格并不是蘋(píng)果提出的）磁貼設(shè)計(jì)最適合的是觸摸的交互方式，微軟桌面系統(tǒng)也采用了移動(dòng)端的設(shè)計(jì)語(yǔ)言，完全有悖于之前用戶的操作習(xí)慣，Win8口碑大滑坡加上微軟系統(tǒng)升級(jí)的騷操作，導(dǎo)致微軟的Metro風(fēng)格猶如曇花一現(xiàn)，并沒(méi)有成為真正的流行。

蘋(píng)果緊接著發(fā)布的iOS7，與iOS6相比一改之前的極度擬物化，也并沒(méi)有像windows phone 7絕對(duì)的白色和面型圖標(biāo)，而是在之前圖標(biāo)的基礎(chǔ)上減少了底紋與質(zhì)感，蘋(píng)果嘗試在擬物和扁平之間找到了平衡，這樣的結(jié)果少不了Jonathan Ive的設(shè)計(jì)加持以及推動(dòng)。因?yàn)轱L(fēng)格的差異化太大，直到現(xiàn)在還有很多人在爭(zhēng)論擬物風(fēng)和扁平風(fēng)的蘋(píng)果那個(gè)更好看。

由于扁平風(fēng)格的持續(xù)流行，圖標(biāo)也延續(xù)著扁平風(fēng)格，中間也偶爾有出現(xiàn)類(lèi)似錘子手機(jī)的擬物風(fēng)圖標(biāo)，引起整個(gè)設(shè)計(jì)圈一陣討論，但整體趨勢(shì)還是扁平風(fēng)大行其道。

5. 新的風(fēng)格嘗試——Big Sur圖標(biāo)

2020年WWDC20蘋(píng)果發(fā)布macOS Big Sur，這次蘋(píng)果對(duì)設(shè)計(jì)進(jìn)行了大幅度的修改，相較于之前的扁平風(fēng)格以及不規(guī)則的外形，這次更新所有圖標(biāo)外形統(tǒng)一為圓角方形，靠近iOS系統(tǒng)。而整體質(zhì)感則是在扁平的基礎(chǔ)上增加些許質(zhì)感。macOS Big Sur不止圖標(biāo)更新外形與iOS相似，很多交互方式也與iPad端靠近，比如三端都有的組件化系統(tǒng)。前面我們說(shuō)到windows phone 7系統(tǒng)的目標(biāo)是打通多設(shè)備的聯(lián)通，保證手機(jī)端、電腦端、平板多設(shè)備的一致體驗(yàn)，而當(dāng)時(shí)面對(duì)剛遷移手機(jī)端的用戶來(lái)說(shuō)，有點(diǎn)過(guò)于操之過(guò)急，但這一想法并不是天方夜譚。這次macOS Big Sur的視覺(jué)更新更像是為打通iPhone、ipad與MAC的整個(gè)蘋(píng)果內(nèi)部系統(tǒng)的基礎(chǔ)設(shè)施建設(shè)。

當(dāng)時(shí)很多設(shè)計(jì)師覺(jué)得有點(diǎn)不倫不類(lèi)，外形雖然統(tǒng)一，但很多圖標(biāo)卻也丑的很別致，比如被吐槽最多的QuickTime Player。并紛紛曬出自己對(duì)蘋(píng)果的Big Sur圖標(biāo)的Redesign。

成立體圖標(biāo)增加紋理、描邊、模糊、層次越來(lái)越寫(xiě)實(shí)，但遠(yuǎn)遠(yuǎn)沒(méi)有達(dá)到擬物的狀態(tài)。2000年后，屏幕技術(shù)的發(fā)展，同時(shí)隨著photoshop修圖軟件的出現(xiàn)，圖標(biāo)設(shè)計(jì)可以添加越來(lái)越多質(zhì)感的，Windows、蘋(píng)果圖標(biāo)擬物化出現(xiàn)，這時(shí)圖標(biāo)還是指的計(jì)算機(jī)數(shù)據(jù)或進(jìn)程的象形。07年電容屏支持多點(diǎn)觸控技術(shù)被喬布斯使用在iPhone一代，移動(dòng)端開(kāi)始越來(lái)越多占據(jù)我們的生活，iOS 3開(kāi)始圖標(biāo)越來(lái)越擬物化。2010年人們身邊充斥著各種電子設(shè)備，不再需要通過(guò)與物理感知一樣的圖標(biāo)來(lái)理解背后的意義及交互方式，微軟為了實(shí)現(xiàn)多設(shè)備一致的體驗(yàn)，推出Metro風(fēng)格。iOS 7蘋(píng)果設(shè)計(jì)師Jonathan Ive極力推動(dòng)扁平圖標(biāo)的應(yīng)用，當(dāng)時(shí)充滿爭(zhēng)議。但之后極簡(jiǎn)、扁平、去除視覺(jué)噪音成為主流，扁平風(fēng)格火了十年。而當(dāng)時(shí)提出扁平風(fēng)格的微軟Windows 10 mobile 因?yàn)槎喽诉m配、7.5無(wú)法升級(jí)等問(wèn)題，被用戶詬病，2019年已經(jīng)停止更新。2020年蘋(píng)果Big Sur圖標(biāo)之前，扁平的圖標(biāo)減少視覺(jué)噪音方便用戶快速識(shí)別等優(yōu)點(diǎn)外，也限制著設(shè)計(jì)師的發(fā)揮，可以看到Dribbble上眾多設(shè)計(jì)對(duì)于圖標(biāo)設(shè)計(jì)都有自己的嘗試。圖標(biāo)的發(fā)展一直是技術(shù)、承載設(shè)備、設(shè)計(jì)師共同推動(dòng)的結(jié)果，圖標(biāo)的發(fā)明是為了降低電子設(shè)備用戶的理解成本，快速的傳遞信息，到現(xiàn)在無(wú)論如何發(fā)展信息傳遞依然是圖標(biāo)的核心。

歷史終于寫(xiě)完了，找資料找的頭禿，盡～力～了～。如有出入，歡迎指正，peace&love。

04 圖標(biāo)的語(yǔ)義分類(lèi)

圖標(biāo)繪制是將語(yǔ)義元素轉(zhuǎn)變?yōu)橐曈X(jué)元素的過(guò)程，以達(dá)到傳遞信息的目的。所以圖標(biāo)的建立，首先應(yīng)該確定圖標(biāo)的隱喻，也就是型的確定。（因?yàn)樗袌D標(biāo)都是在功能型圖標(biāo)基礎(chǔ)上進(jìn)行的設(shè)計(jì)變形或設(shè)計(jì)細(xì)節(jié)添加，因此之后文章除非特別說(shuō)明，舉例都會(huì)以功能型圖標(biāo)為主）

圖標(biāo)按圖像隱喻分類(lèi)可分為實(shí)物圖標(biāo)、象形圖標(biāo)、表意圖標(biāo)、文字圖標(biāo)、創(chuàng)造圖標(biāo)、組合圖標(biāo)。

1. 實(shí)物圖標(biāo)

實(shí)物性圖標(biāo)就是將真實(shí)的物品作為符號(hào)引導(dǎo)用戶點(diǎn)擊，一般用在表示新鮮的生鮮類(lèi)應(yīng)用，比如：如盒馬生鮮，叮咚買(mǎi)菜?；蚓哂衅放菩?yīng)的電商類(lèi)應(yīng)用，比如：得物、識(shí)貨。還有些沒(méi)有辦法符號(hào)化的物品，比如美團(tuán)買(mǎi)藥、聚美。

2. 象形圖標(biāo)

象形圖標(biāo)是最常見(jiàn)的圖標(biāo)繪制方式，即通過(guò)對(duì)一個(gè)物理物體的再現(xiàn)或參照來(lái)表達(dá)意義，表示單詞或短語(yǔ)的圖像符號(hào)。GUI剛出現(xiàn)時(shí)，用戶并不知道怎么進(jìn)行操作，因此對(duì)絕大需要傳遞的信息，都盡量模范現(xiàn)實(shí)生活中的實(shí)際物體，比如：代表刪除的垃圾桶，以及當(dāng)時(shí)電子軟盤(pán)表示保存。

這類(lèi)圖標(biāo)由于長(zhǎng)時(shí)間的使用，如果改變外形可能誤導(dǎo)用戶，外形無(wú)法做過(guò)多的變化。

3. 表意圖標(biāo)

表意圖標(biāo)是將沒(méi)有具象物體、比較抽象的概念，在發(fā)展的過(guò)程中創(chuàng)作并成為一種約定俗成的圖標(biāo)用來(lái)表達(dá)某些含義或操作，比如點(diǎn)贊圖標(biāo)，設(shè)置圖標(biāo)，音符圖標(biāo)代表音樂(lè)，+號(hào)代表增加。

4. 文字圖標(biāo)

有些詞或操作沒(méi)辦法用任何圖形進(jìn)行表現(xiàn)，這時(shí)會(huì)使用相關(guān)的文字進(jìn)行表現(xiàn)。文字本身就是一種演化而來(lái)的符號(hào)，比如返利。返利是最近才出現(xiàn)的名詞，沒(méi)有更好的圖形可以進(jìn)行表現(xiàn)，一般會(huì)使用“返”字作為視覺(jué)表現(xiàn)。另一種情況是在某些特定節(jié)日會(huì)使用文字宣傳作為圖標(biāo)，比如雙十一、618各大電商運(yùn)營(yíng)活動(dòng)。

5. 創(chuàng)造圖標(biāo)

創(chuàng)造類(lèi)圖標(biāo)的設(shè)計(jì)和功能并沒(méi)有直接關(guān)聯(lián)，本身是不具備傳遞功能的含義，一般是伴隨著業(yè)務(wù)的出現(xiàn)，用戶在長(zhǎng)時(shí)間使用過(guò)程中習(xí)慣熟悉圖標(biāo)傳遞的含義，有時(shí)會(huì)伴隨文字一起出現(xiàn)，經(jīng)典的比如蘋(píng)果的command鍵、藍(lán)牙圖標(biāo)，最近的小程序圖標(biāo)。

6. 組合圖標(biāo)

組合圖標(biāo)指將前面幾類(lèi)任意組合后產(chǎn)出的新圖標(biāo)，用來(lái)表達(dá)更為復(fù)雜的意思或操作行為，比如添加新用戶、微博的找人等等。

以上是圖標(biāo)設(shè)計(jì)詳解的第一篇——圖標(biāo)初始的內(nèi)容。當(dāng)然圖標(biāo)還有很多課題可以研究，比如圖標(biāo)的大小、圖標(biāo)的設(shè)計(jì)屬性、圖標(biāo)的原則、圖標(biāo)的設(shè)計(jì)流程以及關(guān)于圖標(biāo)可用測(cè)試等等。這些內(nèi)容會(huì)盡快更新，敬請(qǐng)期待。

資料來(lái)源：

• 圖像學(xué)的簡(jiǎn)要?dú)v史
• UI設(shè)計(jì)師想做好圖標(biāo)設(shè)計(jì)？請(qǐng)問(wèn)圖標(biāo)歷史了解過(guò)嗎？
• 微軟設(shè)計(jì)語(yǔ)言-磁鐵設(shè)計(jì)風(fēng)格（Fluent Design）
• 主流界面設(shè)計(jì)語(yǔ)言的變革
• 谷歌 vs 蘋(píng)果，到底哪家的設(shè)計(jì)更好？
• 學(xué)圖標(biāo)設(shè)計(jì)？這篇就夠了

作者：9號(hào)自習(xí)室； 公眾號(hào)：9號(hào)自習(xí)室；知乎專(zhuān)欄：9號(hào)自習(xí)室。

本文由 @9號(hào)自習(xí)室 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來(lái)自Unsplash，基于CC0協(xié)議