根據(jù)最近一段時(shí)間 Google 發(fā)布的產(chǎn)品更新和外界傳出來(lái)的種種信息看，馬上就要舉行的 Google I/O 上極有可能會(huì)發(fā)布新一代的設(shè)計(jì)框架。這個(gè)框架的名字目前看起來(lái)也相當(dāng)確定，叫做 Quantum Paper（量子紙）。這個(gè)名字充滿想象力，無(wú)形的和有形的，科技的和傳統(tǒng)的。隱約能夠感覺(jué) Google 在這件事情上的野心和這套設(shè)計(jì)框架想要傳達(dá)的精神。

Google 的設(shè)計(jì)

Google 一直宣稱(chēng)自己是一家重視用戶體驗(yàn)的公司，但過(guò)去他們對(duì)體驗(yàn)的重視更多地體現(xiàn)在技術(shù)方面。要說(shuō)真正開(kāi)始把視覺(jué)設(shè)計(jì)和各產(chǎn)品體驗(yàn)做得統(tǒng)一重視起來(lái)的，應(yīng)該是從幾年前開(kāi)始不停折騰 google.com 的導(dǎo)航開(kāi)始，相對(duì)比較晚。

開(kāi)始重視設(shè)計(jì)和統(tǒng)一性之后，google.com 導(dǎo)航經(jīng)歷過(guò)大大小小若干次調(diào)整

雖然起步比較晚，但 Google 在設(shè)計(jì)上取得了非常大的進(jìn)展，這些進(jìn)展主要體現(xiàn)在這些方面：

● 更新了幾乎所有已有 web 產(chǎn)品的界面視覺(jué)，提升界面信息展示質(zhì)量和界面精細(xì)度

● 新發(fā)布的產(chǎn)品 / 功能，無(wú)一例外地重視界面設(shè)計(jì)，并且質(zhì)量相當(dāng)髙

● Google 的各個(gè)產(chǎn)品之間，各個(gè)產(chǎn)品在不同平臺(tái)上，漸漸體現(xiàn)出了很好的一致性

Web 上天氣查詢這樣存在已久的模塊，也更新為更強(qiáng)調(diào)美觀和信息展示質(zhì)量

即使是 Android 上的 Youtube 和 iOS 上的 Google Drive 這樣不同產(chǎn)品在不同平臺(tái)上的設(shè)計(jì)風(fēng)格仍保持高度一致

Google 漸漸改變了一個(gè)偏「geek」的形象，用優(yōu)良和一致的界面設(shè)計(jì)來(lái)包裝自己先進(jìn)的技術(shù)，這使得產(chǎn)品更易于使用并更討大眾喜歡，在產(chǎn)品上打下了「Google 設(shè)計(jì)」的印記。顯然 Google 認(rèn)為現(xiàn)在在設(shè)計(jì)上取得的成就還不夠，這次的 Quantum Paper 正是他們想把 「Google 設(shè)計(jì)」推向一個(gè)新高度的產(chǎn)物。

Quantum Paper Style

從字面來(lái)揣測(cè)，「quantum」暗喻交互風(fēng)格，而「paper」指代視覺(jué)要素，既追求科技感，又追求一種傳統(tǒng)介質(zhì)情結(jié)。到目前為止，Google 發(fā)布了三個(gè)明顯帶有 Quantum Paper 色彩的產(chǎn)品：

● Google+ for Android

● Google I/O 2014

● World Cup 2014

交互方面，在界面切換，操作反饋和狀態(tài)提示上在引入更多的細(xì)節(jié)同時(shí)做到更自然的動(dòng)畫(huà)效果。這一點(diǎn)在 World Cup 2014 for Google Now 上的體現(xiàn)非常明顯。

視覺(jué)方面，則在刻意強(qiáng)調(diào)一種「紙張的感覺(jué)」：

● 強(qiáng)調(diào)傳統(tǒng)的排版理念，通過(guò)更高要求的對(duì)齊關(guān)系，留白和圖形化等手段來(lái)提升信息展示的效率和閱讀體驗(yàn)

● 在圖標(biāo)，插畫(huà)和卡片等視覺(jué)元素設(shè)計(jì)上，強(qiáng)調(diào)紙的質(zhì)感和光影效果

World Cup 2014 for Google Now 和 Google I/O 2014 的界面設(shè)計(jì)都強(qiáng)調(diào)傳統(tǒng)紙質(zhì)排版方式

Google I/O 2014 網(wǎng)站上的插畫(huà)突出了紙張的材質(zhì)、層次和光照效果

除此之外，Quantum Paper 的圖標(biāo)風(fēng)格更進(jìn)一步趨向于造型簡(jiǎn)單，圓潤(rùn)和精致。

比起 Play Newsstand，同樣一組 icon 和 Google I/O 2014 上顯得造型更簡(jiǎn)單，圓潤(rùn)和精致。此外根據(jù)其他泄漏出來(lái)的信息看，在正式的 Quantum Paper 中，左側(cè)的漢堡包 icon 也會(huì)改成完整并不緊貼邊界的三條橫線。

如果說(shuō)之前 Google 還在致力于怎么樣讓自己的產(chǎn)品更美，那么 Quantum Paper 則是在這個(gè)基礎(chǔ)上引入了概念和故事性，把設(shè)計(jì)質(zhì)量推向一個(gè)更高的境界。

桌面到移動(dòng)設(shè)備，PC 到 Mac，Android 到 iOS

眾所周知，Google 的產(chǎn)品線豐富到令人發(fā)指，幾乎涉及到了所有平臺(tái)。操作系統(tǒng)級(jí)別的 Chrome OS 和 Android；app 級(jí)別的 web app、PC app、Mac app、Android app 和 iOS app；常規(guī) web 頁(yè)面的桌面版和移動(dòng)版。

讓這些產(chǎn)品有著同樣優(yōu)良的設(shè)計(jì)和操作體驗(yàn)自然是 Quantum Paper 的首要任務(wù)。在 app 和 web 這兩個(gè)級(jí)別的產(chǎn)品對(duì) Google 絕對(duì)不是一件難事，從 Google I/O 2014 和 World Cup 2014 兩個(gè)案例看，不管是桌面還是手機(jī)，web 還是 app 都有同樣優(yōu)秀的表現(xiàn)。在操作系統(tǒng)級(jí)別，如何統(tǒng)一 Chrome OS 和 android 的設(shè)計(jì)才是***難題，目前我們還沒(méi)有看到相關(guān)的信息， Quantum Paper 在這方面的解決方案非常值得期待。

World Cup 2014 的界面在大屏幕和小屏幕上的展現(xiàn)一脈相承

Google vs Android

Google 和 Android 還沒(méi)有真正走到一塊去，起碼從外界看是這樣。Google 和外界又都知道他們最終需要走到一塊去，他們?cè)诘却粋€(gè)時(shí)機(jī)，這個(gè)時(shí)機(jī)就是雙方都有一個(gè)穩(wěn)定的狀態(tài)。

如前面提到，Google 的其他產(chǎn)品在設(shè)計(jì)方面在不停的折騰后已經(jīng)漸入佳境，并處于一個(gè)比較穩(wěn)定的狀態(tài)。Android 這邊情況也類(lèi)似，從 4.0 開(kāi)始也停止了之前頻繁變化的狀況，之后的更新都是在 4.0 的基礎(chǔ)上做更深入的改進(jìn)，比較類(lèi)似 iOS 發(fā)展路徑。

另外一方面， Google apps 和 Android 的結(jié)合也日益緊密，比如無(wú)處不在的 Google 搜索入口，Google Now 成為 launcher 的首屏，這將使得 Google 和 Android 的一致化工作會(huì)得以更加平滑。

更有細(xì)心的網(wǎng)友大膽斷定 World Cup 2014 for Goolge Now 是 Android 5.0 的首張截圖，Quantum Paper 的發(fā)布非常有望成為 Google 和 Android 一致化標(biāo)志。

設(shè)計(jì)框架 vs 設(shè)計(jì)規(guī)范

Quantum Paper 很可能會(huì)跟他的先驅(qū) —— 去年 Google I/O 上介紹給大家的 Polymer 項(xiàng)目一樣作為一個(gè)設(shè)計(jì)框架開(kāi)放給所有開(kāi)發(fā)者使用。比起 Polymer，Quantum Paper 可把這些跨平臺(tái)的優(yōu)雅設(shè)計(jì)從 web 拓展到 Android 和 iOS 的 native UI。

比起設(shè)計(jì)規(guī)范，設(shè)計(jì)框架除了告訴開(kāi)發(fā)者界面應(yīng)該看上去是什么樣子，還會(huì)告訴開(kāi)發(fā)者如何輕易實(shí)現(xiàn)出這些界面。設(shè)計(jì)框架將同時(shí)面向設(shè)計(jì)師和工程師，讓工 程師完成設(shè)計(jì)及讓設(shè)計(jì)師完成界面的開(kāi)發(fā)成為可能。設(shè)計(jì)框架可以提升效率和設(shè)計(jì)質(zhì)量，使得設(shè)計(jì)能力 / 界面開(kāi)發(fā)能力較弱的開(kāi)發(fā)者也可以擁有中規(guī)中矩并適應(yīng)各個(gè)平臺(tái)的設(shè)計(jì)輸出。

Google vs Apple

作為殊途同歸的兩家公司，Google 和 Apple 這兩家公司不可避免地又要就這個(gè)話題被放在一起討論。

Apple 一直以來(lái)就是一家以設(shè)計(jì)見(jiàn)長(zhǎng)的公司，可以說(shuō)在設(shè)計(jì)方面 iOS 贏在了起跑點(diǎn)。深思熟慮的系統(tǒng)架構(gòu)和設(shè)計(jì)規(guī)范，友好的開(kāi)發(fā)環(huán)境，沒(méi)有機(jī)型適配和設(shè)備硬件落伍問(wèn)題的困擾，讓 iOS 上的 app 在視覺(jué)設(shè)計(jì)和交互體驗(yàn)上有著出色的表現(xiàn)，開(kāi)發(fā)者在設(shè)計(jì)上的投入也容易得到正面的回報(bào)。

在 Android 上的狀況則不盡人意，上進(jìn)的開(kāi)發(fā)者會(huì)投入額外的精力來(lái)針對(duì) Android 做設(shè)計(jì)，但表現(xiàn)還是明顯弱于自家 app 在 iOS 上的表現(xiàn)。更有很多開(kāi)發(fā)者，包括很多大型開(kāi)發(fā)者，直接將 iOS 的設(shè)計(jì)照搬到 Android 上，使得 Android 的處境相當(dāng)尷尬。

Google 仍有優(yōu)勢(shì)：

● Android 一直以來(lái)強(qiáng)調(diào)的開(kāi)放性，使得很多在 iOS 上無(wú)法實(shí)現(xiàn)的 app 可以在 Android 實(shí)現(xiàn)

● Google 自身的業(yè)務(wù)向 iOS 的滲透很強(qiáng)，Google 在 iOS 上的 app 設(shè)計(jì)質(zhì)量相當(dāng)高，用戶數(shù)量也相當(dāng)龐大，可以說(shuō)所有的 iOS 用戶都是 Goolge 的用戶，而很大一部分 Android 用戶不是 iOS 用戶

● Android 用戶在數(shù)量上具有優(yōu)勢(shì)

Google 希望通過(guò) Quantum Paper 來(lái)改善 Android 在設(shè)計(jì)上的尷尬局面：

● 在提升視覺(jué)精細(xì)度的同時(shí)主動(dòng)向 iOS 靠攏，盡量減少設(shè)計(jì)方面的差異，產(chǎn)品在兩個(gè)平臺(tái)上采取同樣設(shè)計(jì)（或轉(zhuǎn)換成本極低的設(shè)計(jì)）成為可能，大幅節(jié)約開(kāi)發(fā)者的成本，對(duì)用戶來(lái)講也是好事

● 用 Google 自家在 iOS 的應(yīng)用作為優(yōu)秀展示案例，告訴其他開(kāi)發(fā)者，Quantum Paper 這套設(shè)計(jì)框架是很靠譜的

● 開(kāi)放 Quantum Paper 給第三方開(kāi)發(fā)者使用，憑借少量投入即可擁有優(yōu)良的跨平臺(tái)設(shè)計(jì)方案的優(yōu)勢(shì)拉攏更多開(kāi)發(fā)者

簡(jiǎn)單說(shuō)就是 Google 本著一統(tǒng)江湖的想法，不再刻意去做差異化，而試圖把兩個(gè)平臺(tái)的設(shè)計(jì)模式推動(dòng)到同一個(gè)新的方向，這個(gè)方向介于現(xiàn)在的 Android 和 iOS 之間，并且擁有優(yōu)秀的視覺(jué)風(fēng)格和可用性。

寫(xiě)在后面

Quantum Paper 意味著 Google 在設(shè)計(jì)上的努力和野心。作為開(kāi)發(fā)者，我們期待看到 Google 如何跟 Android 走到一起，也期待看到在 Google 和 Apple 的競(jìng)爭(zhēng)中開(kāi)發(fā)者和用戶如何得到更多的好處。我們關(guān)心 Google 是否能夠通過(guò)此舉扭轉(zhuǎn) Android app 設(shè)計(jì)上的劣勢(shì)，也關(guān)心 Google 能否借助 Quantum Paper 提升整個(gè)行業(yè)的設(shè)計(jì)質(zhì)量和界面開(kāi)發(fā)效率。希望這些問(wèn)題從 Quantum Paper 的發(fā)布開(kāi)始，漸漸得到解答。

附加福利：豌豆莢 x Quantum Paper 搶先看