GUI的歷史一直都離不開隱喻，而這種設計手段的優(yōu)劣已經有越來越多的辯論。那么時至今日，這種設計方法是否已經過時？我們是否有更好的方式？ 傳統(tǒng)與新風格將怎樣影響著我們？ 這些疑惑不禁引發(fā)了筆者的思考，因此也就有了下文。

一、隱喻

隱喻作為一個主流的設計方式廣泛運用在界面設計中，它的歷史可以追溯到GUI的創(chuàng)造，經典的例子便是桌面、文件夾、垃圾桶… 這些老生常談概念。因為源于真實生活，隱喻的天然優(yōu)勢便是利用熟悉感幫助用戶理解上手，并帶來親切感。雖然常被簡單認為是模擬現(xiàn)實世界中的物體外觀（即擬物），隱喻其實是一個綜合的手段：包括視覺層面的擬物；行為的模擬（常利用動畫效果加強）；以及對整體概念的利用。

（一）先說擬物。

眾所周知，蘋果已經將其演繹地爐火純青。先不說mac os x上各種材質和復雜光影的寫實圖標，曾在知乎上看到一個例子：在ios6上滑竿的金屬圓形按鈕不僅模仿了金屬紋理，傾斜手機時還會像真的金屬一樣改變光澤的角度（見圖1）。蘋果的擬物已經達到了對細節(jié)的精確追求，暫且不論這種極致求真的細節(jié)對體驗的提升到底有多大意義，但它符合蘋果所追求的品牌視覺風格。在一個追求真實的原則下，那么任何對真實細節(jié)的提升都是值得欽佩贊許的。Devil’s in the detail.

圖1：圖片來自iphone5截圖

（二）再說行為隱喻。

行為的隱喻同樣來自真實世界，但不像擬物那樣顯而易見，它伴隨著操作發(fā)生，自然而然。如下圖滾動條的例子（見圖2），當網站內容的篇幅達到一定的程度，在閱讀時往下翻滾時滾動條會旁邊會出現(xiàn)剩余篇幅的氣泡提示。對比于告知還剩下多少字，預估還剩下多少閱讀時間就非常符合生活習慣了。類似的還有kindle底部的閱讀提示。

圖2：來自iA（http://informationarchitects.net/about/）

相較與蘋果的Skeuomorphs（ 在這里將其譯作擬物／擬真，有興趣可自行移步wiki），Metro設計原則堅持極簡、內容優(yōu)先，強調排版、動態(tài)和真實的數(shù)字場景，與之產生的設計語言延伸到視覺風格便是不再利用Skeuomorphs，取而代之的是高度抽象的視覺符號和一再強調的信息，這無疑是一個顯眼的革新（當然Metro的革新遠不止于表面）。那么真實的數(shù)字場景是否與隱喻不再關聯(lián)？回想一下win8的邊緣交互支持上下左右滑動手勢，在真實世界中人們在一個工作臺上就可以完成多項工作，所需要的東西順手頡來而并非只能在臥室看書或只能在書房寫信。由此可見如果要完全脫離真實世界去構建一個全新的世界觀并不現(xiàn)實，事實上，數(shù)字時代的隱喻更為深入和抽象了，體現(xiàn)在行為、邏輯，甚至世界觀，所以才有真實這個前綴。當然深入到一定程度把它們稱之為隱喻并非那么合適了，但的確曾是以隱喻為起點的。

二、信息之外

Metro一再強調信息，它們才是用戶關注的內容。因此界面中省去了一些控件代替以手勢響應，而不能省略的也采用抽象符號。與此相反，傳統(tǒng)的系統(tǒng)和應用常會有一個容器包裹在信息之外，鑲嵌其間的控件圖標在視覺上做了不同程度的刻畫。于是在新舊觀念的沖擊下，信息之外的部分便開始曖昧不清了。有人尖銳指出，這些信息以外的裝飾虛偽幼稚（詳見James Higgs的 Apple's aesthetic dichotomy）。聽到裝飾，不少人開始要冒汗了。經歷了現(xiàn)代主義的洗禮，如今裝飾一詞變得低三下四。但是阿道夫·路斯（Adolf Loos）的“裝飾即罪惡”也是有其上下文情境的，何況裝飾在視知覺審美體驗中的地位無法忽視。回歸之前所提，關于內容本身如何界定還是一個問題。 Metro認為信息才是內容，其沉浸式是沉浸在信息的海洋中。而在傳統(tǒng)的界面我們可以認為那些承載信息的容器環(huán)境也是內容的一部分；因此，ios的沉浸感強調的是整體氛圍的融合。這樣看來，信息之外的內容并非純裝飾。不過隨之帶來的問題主要有兩個：效率與風格。

關于效率。純信息的展示更為高效，幫助人們在繁忙的生活和海量的信息中更快得達成目的，是工具化的。而對于環(huán)境的渲染更適合調動情緒或者傳達某種生活的態(tài)度，例如游戲界面。而在更多的實際運用中，設計上常會有各種折衷。

至于風格（style）。則屬于審美的范疇而并非道德，審美涉及到品位，因人而異，并且總是與時代和歷史相關。打個不甚恰當?shù)谋确�，如果將GUI產生之前比作原始時代，那么擬物和Skeuomorphs更像是古典時期，也難怪有人說metro是交互設計的包豪斯運動（http://www.ifanr.com/38596）。不過歷史總是螺旋前進而非簡單直線，就算“大勢已去”也總會存在各種回潮�；叵胛覀儸F(xiàn)在所處的語境，也許各取所長會是比較好的選擇。

三、微質感

提出微質感的概念便是這種在效率和風格之間的權衡。所謂的微質感是區(qū)別于Skeuomorphs的超質感和 Metro高度抽象化之間的中間層次。微可以理解為微弱／微小，微乎其微。微本身是一種可選的程度而非定量，但這個程度并不寬廣，否則就失去了個性和品牌意義。

（一）克制

微意味著盡可能少的添加便達到目的，質感具有隱喻的意味。也就是說靈活得運用一點隱喻的手段解決問題，而不泛濫；有點類似深澤直人的“這樣就好”。對比圖3、圖4和圖5，（圖3）超質感的圖像更像一件藝術作品，它屬于圖像信息的范疇而不那么適合當作圖標或控件。（圖4）Pixelmator的功能圖標做了相當程度的精簡，但是還是保留并強化了來自真實世界的光影材質，它們看上去閃亮簇新。（圖5）谷歌chrome的系列應用圖標則非常收斂，利用必要的符號傳達含義，點到為止，唯一一處額外的添加的那塊陰影，起到畫龍點睛的作用。

圖3：圖片來自dribbble                    圖4：圖片來自pixelmator官網

圖5：圖片來自chrome網上應用商店 

為了論證這種“去之則嫌少，添之又嫌多”的狀態(tài)，下圖以谷歌地圖圖標為例做了兩個有趣的對比（見圖6、圖7）。圖6的變化是去除了地圖細節(jié)，雖然地標還是能夠清晰辨識，但這種減法使得地圖變得有些匪夷所思。因為擴散了它的指涉范圍，使其看上去像一個奇怪的方塊，還不如去掉它更好些。圖7的變化是去除了投影，這并不影響其傳達含義，但是這樣的圖像比具備陰影的狀態(tài)缺少“張力”。從格式塔視知覺理論來看，無投影的圖標雖然更符合一個好的完形（更加對稱），但是卻不能引起“力的緊張”。因為接近完形卻又有一些破壞的圖形暗示著好的形，從而能引發(fā)人們去糾正其不完美的形式而達到完美的狀態(tài)。這種緊張的過程意味著更多的審美趣味，當然也取決于受眾的審美層次。

圖6：左邊為原設計；右邊去除了地圖細節(jié)

圖7：左邊為原設計；右邊去除了投影

由此可見，微質感具備的這種克制的效率，充滿了節(jié)儉的品德。因為克制要求對細節(jié)反復斟酌，換言之，當細節(jié)減少到個位數(shù)時，那么就有充分的時間思考地更全面。從宏觀上看，微質感的精簡也是一種勞動力的解放，節(jié)約的時間和精力可以去創(chuàng)作信息本身。

標簽： 頁面設計 產品設計 頁面設計方式 

版權申明：本站文章部分自網絡，如有侵權，請聯(lián)系：west999com@outlook.com
特別注意：本站所有轉載文章言論不代表本站觀點！
本站所提供的圖片等素材，版權歸原作者所有，如需使用，請與原作者聯(lián)系。