今年的Google I/O大會(huì)開(kāi)始之前，網(wǎng)上就放出了許多小道消息謠傳這次Google將推出一套全新的設(shè)計(jì)語(yǔ)言來(lái)統(tǒng)一所有的設(shè)備。Android原有的開(kāi)源設(shè)計(jì)風(fēng)格在如今的那些第三方商家手里已經(jīng)支離破碎，絲毫看不出這套設(shè)計(jì)規(guī)則能讓人肅然起敬。這就給今年Google I/O 積攢的神秘披上了許多令人期待的面紗。
帶著好奇心，我頭一次完整地看完了長(zhǎng)達(dá)兩個(gè)半小時(shí)的Keynote。網(wǎng)上大家一直猜測(cè)Google會(huì)如何命名這個(gè)即將在未來(lái)統(tǒng)一所有軟硬件設(shè)計(jì)風(fēng)格的產(chǎn)品，就像Apple如何發(fā)揮 iOS 7的Flat Design一樣。
以前Android給我的印象是：界面的icon不嚴(yán)謹(jǐn)甚至有些松散，交互界面之間雜亂無(wú)章，不像iOS那么有秩序，機(jī)器與人的互動(dòng)之間有著一些難以融合的隔膜 ……當(dāng)負(fù)責(zé)Android用戶體驗(yàn)設(shè)計(jì)的大主管Matias Duarte站在舊金山莫斯康展覽中心大講臺(tái)，放出Google新一代設(shè)計(jì)語(yǔ)言—Material Design演示視頻時(shí)，之前Android帶給我所有負(fù)面設(shè)計(jì)的印象讓我一下拋到腦后。Material 的中文直譯過(guò)來(lái)就是 “材料 ”，官方給出的解釋是取自現(xiàn)實(shí)生活中的“紙墨”也就是看得見(jiàn)摸得著的實(shí)體。
Google在大眾印象中，一向以高度發(fā)達(dá)的人工智能和接受數(shù)以萬(wàn)計(jì)的龐大數(shù)據(jù)能力著稱，而在 “設(shè)計(jì)”這個(gè)帶有非理性以及更多靠直覺(jué)又有點(diǎn)文藝的味道上，顯然和Google的理性工程思維的關(guān)系相去甚遠(yuǎn)。當(dāng)這次Duarte宣布Material Design將作為Google Design的風(fēng)格，并貫徹到所有Google產(chǎn)品設(shè)備中時(shí)，這意味著Google在人們的印象中，不僅僅再只是一家工程的數(shù)據(jù)型的公司。
向紙墨學(xué)習(xí)什么 在Material Design Guidelines里，官方給出的如何體現(xiàn)紙墨的含義，是從物理空間的動(dòng)效來(lái)闡釋，如：界面的視覺(jué)光效、空間的表面質(zhì)感和交互的動(dòng)畫(huà)運(yùn)動(dòng)感等三個(gè)規(guī)律來(lái)表現(xiàn)。在交互界面上要圍繞這三點(diǎn)的原則來(lái)設(shè)計(jì)一套新語(yǔ)言，這就必須重新思考整個(gè)底層架構(gòu)，而Google借鑒了傳統(tǒng)的平面印刷設(shè)計(jì)。
提到“平面”眾所周知，這個(gè)詞已經(jīng)存在了上百年歷史，它的實(shí)用性生活中隨處可見(jiàn)，如：路邊的公交牌、機(jī)場(chǎng)大廳的指引路標(biāo)、品牌的包裝盒……它的作用與辨識(shí)度在日常中不言而喻，正是出于這種普遍性，如今各大商家都開(kāi)始從這里面尋求差異化的設(shè)計(jì)突破，如：Windows Modern和接近這套理念的iOS 7 。
回顧過(guò)去這三大陣營(yíng)的設(shè)計(jì)理念，各個(gè)風(fēng)格迥異：Holo永遠(yuǎn)會(huì)在原有的icon上疊加幾何圖形的立體視效、Modern徹底引入平面識(shí)別系統(tǒng)將屏幕的每處像素都貢獻(xiàn)給內(nèi)容、iOS 7之前則以Skeuomorphism模仿真實(shí)的事物實(shí)現(xiàn)人機(jī)界面交互的簡(jiǎn)易性。當(dāng)傳統(tǒng)平面的概念沒(méi)被微軟先入為主足夠引起行業(yè)震動(dòng)、App Store的概念剛出來(lái)時(shí)，“用戶體驗(yàn)”在2009年那段時(shí)間還是一個(gè)很新鮮的詞，產(chǎn)品的文化與感情表達(dá)還不像今天這么泛濫。這就會(huì)帶來(lái)一個(gè)疑問(wèn)：從什么時(shí)候起大家開(kāi)始關(guān)注設(shè)計(jì)、開(kāi)始用技術(shù)之外的“感情”因素來(lái)做產(chǎn)品？
2007年iPhone的發(fā)布之后誕生出App Store的概念，手機(jī)也可以像PC一樣使用。這促使第三方開(kāi)發(fā)者可以不用再受限于Windows和渠道運(yùn)營(yíng)商，直接將寫(xiě)好的軟件放在App Store這樣類似的移動(dòng)平臺(tái)里自由交易，當(dāng)軟件的數(shù)量倍增使用的人嘗到甜頭，平臺(tái)的力量隨著用戶與開(kāi)發(fā)者的利益相互滿足，其影響力也隨之越強(qiáng)，優(yōu)秀的軟件并隨即而生，這就形成三者共贏。
截止到今年Apple付給開(kāi)發(fā)者的支票達(dá)百億以上的規(guī)模，這就引來(lái)許多開(kāi)發(fā)者愿意在移動(dòng)平臺(tái)里花精力去設(shè)計(jì)一款優(yōu)秀軟件，然后專門(mén)給這些呈規(guī)模效應(yīng)的平臺(tái)設(shè)計(jì)App并可養(yǎng)活一個(gè)事業(yè)，而作為產(chǎn)品的另一個(gè)不可或缺的重要角色—設(shè)計(jì)師，并可以得到發(fā)揮。當(dāng)所有這些平臺(tái)、用戶、開(kāi)發(fā)者形成一個(gè)良性循環(huán)發(fā)展時(shí)，大家的精力可以聚焦在產(chǎn)品上，而打造產(chǎn)品除了用工程的邏輯思維編寫(xiě)出每個(gè)功能步驟外，產(chǎn)品的美觀、文化、可操作性就需要用優(yōu)秀的設(shè)計(jì)體驗(yàn)來(lái)完成。
當(dāng)Apple掌控軟硬件取得空前的成功后，設(shè)計(jì)不只是再表現(xiàn)于皮膚表面之外，而應(yīng)在里面融入通常大家所熟知的：文學(xué)、歷史、音樂(lè)和藝術(shù)等等人文的主觀性感受，這些非理性的感情因素，致使大家開(kāi)始關(guān)注產(chǎn)品的人文精神。
迫于競(jìng)爭(zhēng)的壓力，這就是為什么微軟在2010年將Windows Phone從瑞士平面里獲取設(shè)計(jì)Modern的靈感引用到Windows 8的原因之一，后來(lái)Apple也將自己一手培養(yǎng)起來(lái)的Skeuomorphism由Jony Ive領(lǐng)導(dǎo)改頭換面，以至于今天Google也要開(kāi)始從傳統(tǒng)的紙墨文化概念里面尋找出路。
Google是如何將傳統(tǒng)“紙墨”的定義和產(chǎn)品聯(lián)系在一起？從Material Design Guidelines里面可以看到，下拉菜單和主界面的組成通常是一張張排列整齊的卡片來(lái)銜接，卡片承載的信息量貫穿始終。卡片式的設(shè)計(jì)由來(lái)已久，在Web、移動(dòng)客戶端我們隨處可以看到它的身影，而唯獨(dú)Google由這種風(fēng)格貫穿徹底，因?yàn)榭ㄆ幌窬W(wǎng)頁(yè)沒(méi)有邊緣界線可以無(wú)限延伸，它的特征跟我們用到的便條、普通紙張一樣有實(shí)際的邊界數(shù)量，像紙一樣可以折疊、收放自如。
卡片、紙，這兩者相同的特征可以將它們聯(lián)系起來(lái)，它們的簡(jiǎn)潔、易用性不容置疑。所以，卡片與紙的聯(lián)系可以看作Google從傳統(tǒng)紙墨里學(xué)習(xí)材質(zhì)的典型。
平面、卡片、抽象 平面——在人的潛意識(shí)中就是將所有看到的立體的三維影像轉(zhuǎn)換成一個(gè)面，這個(gè)面里沒(méi)有它受外界反射出來(lái)的強(qiáng)光和陰影，一切受自然規(guī)律所帶來(lái)的透視將不復(fù)存在。在這樣一個(gè)由四個(gè)基點(diǎn)所組成的空間里，人眼所觀察到的永遠(yuǎn)只有一個(gè)角度，而在這個(gè)空間里的所有物體也只有一個(gè)面，所以當(dāng)我們?cè)谶@個(gè)空間里面做任何判斷時(shí)，你所反應(yīng)的圖形就必須最能代表它本身的特征。
Google通過(guò)平面識(shí)別系統(tǒng)里的點(diǎn)、線、面三者間的聯(lián)系來(lái)塑造Material Design，它跟Windows Modern不同的是， Google終始保持界面的交互流程秩序，左右有規(guī)則的對(duì)齊留白、上下的比例對(duì)稱以及用懸浮在界面分割上下左右關(guān)系的圓形操作按鈕。
Google的這套用“線” 區(qū)分界面區(qū)域、用“點(diǎn)”控制功能的流程、用“面”滑動(dòng)界面的切換等有序的設(shè)計(jì)來(lái)顯現(xiàn)Material。當(dāng)這種整齊的排版讓人一目了然時(shí)，并形成了Google自有的風(fēng)格——卡片。
卡片的形成對(duì)于Material Design的重要性顯而易見(jiàn)，更可以說(shuō)是這套風(fēng)格的逐漸成形才有了Google對(duì)統(tǒng)一設(shè)計(jì)的野心，這就不免讓人聯(lián)想到去年Google Maps的改版，原先左側(cè)的狀態(tài)欄連同頁(yè)眉的搜索欄一同被重新設(shè)計(jì)在一個(gè)搜索框里，并將它的位置放置在頁(yè)面左上角，所有的地圖功能信息都隱藏在這個(gè)搜索欄里，然后以卡片的交互方式呈現(xiàn)所有的信息。Google Maps的這次改版可以看出Google早已為這套新語(yǔ)言 Material Design鋪路。
如果用卡片來(lái)代表Google Design，那么平面和抽象分別對(duì)應(yīng)微軟的Modern和 Apple的iOS，Google的卡片既不像微軟將所有帶邊框的分界線從屏幕里徹底拿掉，把每一寸像素騰給內(nèi)容，也不像Apple在拿掉紋理和光影的基礎(chǔ)上添加時(shí)尚動(dòng)感的漸變和抽象符號(hào)，Google更想用親和力的卡片式風(fēng)格樹(shù)立Material Design的統(tǒng)一跨平臺(tái)之路。
京公網(wǎng)安備 11010502049343號(hào)