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