圖標(biāo)設(shè)計(jì)第一講2023/1/15圖標(biāo)設(shè)計(jì)前言：圖標(biāo)設(shè)計(jì)是界面設(shè)計(jì)中很重要的一部分。界面設(shè)計(jì)又叫UI設(shè)計(jì)，廣義的UI設(shè)計(jì)是一種結(jié)合計(jì)算機(jī)科學(xué)、美學(xué)、心理學(xué)、行為學(xué)，及各商業(yè)領(lǐng)域需求分析的人機(jī)系統(tǒng)工程，強(qiáng)調(diào)人—機(jī)—環(huán)境三者作為一個(gè)系統(tǒng)進(jìn)行總體的設(shè)計(jì)。

2023/1/15圖標(biāo)設(shè)計(jì)前言：對(duì)于設(shè)計(jì)師來講更多涉及的是GUI圖形用戶界面設(shè)計(jì)，又稱圖形用戶接口是指采用圖形方式顯示的計(jì)算機(jī)操作用戶界面。指的是人機(jī)交互圖形化用戶界面設(shè)計(jì)。

2023/1/15圖標(biāo)設(shè)計(jì)一、關(guān)于圖標(biāo)：定義：圖標(biāo)出現(xiàn)在軟件界面中還是一件不久的事情，它通常被認(rèn)為是諸如文檔、存儲(chǔ)介質(zhì)、文件夾、應(yīng)用程序以及垃圾桶等對(duì)象的圖形替代物。從某種角度來說，圖標(biāo)有點(diǎn)類似標(biāo)志、徽標(biāo)等物體的特性，因?yàn)闊o論是圖標(biāo)還是徽標(biāo)，一旦出現(xiàn)，總是希望能夠被觀者識(shí)別并且記??！圖標(biāo)與徽標(biāo)的區(qū)別在于，圖標(biāo)更多采用直觀的比喻，講究一目了然；而徽標(biāo)更喜歡象征，追求圖形的象征意味。2023/1/15圖標(biāo)設(shè)計(jì)圖標(biāo)是一個(gè)極度限制中的設(shè)計(jì)。為了在桌面上排列的整齊，圖標(biāo)通常都是正方形構(gòu)圖，同一位置的圖標(biāo)都有同樣長(zhǎng)寬的尺寸；尤為突出的是圖標(biāo)的尺寸都特別小，Windows最大的圖標(biāo)不過1.69厘米見方，Macintosh雖然支持128×128（Pixel）的圖標(biāo)，那也不過4.52厘米見方。2023/1/15圖標(biāo)設(shè)計(jì)2、類型：圖標(biāo)有幾種不同類型程序圖標(biāo)指的是那些在桌面能夠單擊選擇，任意移動(dòng)，雙擊則執(zhí)行命令的圖標(biāo)；工具欄圖標(biāo)指的是那些位于工具欄，通過單擊選擇該工具，然后在畫面可以進(jìn)一步執(zhí)行命令的圖標(biāo)；按鈕圖標(biāo)指的是那些位于面板上，形似現(xiàn)實(shí)生活中按鈕，單擊就可執(zhí)行命令的圖標(biāo)。當(dāng)然還可以有其他不同的劃分方式。如果從操作系統(tǒng)的不同，可以大致劃分為Windows圖標(biāo)和Macintosh圖標(biāo)；就某一操作系統(tǒng)而言，又可分為系統(tǒng)圖標(biāo)和應(yīng)用程序圖標(biāo)，等等。2023/1/15圖標(biāo)設(shè)計(jì)一、關(guān)于圖標(biāo)：程序圖標(biāo)工具欄圖標(biāo)按鈕圖標(biāo)2023/1/15圖標(biāo)設(shè)計(jì)3、圖標(biāo)屬性：前面已經(jīng)描述過，因?yàn)榫唧w應(yīng)用條件的限制，圖標(biāo)有其自身特殊的屬性。1）首先是圖標(biāo)尺寸：對(duì)于WindowsXP用戶，常見的圖標(biāo)有四種尺寸，分別是48×48、32×32、24×24、16×16，單位都是像素。需要設(shè)計(jì)和制作的是除24×24外的那三種尺寸的圖標(biāo)，24×24像素的圖標(biāo)用在“開始”菜單的右側(cè)，它由系統(tǒng)自動(dòng)生成，不需要單獨(dú)提供。在系統(tǒng)默認(rèn)狀態(tài)下，WindowsXP顯示最大的圖標(biāo)是32×32，當(dāng)我們?cè)谧烂姘词髽?biāo)右鍵點(diǎn)選“屬性”面板，就可以在“外觀”菜單中“效果”的彈出面板找到“使用大圖標(biāo)”復(fù)選框，默認(rèn)狀況下是沒有選，如果選定，則桌面圖標(biāo)都會(huì)換為48×48；用戶還可以在同一面板找到“高級(jí)”的彈出面板，然后設(shè)定圖標(biāo)大小，最大可以設(shè)定72×72，遺憾的是Windows沒有Mac那樣強(qiáng)大的圖標(biāo)管理功能，所以如果設(shè)定72×72，桌面空間就太擁擠了。2023/1/152023/1/15圖標(biāo)設(shè)計(jì)對(duì)于MacOSX的用戶，圖標(biāo)尺寸最大可以是128×128。OSX在桌面和在硬盤管理的“顯示為圖標(biāo)”命令下都使用48×48的圖標(biāo)，下級(jí)圖標(biāo)才是32×32。但這并不意味著MacOSX就不使用更小的圖標(biāo)，當(dāng)我們把“顯示”設(shè)為“為分欄”和“為列表”兩種情形時(shí)，系統(tǒng)就使用16×16的小圖標(biāo)。當(dāng)然最為MacFan所津津樂道的還是Dock的神奇放大縮小功能。神奇放大縮小功能2023/1/15圖標(biāo)設(shè)計(jì)2）圖標(biāo)的常用格式有以下幾種：PNG，GIF，ICO，BMP，

PNG：無損壓縮格式，支持透明，兼顧圖像質(zhì)量和文件大小，但是請(qǐng)注意，PNG格式在網(wǎng)頁(yè)中，IE6.0或者之前的所有版本，不支持透明和半透明。GIF：網(wǎng)頁(yè)圖片常用格式，支持透明，優(yōu)點(diǎn)是壓縮的文件小，支持GIF動(dòng)畫，缺點(diǎn)是不支持半透明，顏色數(shù)最多只能顯示256種顏色，透明圖標(biāo)的邊緣會(huì)有鋸齒，要解決此問題，必須在存成此格式時(shí)候，添加相同背景色的雜邊，比較麻煩。

JPG：有損壓縮，優(yōu)點(diǎn)是文件小，圖像顏色豐富，缺點(diǎn)是不支持透明和半透明ICO：WINDOWS系統(tǒng)的圖標(biāo)文件格式，支持多通道透明，支持32位真彩色你可以用ICONWORKSHOP軟件，把PNG,GIF,JPG等格式的圖標(biāo)，轉(zhuǎn)換成ICO格式。

ICNS：Macintosh系統(tǒng)里獨(dú)特支持的格式，僅限于此系統(tǒng)。2023/1/15圖標(biāo)設(shè)計(jì)3）圖標(biāo)色彩：圖標(biāo)色彩和色深度關(guān)系比較密切，它關(guān)系到系統(tǒng)圖標(biāo)的外觀，如今的MacOSX以及WindowsXP都支持真彩色圖標(biāo)，但這并不意味著兩個(gè)系統(tǒng)的圖標(biāo)可以隨意使用顏色。對(duì)于MacOS而言，標(biāo)準(zhǔn)的256色調(diào)色板如圖所示，但在設(shè)計(jì)圖標(biāo)的時(shí)候并不是什么顏色都可以用的。2023/1/15圖標(biāo)設(shè)計(jì)一、關(guān)于圖標(biāo)：3）圖標(biāo)色彩：Macintosh圖標(biāo)調(diào)色板2023/1/15圖標(biāo)設(shè)計(jì)這樣做的原因有兩個(gè)方面：第一、選擇這樣一些柔和的色彩，避免桌面由于圖標(biāo)顏色過于鮮艷而導(dǎo)致的紛亂嘈雜的結(jié)果。第二、把顏色固定在幾十種，有利于圖標(biāo)外觀效果的一致性，形成統(tǒng)一整體的外觀。實(shí)際上，Windows系統(tǒng)圖標(biāo)的用色也是非常有限的。下圖所示的顏色是WindowsXP圖標(biāo)中使用的主要顏色：2023/1/15圖標(biāo)設(shè)計(jì)一、關(guān)于圖標(biāo)：3）圖標(biāo)色彩：WindowsXP圖標(biāo)調(diào)色板2023/1/15圖標(biāo)設(shè)計(jì)4）、圖標(biāo)家族：所謂圖標(biāo)家族，是指任何一個(gè)圖標(biāo)都不是單獨(dú)存在的，圖標(biāo)既然作為功能的一個(gè)代表，應(yīng)該在各種計(jì)算機(jī)環(huán)境下都能夠使用，為了在不同平臺(tái)下用戶都可以把這些圖標(biāo)認(rèn)同為同一功能的代表，就要求它們?cè)谛问缴媳容^近似。所以在實(shí)際的設(shè)計(jì)過程中，決不僅僅是在Photoshop這樣的軟件里改變圖標(biāo)尺寸和色深度。通常總是設(shè)計(jì)大圖標(biāo)，再以大圖標(biāo)為基礎(chǔ)，設(shè)計(jì)小圖標(biāo)。32pixel的圖標(biāo)改為16Pixel時(shí)，不是簡(jiǎn)單的縮小四分之一，縮小之后由于面積的變化，已經(jīng)無法絕對(duì)保持原貌，因此必須重新設(shè)計(jì)，使得看起來效果相近。2023/1/15圖標(biāo)設(shè)計(jì)5）、圖標(biāo)設(shè)計(jì)師：圖標(biāo)設(shè)計(jì)師，是從事圖標(biāo)設(shè)計(jì)這類人的總稱，不管是專業(yè)或者僅僅是愛好，他們統(tǒng)稱作為一個(gè)圖標(biāo)設(shè)計(jì)師，他對(duì)自己所從事的設(shè)計(jì)要有深刻的認(rèn)識(shí)：設(shè)計(jì)不再是為了好看，設(shè)計(jì)也不僅是獨(dú)創(chuàng)，圖標(biāo)設(shè)計(jì)絕不是我們以前圖形創(chuàng)意里面接觸的“新、奇、怪”的思路，圖標(biāo)設(shè)計(jì)和界面設(shè)計(jì)一樣，是為了設(shè)計(jì)對(duì)象能夠被用戶正確、簡(jiǎn)單、快捷地認(rèn)識(shí)！2023/1/15圖標(biāo)設(shè)計(jì)二、設(shè)計(jì)思路：圖標(biāo)設(shè)計(jì)是界面設(shè)計(jì)中非常生動(dòng)的部分，不少相關(guān)書籍和文章把太多的注意力投射到設(shè)計(jì)過程、設(shè)計(jì)手段而對(duì)其科學(xué)性的部分關(guān)注不夠。縱觀當(dāng)今的圖標(biāo)設(shè)計(jì)，有以下一些不足：1.最常見的是以美為導(dǎo)向，太多地關(guān)注在圖標(biāo)的外觀效果，很少關(guān)注為何選擇這個(gè)內(nèi)容以及怎樣選擇內(nèi)容；,2.其次就是以設(shè)計(jì)師為導(dǎo)向，圖標(biāo)內(nèi)容的選擇以設(shè)計(jì)師自己的喜好為標(biāo)準(zhǔn)，較少關(guān)注用戶的感受；3.再就是各自為政，屬于單干行為，同一系統(tǒng)的圖標(biāo)之間沒有任何關(guān)聯(lián)性和相似性，等等。2023/1/15圖標(biāo)設(shè)計(jì)圖標(biāo)設(shè)計(jì)的一些原則：1、識(shí)別性：圖標(biāo)不同于一般的圖形，它要求強(qiáng)烈的視覺識(shí)別，圖標(biāo)的出現(xiàn)和存在的價(jià)值都源于為了讓人們識(shí)別，所以圖標(biāo)設(shè)計(jì)中，形式美并不是關(guān)鍵的，能不能準(zhǔn)確被識(shí)別一定是設(shè)計(jì)師的第一目標(biāo)。所以好的圖標(biāo)要么是功能一目了然的，要么用戶能夠通過學(xué)習(xí)明白圖標(biāo)的意思，并且今后所有類似的工具都使用一樣的繪圖語(yǔ)言。2023/1/152023/1/152023/1/152023/1/15圖標(biāo)設(shè)計(jì)二、設(shè)計(jì)思路：圖標(biāo)設(shè)計(jì)的一些原則：1、識(shí)別性：2023/1/15圖標(biāo)設(shè)計(jì)二、設(shè)計(jì)思路：圖標(biāo)設(shè)計(jì)的一些原則：1、識(shí)別性：圖標(biāo)一旦變成范例，它就不可動(dòng)搖：有些軟件開發(fā)者可能會(huì)試圖改變?cè)O(shè)計(jì)，但幾乎要冒著令部分用戶無法理解的危險(xiǎn)。過分簡(jiǎn)潔的符號(hào)會(huì)導(dǎo)致無法理解。即使曾經(jīng)知道意思，時(shí)間一長(zhǎng)，就留不下多少印象，如果圖標(biāo)中沒有留下喚起記憶的要素，要想通過表面視覺形象去猜測(cè)圖標(biāo)意思就比較困難。有時(shí)干脆就是打消用戶的使用欲望。所以，我們?cè)谶x擇隱喻對(duì)象的時(shí)候一定要慎重，好識(shí)別的圖標(biāo)對(duì)用戶使用某個(gè)功能大有裨益，容易引起歧義的圖標(biāo)，即便有個(gè)好看的外象，甚至哪怕有一定的可比性，那也是差之毫厘，謬以千里！2023/1/15圖標(biāo)設(shè)計(jì)2、視覺風(fēng)格統(tǒng)一性原則：有關(guān)一致性的問題是界面設(shè)計(jì)中老生常談的一個(gè)問題。就圖標(biāo)設(shè)計(jì)而言一致性表現(xiàn)在三個(gè)方面：2023/1/15圖標(biāo)設(shè)計(jì)二、設(shè)計(jì)思路：圖標(biāo)設(shè)計(jì)的一些原則：2、一致性：1）、首先是同一圖標(biāo)家族，根據(jù)前面的介紹，同一圖標(biāo)要根據(jù)具體應(yīng)用環(huán)境，設(shè)計(jì)出不同尺寸以及色深度的圖標(biāo)家族成員，然而尺寸以及色深度的變化，使得保持圖標(biāo)外觀的一致。大圖標(biāo)和小圖標(biāo)看起來要相似，彩色圖標(biāo)和黑白圖標(biāo)也要感覺差不多，這樣用戶在不同顯示環(huán)境下，都可以正常使用軟件。具體來說，應(yīng)該從色深度高的大圖標(biāo)開始設(shè)計(jì)，再根據(jù)具體要求，弱化一些不重要的內(nèi)容，刪減一些無法保留的內(nèi)容，強(qiáng)化圖形中的一些結(jié)構(gòu)方面的因素，使得各種版本看起來差不多。

2023/1/15圖標(biāo)設(shè)計(jì)2）其次是同一系統(tǒng)的不同圖標(biāo)之間，也要在風(fēng)格上有一致性。MacOSX就是一個(gè)在設(shè)計(jì)上功夫精到的系統(tǒng)，它的圖標(biāo)之間非常相似，玻璃風(fēng)格的圖標(biāo)都采用同樣的造型手段，色彩上也都比較關(guān)聯(lián)（圖5－18），而后推出的都采用皮毛的外觀，視覺語(yǔ)言呼應(yīng)的非常好。

2023/1/15圖標(biāo)設(shè)計(jì)MacOSX玻璃風(fēng)格圖標(biāo)2023/1/15圖標(biāo)設(shè)計(jì)豹皮風(fēng)格圖標(biāo)2023/1/15圖標(biāo)設(shè)計(jì)3）、再次是應(yīng)用程序和操作系統(tǒng)的圖標(biāo)之間也要盡可能一致。每一次操作系統(tǒng)的更新也是應(yīng)用軟件更新的時(shí)候，軟件開發(fā)商不僅在功能上進(jìn)行升級(jí)，就是在圖形界面的風(fēng)格上也是不遺余力地追求和操作系統(tǒng)的一致性圣哲樣做的目的也是力求用戶能夠在完美和諧的環(huán)境下工作。下面的例子就是一些著名軟件在MacOSX環(huán)境下力求與操作系統(tǒng)一致性的一些例證。2023/1/15如果一套圖標(biāo)的視覺設(shè)計(jì)非常協(xié)調(diào)統(tǒng)一，我們就說這套圖標(biāo)具有自己的風(fēng)格，這樣的圖標(biāo)看上去也會(huì)更美麗，更專業(yè)，同時(shí)也會(huì)增強(qiáng)用戶的滿意度。

我們經(jīng)常會(huì)看到很多界面上，往往會(huì)堆砌著各種不同風(fēng)格的圖標(biāo)，顯然，這些圖標(biāo)都是從互聯(lián)網(wǎng)上收集起來，由于沒有完全配套的圖標(biāo)，只能東拼西湊，導(dǎo)致界面粗制濫造，業(yè)余。統(tǒng)一風(fēng)格為什么這么重要，理解這一點(diǎn)，你會(huì)明白互聯(lián)網(wǎng)上有數(shù)百萬的圖標(biāo)資源，為什么你的老板還要花錢雇一個(gè)圖標(biāo)設(shè)計(jì)師。圖標(biāo)設(shè)計(jì)2023/1/15一套好的圖標(biāo)，要有統(tǒng)一的風(fēng)格，這條原則，很多設(shè)計(jì)師都明白，但是真正實(shí)現(xiàn)起來，也許并不那么容易。怎么做呢？

第一步：我建議你在設(shè)計(jì)之前，先做如下的定義：是簡(jiǎn)約的，還是精致的？是平面的，還是立體的？

是古典的，還是現(xiàn)代的？

是寫實(shí)的，還是卡通的？

是單色的，還是多彩的？

是絢麗的，還是柔和的？

是抽象的，還是具體的？

是有框的，還是無框的？也許我的定義并不能囊括所有的風(fēng)格，但是至少可以給你提供一種思路圖標(biāo)設(shè)計(jì)2023/1/15第二步：如果可能的話，我建議你用鉛筆，在白紙上勾勒出你的草圖，用什么符號(hào)圖形代表什么操作，在畫的時(shí)候，盡可能的想象第一步的風(fēng)格定義。第三步：統(tǒng)一你的色彩，準(zhǔn)備好你的調(diào)色板。2023/1/15我會(huì)從調(diào)色板面板里調(diào)出一種風(fēng)格的色彩，略加調(diào)整，這將是我這套圖標(biāo)的色彩定義，在畫圖標(biāo)的時(shí)候，盡可能選擇你定義好的顏色，這樣，你就能盡可能的保證你的圖標(biāo)色彩的統(tǒng)一。2023/1/152023/1/15在這里，工具是不重要的，無論你是使用PHOTOSHOP，ILLUSTRATOR，F(xiàn)IREWORKS，F(xiàn)LASH，F(xiàn)REEHAND，還是其他。定義好了風(fēng)格，草圖，調(diào)色板，就開始充分發(fā)揮你的想象吧。2023/1/152023/1/152023/1/152023/1/152023/1/15與環(huán)境的協(xié)調(diào)性圖標(biāo)是沒有單獨(dú)存在的，圖標(biāo)最終是要放置在界面上才會(huì)起作用的。因此，圖標(biāo)的設(shè)計(jì)，要考慮圖標(biāo)所處的環(huán)境，這樣的圖標(biāo)，是否適合這樣的界面？比如你的界面是森林和大地，你就可以考慮用石塊，木頭，或者蘑菇，野花設(shè)計(jì)一系列的圖標(biāo)。2023/1/15如果你的界面是平面的，簡(jiǎn)約的，你可以考慮用一些簡(jiǎn)單的平面的符號(hào)或者圖形來設(shè)計(jì)你的圖標(biāo)，這樣整個(gè)界面會(huì)很協(xié)調(diào)，不要認(rèn)為這樣的圖標(biāo)是簡(jiǎn)陋的，其實(shí)這樣的圖標(biāo)的可識(shí)別性非常強(qiáng)的，在簡(jiǎn)潔的界面里，會(huì)透露出一種簡(jiǎn)約之美。2023/1/15下圖是我對(duì)UI設(shè)計(jì)四個(gè)階段“用戶研究，交互設(shè)計(jì)，視覺設(shè)計(jì)，可用性測(cè)試”的圖標(biāo)定義2023/1/15體育運(yùn)動(dòng)類圖標(biāo)的設(shè)計(jì)2023/1/15視覺效果追求視覺效果，一定是要在保證差異性，可識(shí)別性，統(tǒng)一性，協(xié)調(diào)性原則的基礎(chǔ)上，要先滿足基本的功能需求，才可以考慮更高層次的要求--情感需求。圖標(biāo)設(shè)計(jì)的視覺效果，很大程度上取決于設(shè)計(jì)師的天賦、美感和藝術(shù)修養(yǎng)，有些設(shè)計(jì)師做了很多年的設(shè)計(jì)，作品一堆，拿出來一看，粗糙，刺眼，土氣。2023/1/15我提供一套迅速提高技能方法，最原始，但也最管用：那就是多看，多模仿，多創(chuàng)作。當(dāng)然還少了一個(gè)前提，那就是設(shè)計(jì)師的天賦。勤奮+天賦=成功2023/1/15原創(chuàng)性

這一條對(duì)圖標(biāo)設(shè)計(jì)師提出了更高的要求，這是一個(gè)挑戰(zhàn)，但我認(rèn)為，圖標(biāo)設(shè)計(jì)的原創(chuàng)性并不是必要的，因?yàn)槟壳俺Ｓ玫膱D標(biāo)風(fēng)格種類已經(jīng)很多，易用性較高的風(fēng)格也就那么多種，過度追求圖標(biāo)的原創(chuàng)性和藝術(shù)效果，會(huì)導(dǎo)致圖標(biāo)設(shè)計(jì)另辟蹊徑，這樣做往往會(huì)降低圖標(biāo)的易用性降低，也就是說所謂的好看不實(shí)用。當(dāng)然，這里也要看你的產(chǎn)品的側(cè)重點(diǎn)，如果考慮更多的是情感化的設(shè)計(jì)，完美的藝術(shù)效果，這樣做也無可厚非。2023/1/15“中國(guó)風(fēng)圖標(biāo)”我們可以說它具有原創(chuàng)性，它很美，但是這樣的圖標(biāo)做不到望圖知意，實(shí)際上失去了易用性，所以說，原創(chuàng)性與易用性，很多時(shí)候是一把雙刃劍，看你的選擇了2023/1/15上面的圖標(biāo)設(shè)計(jì)，相信很多設(shè)計(jì)師都看過，簡(jiǎn)直就是完美的藝術(shù)品，我驚嘆于它的藝術(shù)效果和原創(chuàng)性。從藝術(shù)性上它可以拿到10分，從可用性上，它可能是0分，因?yàn)閳D標(biāo)是拿來用的，我實(shí)在不知道它表達(dá)的是什么意思。永遠(yuǎn)記住這一條，圖標(biāo)的價(jià)值在于它比文字更直觀，失去了這一條，就是去了它的意義。2023/1/15差異性原則什么意思呢？意思是如果一個(gè)界面上有六個(gè)圖標(biāo)，我一眼看上去，要能第一時(shí)間感覺到他們之間的差異性，否則我怎么辨認(rèn)呢？這是圖標(biāo)設(shè)計(jì)中很重要的一條原則，但也是在設(shè)計(jì)中最容易被忽略的一條，圖標(biāo)和文字相比,它的優(yōu)越性在于它更直觀一些，但是如果圖標(biāo)設(shè)計(jì)失去了這一點(diǎn)，我認(rèn)為圖標(biāo)設(shè)計(jì)就失去了意義。我們看一些現(xiàn)實(shí)中的例子:2023/1/15這是我平時(shí)用的一套軟件：用友致遠(yuǎn)辦公管理系統(tǒng)，我只能說從差異性和可識(shí)別性來講，這里的圖標(biāo)設(shè)計(jì)非常失敗。“新建事項(xiàng)”“待發(fā)事項(xiàng)”“已發(fā)事項(xiàng)”“待辦/已辦”“超期督辦”“流程管理”這六個(gè)圖標(biāo)一眼望上去，幾乎是一樣的，其中五個(gè)圖標(biāo)采用了相同的元素“淡藍(lán)色文檔”，這里圖標(biāo)的設(shè)計(jì)，已經(jīng)失去了存在的價(jià)值，因?yàn)閳D標(biāo)設(shè)計(jì)的目標(biāo)是提高效率，用戶一眼望上去他們都一樣，如果不看文字，用戶真的很難區(qū)分它們，這實(shí)際上是降低了工作效率。2023/1/15這套圖標(biāo)很漂亮，但是從差異性上來講，這套圖標(biāo)也是失敗的，黃色的文件夾部分的六個(gè)圖標(biāo)，一眼望去幾乎又是一樣的，差異極小，在具體應(yīng)用過程中會(huì)很吃力，用戶需要仔細(xì)觀察才能區(qū)分出他們的差別。2023/1/15如果各個(gè)圖標(biāo)需要使用相同的元素，那么我們要盡量放大他們之間的差異性，減弱他們之間的相似性。如果一套軟件的六個(gè)圖標(biāo)有同一元素，為了強(qiáng)調(diào)他們之間的差異性，我甚至建議考慮放棄使用同一元素。比如圖（4）的“新建事項(xiàng)”“待發(fā)事項(xiàng)”“已發(fā)事項(xiàng)”，在這里我們需要強(qiáng)調(diào)的是“新建”“待辦””已發(fā)”而不是”事項(xiàng)。因此，代表事項(xiàng)的相同元素”文檔”可以拋棄。2023/1/15我們看下圖AdobePhotoshop的圖標(biāo)，精致，專業(yè)，圖標(biāo)設(shè)計(jì)的典范。我們看它完全符合差異性的原則，每個(gè)圖標(biāo)一眼望上去，都不一樣，并且能夠代表所需要的操作，可謂望圖知意。2023/1/15合適的精細(xì)度，元素個(gè)數(shù)首先我們要明確一個(gè)點(diǎn)，圖標(biāo)的主要作用是用的，代替文字，第二才是美觀。但現(xiàn)在的圖標(biāo)設(shè)計(jì)者往往陷入了一個(gè)誤區(qū)，片面的追求精細(xì)。其實(shí)，圖標(biāo)的可用性隨著精細(xì)度的變化，是一個(gè)類似于波峰的曲線。在初始階段，圖標(biāo)可用性會(huì)隨著精細(xì)度的變化而上升，但是達(dá)到一定精細(xì)度以后，圖標(biāo)的可用性往往會(huì)隨著圖標(biāo)的精細(xì)度而下降。變化曲線如下圖：2023/1/152023/1/15下圖是一個(gè)表示“設(shè)置”的齒輪圖標(biāo)，我們看到，最左邊的最簡(jiǎn)單的和最右邊的照片級(jí)的，可用性都是非常低的，都不適合做圖標(biāo)。2023/1/15Vista是微軟的比較失敗的一個(gè)產(chǎn)品，原因很多，但主要的原因之一是被人稱之為華而不實(shí)。我們看一下Vista的圖標(biāo)設(shè)計(jì)，見圖（10），很漂亮，很精細(xì)，但是很顯然，圖標(biāo)包含的元素過多了，不夠直觀，