Material Design：重新關注設計

今年的Google I/O大會開始之前，網上就放出了許多小道消息謠傳這次Google將推出一套全新的設計語言來統一所有的設備。Android原有的開源設計風格在如今的那些第三方商家手里已經支離破碎，絲毫看不出這套設計規則能讓人肅然起敬。這就給今年Google I/O 積攢的神秘披上了許多令人期待的面紗，

帶著好奇心，我頭一次完整地看完了長達兩個半小時的Keynote。網上大家一直猜測Google會如何命名這個即將在未來統一所有軟硬件設計風格的產品，就像Apple如何發揮 iOS 7的Flat Design一樣。

以前Android給我的印象是：界面的icon不嚴謹甚至有些松散，交互界面之間雜亂無章，不像iOS那么有秩序，機器與人的互動之間有著一些難以融合的隔膜 ……當負責Android用戶體驗設計的大主管Matias Duarte站在舊金山莫斯康展覽中心大講臺，放出Google新一代設計語言—Material Design演示視頻時，之前Android帶給我所有負面設計的印象讓我一下拋到腦后。Material 的中文直譯過來就是 “材料 ”，官方給出的解釋是取自現實生活中的“紙墨”也就是看得見摸得著的實體。

Google在大眾印象中，一向以高度發達的人工智能和接受數以萬計的龐大數據能力著稱，而在 “設計”這個帶有非理性以及更多靠直覺又有點文藝的味道上，顯然和Google的理性工程思維的關系相去甚遠。當這次Duarte宣布Material Design將作為Google Design的風格，并貫徹到所有Google產品設備中時，這意味著Google在人們的印象中，不僅僅再只是一家工程的數據型的公司。

向紙墨學習什么

在Material Design Guidelines里，官方給出的如何體現紙墨的含義，是從物理空間的動效來闡釋，如：界面的視覺光效、空間的表面質感和交互的動畫運動感等三個規律來表現。在交互界面上要圍繞這三點的原則來設計一套新語言，這就必須重新思考整個底層架構，而Google借鑒了傳統的平面印刷設計。

提到“平面”眾所周知，這個詞已經存在了上百年歷史，它的實用性生活中隨處可見，如：路邊的公交牌、機場大廳的指引路標、品牌的包裝盒……它的作用與辨識度在日常中不言而喻，正是出于這種普遍性，如今各大商家都開始從這里面尋求差異化的設計突破，如：Windows Modern和接近這套理念的iOS 7 。

回顧過去這三大陣營的設計理念，各個風格迥異：Holo永遠會在原有的icon上疊加幾何圖形的立體視效、Modern徹底引入平面識別系統將屏幕的每處像素都貢獻給內容、iOS 7之前則以Skeuomorphism模仿真實的事物實現人機界面交互的簡易性。當傳統平面的概念沒被微軟先入為主足夠引起行業震動、App Store的概念剛出來時，“用戶體驗”在2009年那段時間還是一個很新鮮的詞，產品的文化與感情表達還不像今天這么泛濫。這就會帶來一個疑問：從什么時候起大家開始關注設計、開始用技術之外的“感情”因素來做產品？

2007年iPhone的發布之后誕生出App Store的概念，手機也可以像PC一樣使用。這促使第三方開發者可以不用再受限于Windows和渠道運營商，直接將寫好的軟件放在App Store這樣類似的移動平臺里自由交易，當軟件的數量倍增使用的人嘗到甜頭，平臺的力量隨著用戶與開發者的利益相互滿足，其影響力也隨之越強，優秀的軟件并隨即而生，這就形成三者共贏。

截止到今年Apple付給開發者的支票達百億以上的規模，這就引來許多開發者愿意在移動平臺里花精力去設計一款優秀軟件，然后專門給這些呈規模效應的平臺設計App并可養活一個事業，而作為產品的另一個不可或缺的重要角色—設計師，并可以得到發揮。當所有這些平臺、用戶、開發者形成一個良性循環發展時，大家的精力可以聚焦在產品上，而打造產品除了用工程的邏輯思維編寫出每個功能步驟外，產品的美觀、文化、可操作性就需要用優秀的設計體驗來完成。

當Apple掌控軟硬件取得空前的成功后，設計不只是再表現于皮膚表面之外，而應在里面融入通常大家所熟知的：文學、歷史、音樂和藝術等等人文的主觀性感受，這些非理性的感情因素，致使大家開始關注產品的人文精神。

迫于競爭的壓力，這就是為什么微軟在2010年將Windows Phone從瑞士平面里獲取設計Modern的靈感引用到Windows 8的原因之一，后來Apple也將自己一手培養起來的Skeuomorphism由Jony Ive領導改頭換面，以至于今天Google也要開始從傳統的紙墨文化概念里面尋找出路。

Google是如何將傳統“紙墨”的定義和產品聯系在一起？從Material Design Guidelines里面可以看到，下拉菜單和主界面的組成通常是一張張排列整齊的卡片來銜接，卡片承載的信息量貫穿始終。卡片式的設計由來已久，在Web、移動客戶端我們隨處可以看到它的身影，而唯獨Google由這種風格貫穿徹底，因為卡片不像網頁沒有邊緣界線可以無限延伸，它的特征跟我們用到的便條、普通紙張一樣有實際的邊界數量，像紙一樣可以折疊、收放自如。

卡片、紙，這兩者相同的特征可以將它們聯系起來，它們的簡潔、易用性不容置疑。所以，卡片與紙的聯系可以看作Google從傳統紙墨里學習材質的典型。

平面、卡片、抽象

平面——在人的潛意識中就是將所有看到的立體的三維影像轉換成一個面，這個面里沒有它受外界反射出來的強光和陰影，一切受自然規律所帶來的透視將不復存在。在這樣一個由四個基點所組成的空間里，人眼所觀察到的永遠只有一個角度，而在這個空間里的所有物體也只有一個面，所以當我們在這個空間里面做任何判斷時，你所反應的圖形就必須最能代表它本身的特征。

Google通過平面識別系統里的點、線、面三者間的聯系來塑造Material Design，它跟Windows Modern不同的是， Google終始保持界面的交互流程秩序，左右有規則的對齊留白、上下的比例對稱以及用懸浮在界面分割上下左右關系的圓形操作按鈕。Google的這套用“線” 區分界面區域、用“點”控制功能的流程、用“面”滑動界面的切換等有序的設計來顯現Material。當這種整齊的排版讓人一目了然時，并形成了Google自有的風格——卡片。

卡片的形成對于Material Design的重要性顯而易見，更可以說是這套風格的逐漸成形才有了Google對統一設計的野心，這就不免讓人聯想到去年Google Maps的改版，原先左側的狀態欄連同頁眉的搜索欄一同被重新設計在一個搜索框里，并將它的位置放置在頁面左上角，所有的地圖功能信息都隱藏在這個搜索欄里，然后以卡片的交互方式呈現所有的信息。Google Maps的這次改版可以看出Google早已為這套新語言 Material Design鋪路。

如果用卡片來代表Google Design，那么平面和抽象分別對應微軟的Modern和 Apple的iOS，Google的卡片既不像微軟將所有帶邊框的分界線從屏幕里徹底拿掉，把每一寸像素騰給內容，也不像Apple在拿掉紋理和光影的基礎上添加時尚動感的漸變和抽象符號，Google更想用親和力的卡片式風格樹立Material Design的統一跨平臺之路。