Google_logo

新的品牌標識使Google對我們的用戶更加方便和有用

由Alex Cook,Jonathan Jarvis和Jonathan Lee

Google不是一個傳統(tǒng)的公司。我們的使命是把世界的信息,使其普遍可及和有用 - 不斷發(fā)展。去年,我們引入了材料設(shè)計,幫助設(shè)計師和開發(fā)人員擁抱擴展的多設(shè)備多屏幕世界??紤]到這些考慮,我們很高興分享一個新的品牌標識,旨在使Google更容易訪問和使用用戶,無論他們遇到什么。

自創(chuàng)立以來,Google.com首頁顯得非常簡單:古怪的多彩多姿的標志位于一個干凈的白色畫布上的單一,平易近人的投入領(lǐng)域之上。但是隨著技術(shù)向前發(fā)展,畫布本身正在發(fā)生變化,投入和需求變得越來越多樣化。新一代的設(shè)備和互動方式已經(jīng)出現(xiàn)在我們周圍世界的可穿戴設(shè)備,語音技術(shù)和智能設(shè)備上。用戶現(xiàn)在可以通過使用一組設(shè)備與Google進行互動,而我們的品牌應(yīng)該在我們的主頁上表達同樣的簡單和喜悅,同時充分接受每個新設(shè)備和表面提供的機會。

這里有一些設(shè)計考慮,充分利用了人們對Google的了解和喜愛,并將品牌發(fā)展為繼續(xù)像我們一直努力的動態(tài)和非常規(guī)品牌。

設(shè)計在一起

今年初,來自全球各地的設(shè)計師,包括創(chuàng)意實驗室和材料設(shè)計團隊,在紐約召開了一個激烈的一周的設(shè)計沖刺。我們起草了一個簡要說明,確定了我們想要解決的四個挑戰(zhàn):

可擴展的標記,可以傳達在限制空間中的完整標識的感覺。

結(jié)合動態(tài),智能的動作,在互動的所有階段響應(yīng)用戶。

在我們的產(chǎn)品中進行品牌化的系統(tǒng)化方法,以提供人們?nèi)粘S龅紾oogle的一致性。

將我們的網(wǎng)站的優(yōu)化結(jié)合在一起,結(jié)合用戶所熟悉和喜愛的品牌,以及他們的需求如何變化的深思熟慮。

我們從干凈的白色背景開始,將我們品牌的精華放在四色之上,并將其重新構(gòu)建起來。粘性物質(zhì)被卡住,引腳被推動,而塞子是動畫的。隨著切割房間鋪滿了數(shù)百小時的設(shè)計工作,我們開始了幾個令我們興奮的方向。

我們與組織中的團隊分享了這一想法。工程,研究,產(chǎn)品和營銷測試了這些想法,并評估了其可行性,因為我們重復(fù)了設(shè)計和推廣策略。這個合作過程導(dǎo)致系統(tǒng)靈活性足以在任何平臺上使用我們的營銷材料和產(chǎn)品工作:構(gòu)成單一標志的三個基本狀態(tài)。

元素

從左到右:Google徽標使用無襯線,保留了我們獨特的多色序列。點是動態(tài)蒸餾交互式,輔助性和過渡時刻的標識。Google G是Google徽標的緊湊型版本,適用于小型環(huán)境。

了解系統(tǒng)

思維和設(shè)計的發(fā)展比核心要素深得多,而且開發(fā)了一個規(guī)范來幫助各種應(yīng)用程序的團隊保持一致。以下示例不全面,但顯示了進入系統(tǒng)的一些想法。


google_logo_1

打印商標

Google徽標始終具有簡單,友好和平易近人的風格。我們希望通過將幾何形式的數(shù)學(xué)純度與教科書信打印的童心簡單相結(jié)合來保留這些素質(zhì)。我們的新標識設(shè)置在一個自定義的幾何無襯線字體中,并保持多色的俏皮感和旋轉(zhuǎn)“e”我們以前的標記 - 提醒我們永遠是一個非常規(guī)的。

在所有新的數(shù)字環(huán)境中,最終的標識都以不同的尺寸和重量進行了徹底的測試,以獲得最大的可讀性。為了指導(dǎo)屏幕和打印的使用,我們制定了涵蓋標識的所有方面的標準,包括間隔,清除規(guī)則,產(chǎn)品鎖定和產(chǎn)品處理的紅線規(guī)范。


google_logo_2

Google G建設(shè)

Google G直接來源于標識“G”,但是使用增加的視覺重量可以在需要與其他元素共享空間的小尺寸和上下文中站起來。設(shè)計在與我們的產(chǎn)品圖像相同的網(wǎng)格上,圓形形狀被光學(xué)精制,以防止圓形遇到橫梁時的視覺“偏斜”。顏色比例傳達標識的全譜,并進行排序以幫助圍繞字母形狀的眼睛運動。


google_logo_3

Google Dots in Motion

Google點是標志的動態(tài)和永恒的移動狀態(tài)。它們代表Google的工作情報,并指出Google正在為您工作。我們認為這些獨特的魔法時刻。開發(fā)了一系列表達方式,包括聽力,思維,回答,不理解和確認。雖然他們的動作似乎是自發(fā)的,但是他們的動作植根于一致的路徑和時間,點數(shù)沿著幾何弧線移動,并遵循標準的快速松弛曲線。


google_logo_4

顏色

谷歌標識受益于字母之間的空格,但是當顏色相鄰時,就像Google G的情況一樣 - 它們被光學(xué)混合,并且可能導(dǎo)致原始值的變暗和變暗。我們調(diào)整并推動紅色,綠色和黃色的活力,以保持飽和和流行。

履行


google_logo_5

活版印刷

在開發(fā)標識的同時,我們創(chuàng)建了一種定制的幾何無襯線字體,以補充產(chǎn)品鎖定中的徽標和支持身份資料。我們稱之為產(chǎn)品類。字體設(shè)計采用同樣的教科書信紙打印風格的提示,但采用了幾何無襯線的中性一致性。這使我們能夠在Google標識和產(chǎn)品名稱之間保持適當?shù)膮^(qū)別。字符集包含數(shù)字,標點符號,口音和備用字符,分數(shù),符號和支持擴展拉丁語,希臘語和西里爾字體。下載類型標本更多細節(jié)。


google_logo_6

產(chǎn)品

Google的許多產(chǎn)品將會發(fā)布更新,但對于大多數(shù)人來說,新品牌的第一次體驗將是通過搜索。搜索UX和工程團隊努力提供文本和語音查詢的第一個實例,展現(xiàn)了身份的全面表達。

更廣泛的分銷

隨著設(shè)計的發(fā)展,工程開發(fā)了一種獨特的方法,用于資產(chǎn)生成,版本控制和我們代碼庫中的自助服務(wù)分發(fā)。使用像素完美SVG作為基礎(chǔ)資產(chǎn),我們自動生成數(shù)千個基于矢量的變體,以滿足大小,顏色和背景要求。然后,這些變體在規(guī)范的位置檢查到我們的源代碼控制中,以避免重復(fù),并確保每個團隊都使用最正確的最新資產(chǎn)。


google_logo_7

這有助于我們使設(shè)計像素在任何地方都可以完美使用,并且允許我們優(yōu)化這些資產(chǎn)的尺寸和延遲,包括構(gòu)建一個僅305字節(jié)的全彩色標志的特殊變體,與現(xiàn)有標志相比,約為14,000字節(jié)。舊的標志,其復(fù)雜的內(nèi)容和更大的文件大小要求我們?yōu)榈蛶掃B接提供基于文本的標識近似。新標識縮小的文件大小避免了這種變通方法,當您考慮我們的目標是讓Google對世界各地的用戶(包括下一個十億)更易于訪問和有用的時候,一致性就會產(chǎn)生巨大的影響。

超越設(shè)計

設(shè)計只是努力的一部分。實現(xiàn)新的身份要求對數(shù)百名Google員工進行集體工作和勤奮工作,不同角色,跨越整個組織。他們應(yīng)該得到巨大的信譽,建立和實施系統(tǒng)到最后一個像素。

隨著我們推動創(chuàng)造新的產(chǎn)品和經(jīng)驗,我們希望這項工作將繼續(xù)為您提供Google期望的簡單和高興 - 無論新技術(shù)可能帶給我們什么。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容