編者按：Google品牌形象的每一次改變都牽動(dòng)著全世界用戶的心，無(wú)疑是這家科技巨頭的強(qiáng)大影響力所造就的結(jié)果。隨著最新的Google視覺(jué)形象的發(fā)布，吐槽和贊譽(yù)就沒(méi)有停止過(guò)，但是此刻我們不妨將腦洞先填上，看看新設(shè)計(jì)背后Google到底有著怎樣的考慮。特別感謝@-川行者-同學(xué)，原文中的視頻均被他親手壓制成GIF動(dòng)畫(huà)！

谷歌并不是一家傳統(tǒng)公司。我們的使命是整合全世界的信息，讓它們更易于獲取并讓用戶從中受益，并且我們也一直推動(dòng)著這件事情，不斷發(fā)展。去年，我們推出了Material Design，讓設(shè)計(jì)師和開(kāi)發(fā)者擁有更強(qiáng)的拓展性，輕松擁抱這個(gè)多屏、多設(shè)備的世界。因此，今天很高興能和你們分享我們?nèi)碌钠放菩蜗?，希望全新的谷歌無(wú)論何時(shí)何地都能讓用戶更方便。

自Google成立以來(lái)，Google.com的網(wǎng)頁(yè)設(shè)計(jì)一直保持著驚人的簡(jiǎn)約：古怪而多彩的Logo在一個(gè)簡(jiǎn)單直觀的輸入框上面，整個(gè)頁(yè)面的背景就是單純的白色。隨著技術(shù)的發(fā)展，設(shè)計(jì)開(kāi)始發(fā)生變化，需求和投入也變的越發(fā)的多樣化。全新的設(shè)備類(lèi)型和多樣的交互和溝通方式同可穿戴設(shè)備、語(yǔ)音技術(shù)以及智能硬件結(jié)合到了一起，在我們身周并不鮮見(jiàn)。今天的用戶通過(guò)一系列不同的設(shè)備承載谷歌的服務(wù)，而我們應(yīng)當(dāng)以更為簡(jiǎn)約而令人愉悅的品牌形象，來(lái)回應(yīng)大家的認(rèn)可和期望，以新的姿態(tài)來(lái)?yè)肀恳粋€(gè)機(jī)會(huì)和每一塊屏幕。

接下來(lái)，我們來(lái)看看有哪些設(shè)計(jì)是大家所認(rèn)可而喜歡的，并推動(dòng)整個(gè)品牌形象向著更加動(dòng)態(tài)而非傳統(tǒng)的方向進(jìn)化。

共同設(shè)計(jì)

今年年初，來(lái)自世界各地的設(shè)計(jì)師，同谷歌的創(chuàng)意實(shí)驗(yàn)室與Material Design團(tuán)隊(duì)一起，在紐約一同進(jìn)行了為期一周的設(shè)計(jì)沖刺活動(dòng)，我們共同起草了一份簡(jiǎn)短的列表，確定了我們要解決的四個(gè)主要挑戰(zhàn)：

1、它需要是一個(gè)可拓展性的標(biāo)識(shí)，在有限的空間中傳達(dá)出完整的信息和形象
2、它需要是一個(gè)高度整合的動(dòng)態(tài)形象，將用戶交互的不同階段都整合到一起
3、它需要是一套系統(tǒng)的方法，不僅要便于我們產(chǎn)品的品牌推廣，還要確保用戶在同谷歌產(chǎn)品日常接觸時(shí)候擁有一致的體驗(yàn)和感受
4、它需要是成就谷歌風(fēng)格的所有元素的精煉，將用戶所喜歡所熱衷的谷歌元素集成到當(dāng)中，并且隨著用戶需求的變化而進(jìn)行提升和調(diào)整

于是，我們開(kāi)始將我們的品牌形象抽象、精煉成最基礎(chǔ)的四種色彩，并置于白色的背景上，以為備份。確定了問(wèn)題，構(gòu)思被固定在白板上，動(dòng)畫(huà)也借由貝賽爾曲線勾勒出來(lái)。在上百個(gè)小時(shí)的設(shè)計(jì)之后，我們?cè)诘匕迳蠑[滿了不同的設(shè)計(jì)方案，并且確定了幾個(gè)令人振奮的設(shè)計(jì)方向。

我們同整個(gè)團(tuán)隊(duì)分享了想法，工程、研發(fā)、產(chǎn)品和營(yíng)銷(xiāo)的團(tuán)隊(duì)參與了測(cè)試和可行性分析，并反復(fù)推敲了設(shè)計(jì)方案的部署和策略。這種協(xié)作流程帶來(lái)了一套足夠靈活的系統(tǒng)，足以讓營(yíng)銷(xiāo)材料和產(chǎn)品應(yīng)用于任何平臺(tái)，并將三種不同狀態(tài)的設(shè)計(jì)元素融合為一個(gè)LOGO。

元素

Google LOGO樣式

確保它是一個(gè)包含顯著多色彩的無(wú)襯線體文字LOGO

點(diǎn)

具備互動(dòng)性、輔助性和過(guò)渡性的濃縮的動(dòng)態(tài)形象

Google G

緊湊版的Google Logo形象

了解這套體系

對(duì)于這套體系的思考和設(shè)計(jì)開(kāi)發(fā)遠(yuǎn)不止于核心元素這么簡(jiǎn)單，我們的團(tuán)隊(duì)設(shè)定了一套規(guī)范來(lái)確保它的廣泛應(yīng)用性和一致性。下面的示例雖然不完全，但是能夠展現(xiàn)出我們系統(tǒng)思考的一部分。

LOGO樣式

Google的LOGO一直保持著簡(jiǎn)約、友好而平易近人的風(fēng)格，我們希望通過(guò)擁有高純度數(shù)學(xué)特質(zhì)的幾何形象和教科書(shū)式的字母形象，來(lái)保持LOGO孩子般的單純特質(zhì)。新的標(biāo)識(shí)采用了幾何風(fēng)格的無(wú)襯線體設(shè)計(jì)，并且結(jié)合了多彩的用色和極具趣味性的旋轉(zhuǎn)（字母e）。

通過(guò)在不同的數(shù)字環(huán)境中進(jìn)行嚴(yán)苛的測(cè)試，我們確定了最終LOGO樣式中字體的大小、粗細(xì)。為了確保LOGO的屏幕顯示和印刷效果，我們所制定的標(biāo)準(zhǔn)涵蓋了間距和間隙的規(guī)則，產(chǎn)品鎖定規(guī)則以及產(chǎn)品處理的排除規(guī)則等整套規(guī)范。

G LOGO的構(gòu)建

Google G標(biāo)識(shí)的設(shè)計(jì)來(lái)源于字母G的形象，但是為了增加它在小尺寸使用時(shí)的視覺(jué)重量，需要讓它同其他的元素共享空間。這個(gè)G字母LOGO的設(shè)計(jì)和Google Logo所使用的柵格系統(tǒng)相同，由于字母G中間橫線的存在，為了在使用四色填充的時(shí)候確保整體的視覺(jué)平衡感，并且根據(jù)眼睛的視覺(jué)特征，我們重新調(diào)整了色彩的區(qū)域和次序。

Google 點(diǎn)狀動(dòng)效

Google的點(diǎn)狀LOGO一直保持著充滿活力的運(yùn)動(dòng)狀態(tài)。它代表著Google充滿智能的運(yùn)作方式和為你服務(wù)的態(tài)度。我們仔細(xì)推敲著這些獨(dú)特而神器的時(shí)刻，并且開(kāi)發(fā)出了包含挺、思考、回復(fù)、迷惑、理解等不同的動(dòng)態(tài)標(biāo)識(shí)。雖然整個(gè)動(dòng)效看起來(lái)是自發(fā)而毫無(wú)雕飾的，但是實(shí)際上它們是遵循一致的路徑和相同的變化時(shí)間，弧度、長(zhǎng)度等幾何特征也是遵循著相同的標(biāo)準(zhǔn)。

色彩

得益于留白，Google LOGO 中不同字母在視覺(jué)上看起來(lái)平衡而不沖突，但是當(dāng)這些色彩混合到一起融入字母G LOGO中的時(shí)候，視覺(jué)上的混合會(huì)讓色彩看起來(lái)會(huì)晦暗，所以我們?cè)谥谱鱃的LOGO的時(shí)候其實(shí)是對(duì)色彩進(jìn)行適當(dāng)調(diào)整，確保它看起來(lái)活潑而自然。

最終實(shí)施

排版

為了配合全新的標(biāo)識(shí)，我們還重新制作了一套專門(mén)的無(wú)襯線字體，方便產(chǎn)品和相關(guān)材料中使用。我們將這套字體稱為Product Sans。這套字體同樣借鑒了教科書(shū)字體的印刷風(fēng)格，不過(guò)其中的設(shè)計(jì)細(xì)節(jié)更多的還是采用了幾何無(wú)襯線字體的自然特征。如此一來(lái)，我們可以確保Google Logo和產(chǎn)品字體之間的差異和識(shí)別性。整套字體中包含了全部的數(shù)字、標(biāo)識(shí)符號(hào)、拉丁語(yǔ)字母、希臘字母和西里爾字母。

產(chǎn)品

Google 的整個(gè)產(chǎn)品線都會(huì)逐步完成新標(biāo)識(shí)的更新升級(jí)，不過(guò)由于大家對(duì)于Google的最早接觸多為搜索，所以改變將從Google搜索開(kāi)始。搜索UX團(tuán)隊(duì)和開(kāi)發(fā)團(tuán)隊(duì)目前都在致力于文本搜索和語(yǔ)音搜索的品牌形象更新，由此彰顯品牌全面的全面升級(jí)。

廣泛分布

隨著設(shè)計(jì)和開(kāi)發(fā)相關(guān)素材的逐步增加，版本控制和自我服務(wù)會(huì)逐步擴(kuò)展到整個(gè)代碼庫(kù)。比如像素完美的SVG格式素材，系統(tǒng)會(huì)自動(dòng)生成數(shù)以千計(jì)的不同尺寸的變體，以滿足不同的尺寸、色彩和背景的需求。隨后，相關(guān)的源代碼會(huì)控制在一個(gè)相對(duì)規(guī)范的位置，避免重復(fù)，并且確保團(tuán)隊(duì)成員和產(chǎn)品所使用的是最正確和最新版的素材。

在這種運(yùn)作方式之下，我們可以更加快速便捷地在任何地方使用新的素材，想比起之前LOGO 14000字節(jié)的大小，新的LOGO僅有305字節(jié)。新版的LOGO由于復(fù)雜度的降低使得全世界的用戶可以更快的加載使用它了。

設(shè)計(jì)之外

設(shè)計(jì)僅僅只是我們所付出的努力中的一部分。新的標(biāo)識(shí)讓數(shù)百橫跨不同組織、處于不同工作崗位的Google 員工協(xié)同工作，而最終的收獲也使得這些巨大的投入顯得非常有價(jià)值。

我們會(huì)繼續(xù)打造更優(yōu)秀的產(chǎn)品和體驗(yàn)，希望我們的努力符合你的預(yù)期，能讓你能更好地使用谷歌的服務(wù)并獲得回報(bào)。

【了解偉大企業(yè)的歷史變遷】

“不作惡”企業(yè)谷歌的首頁(yè)變遷史
《生日快樂(lè)！那些年我們用過(guò)的谷歌首頁(yè)》

設(shè)計(jì)的趨勢(shì)從此可見(jiàn)一斑！
《漲姿勢(shì)！從蘋(píng)果官網(wǎng)細(xì)看20年設(shè)計(jì)變遷史》

連邀請(qǐng)函都有濃濃的設(shè)計(jì)范兒！
《向經(jīng)典致敬！帶你看十年來(lái)蘋(píng)果發(fā)布會(huì)的邀請(qǐng)函》

原文地址：Google Design
優(yōu)設(shè)譯者：@陳子木

「子木說(shuō)」

據(jù)我所知，從2011年開(kāi)始谷歌就開(kāi)始在紐約構(gòu)建了一個(gè)獨(dú)立于谷歌總部之外的設(shè)計(jì)實(shí)驗(yàn)室，其中包含了各種藝術(shù)家和來(lái)自各大科技公司的設(shè)計(jì)師，他們的出現(xiàn)和谷歌的設(shè)計(jì)轉(zhuǎn)型息息相關(guān)，包括這次的品牌形象升級(jí)，將會(huì)議地點(diǎn)也選在了紐約，無(wú)疑是和這個(gè)Creative Lab 息息相關(guān)。谷歌本就是一個(gè)開(kāi)放的公司，以前在工程和產(chǎn)品上體現(xiàn)的尤為明顯，這幾年谷歌在設(shè)計(jì)領(lǐng)域的輸出，則體現(xiàn)出他們的開(kāi)放性設(shè)計(jì)所帶來(lái)的強(qiáng)大生命力。

本文由優(yōu)設(shè)網(wǎng)原創(chuàng)翻譯，請(qǐng)尊重版權(quán)和譯者成果，轉(zhuǎn)摘請(qǐng)附上優(yōu)設(shè)鏈接，違者必究。謝謝各位編輯同仁配合。

【優(yōu)設(shè)網(wǎng) 原創(chuàng)文章 投稿郵箱：2650232288@qq.com】

================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是國(guó)內(nèi)人氣最高的網(wǎng)頁(yè)設(shè)計(jì)師學(xué)習(xí)平臺(tái)，專注分享網(wǎng)頁(yè)設(shè)計(jì)、無(wú)線端設(shè)計(jì)以及PS教程。
【特色推薦】
設(shè)計(jì)師需要讀的100本書(shū)：史上最全的設(shè)計(jì)師圖書(shū)導(dǎo)航：http://hao.uisdc.com/book/。
設(shè)計(jì)微博：擁有粉絲量100萬(wàn)的人氣微博@優(yōu)秀網(wǎng)頁(yè)設(shè)計(jì) ，歡迎關(guān)注獲取網(wǎng)頁(yè)設(shè)計(jì)資源、下載頂尖設(shè)計(jì)素材。
設(shè)計(jì)導(dǎo)航：全球頂尖設(shè)計(jì)網(wǎng)站推薦，設(shè)計(jì)師必備導(dǎo)航：http://hao.uisdc.com