翻看一下近些年來用戶界面的視覺設(shè)計(jì)你一定會發(fā)現(xiàn)“寫實(shí)風(fēng)格”正逐步變成主流。我們所使用的電腦越來越強(qiáng)勁，速度越來越快，設(shè)計(jì)師們也有了更多的發(fā)揮空間。為了增加細(xì)節(jié)，我們已經(jīng)可以使用3D效果、陰影、透明甚至一些物理特性來修飾界面。這其中有些效果能顯著改善可用性，比如陰影能夠更好地幫助用戶區(qū)別激活與非激活狀態(tài)的窗口、iPhone系統(tǒng)中的豐富但有效的動畫效果也能極大減少用戶的學(xué)習(xí)成本。
但在其他方面，這些新技術(shù)對可用性卻未必作出了多少貢獻(xiàn)。圖形用戶界面基本上就是一堆符號，大部分按鈕、圖標(biāo)以及其他控件只是指代了某些概念或某個想法，比如齒輪圖標(biāo)并不意味著一個齒輪，他只是告訴你點(diǎn)擊之后可以進(jìn)行軟件的設(shè)置。越多的細(xì)節(jié)和越高的寫實(shí)性會讓用戶的關(guān)注焦點(diǎn)脫離這些概念。
在此推薦大家讀一下Scott McCloud的 《Understanding Comics 》，和GUI無關(guān)，但是每個設(shè)計(jì)師讀過之后肯定都有受益  :D

最左邊的圖顯然是個特定的男士，而右邊那個笑臉形象幾乎能指代任何一個人。從這個例子看得出來，如果為了表達(dá)一個概念而使用隱喻，那視覺上的細(xì)節(jié)就必須減少。而事實(shí)上實(shí)際場合中我們所使用的界面控件一般不會去指代一個特定的東西。

當(dāng)然，細(xì)節(jié)也不能太少，保證必要的識別性肯定是前提，至少要讓用戶看得出這是什么東西：

左邊這個是人臉，右邊這個你就很難分清楚是蛋還是球了。
接下來我們再來看看電腦上的實(shí)際例子，一個代表“主頁”的圖標(biāo)：

從左到右，我們看到從一間特定的房子到廣義上的Home概念的變化，細(xì)節(jié)越多，越難搞清楚其指代的概念

同樣的，細(xì)節(jié)也不能過少，去掉窗子和煙囪之后這個Home圖標(biāo)就變得像一個 按鍵了。
讓我們用一個并不太科學(xué)的圖表來說明問題：

圖表上的數(shù)值并不是來自實(shí)際測試中的數(shù)據(jù)，我只是想說明優(yōu)秀的GUI設(shè)計(jì)應(yīng)該出現(xiàn)在曲線的中間部分，視覺上只需要保證足夠而不花哨的細(xì)節(jié)就可以了。
那什么樣的細(xì)節(jié)是恰當(dāng)?shù)?，什么樣的?xì)節(jié)是會讓用戶分心的呢？

左邊這個按鈕太過寫實(shí)，不適合放到界面當(dāng)中，而右邊的只有一個邊框，也很難激起用戶的點(diǎn)擊欲望。

對于這個開關(guān)來說也是一樣，過度的細(xì)節(jié)讓左邊這個按鈕看起來就是一張照片而很難認(rèn)為是界面的一部分。
合理地運(yùn)用陰影、漸變等細(xì)節(jié)，讓用戶既能分辨得出這個元素又能不分心于圖形上的效果能夠幫助我們打造美觀而可識別的界面。

例外情況
當(dāng)然也有一個領(lǐng)域是特別的，那就是程序圖標(biāo)，只用來指代你的程序。

Coda的樹葉圖標(biāo)不是指代樹葉，而是用豐富的細(xì)節(jié)、形狀和顏色特征讓用戶一眼就看出這是Coda的葉子。而Acorn這個圖形編輯軟件也正如他的名字所表現(xiàn)的，使用了一個橡果來作為程序圖標(biāo)。在這種場合，我們需要表現(xiàn)的只是一個特定程序而不是廣義的概念，最終目的就是把圖標(biāo)和軟件的品牌、價(jià)值直接聯(lián)系起來，讓用戶一看就知道。所以程序圖標(biāo)可供設(shè)計(jì)師發(fā)揮的空間就很大了。
結(jié)論
就像開頭所說，圖形用戶界面就是一堆符號，而符號的精髓就是簡潔。讓用戶快速準(zhǔn)確地讀懂符號以及其背后的含義是我們每個GUI設(shè)計(jì)師的重要責(zé)任，過多華而不實(shí)的寫實(shí)性只能在可用性上帶來明顯的問題。
在設(shè)計(jì)中增加細(xì)節(jié)的目的不是讓界面和圖標(biāo)看起來像照片那樣真實(shí)，而是提高識別性，幫助用戶更好地和各種控件進(jìn)行交互操作
在此特別感謝Max Steenbergen 和Cameron Kenley Hunt ，第二個Home圖標(biāo)來自Dellustrations的圖標(biāo)集Dellipack
想看原文，請猛擊這里