Google 的設計團隊如何定義LOGO? 讓網頁上的服務具有 ...

一開始Google 的官網設計就非常簡潔，在白色的頁面中間是顯眼的搜索搜尋框，上方則是Google 的四色logo。

科技不斷低進步，頁面也在不斷改變，輸入方式 ... Google的設計團隊如何定義LOGO?讓網頁上的服務具有一致性 2021-11-02 2015年9月2日Google凌晨宣布啟用新的LOGO，新LOGO的設計是為了適用不同的裝置平台，包括智慧型手機、電視、手錶、汽車等。

谷歌副總裁與產品經理塔馬爾·約書亞(TamarYehoshua)表示商標最初的設計是用於桌上型電腦的瀏覽器頁面，之後不斷更新LOGO是為了在符合各種設備和輸入方式，如觸控、打字和語音。

多年來Google一直在對Logo有小幅調整。

Google曾在Logo後面加入感嘆號，並在字母G上使用綠色替代藍色，自1999年以來GoogleLogo的基本設計沒有太大變化。

Google表示這不是第一次更新LOGO，也不是最後一次，不過這是16年以來風格變化最大的一次。

新LOGO採用無襯線字體，字母G採用四種顏色，讓整體更加動態。

我們來看Google的設計團隊如何定義他們的LOGO：   EvolvingtheGoogleIdentity AnewbrandidentitymakesGooglemoreaccessibleandusefultoourusers ByAlexCook,JonathanJarvis,andJonathanLee Google從來不是一家循規蹈矩的公司，我們目標是幫助人們運用全球的資源並從中獲益，且不斷發展進步。

去年Google開發MaterialDesign幫助設計師與工程師進入跨裝置、跨平台領域。

因為有這些想法理念，我們非常樂於分享Google新的品牌形象：不管你身在何方，我們都希望幫助使用者更輕鬆、更有效地使用Google。

一開始Google的官網設計就非常簡潔，在白色的頁面中間是顯眼的搜索搜尋框，上方則是Google的四色logo。

科技不斷低進步，頁面也在不斷改變，輸入方式與使用者需求也在不斷變化。

新的溝通工具與途徑不斷出現，尤其體現在可穿戴設備、語音技術以及智慧型設備等方面。

用戶現在可以使用各種不同的裝置登錄Google帳號，我們也應該在首頁向用戶傳遞他們所期待的簡潔有趣的感覺，這樣才可以擁抱不同設備與平台所帶來的機會。

現在我們要向你介紹一下我們的設計理念，那就是：了解用戶熟悉喜愛Google的地方，在此基礎上發展我們的品牌，努力成為一家有活力的、不墨守成規的公司。

  共同設計 今年年初，包括創新實驗室(CreativeLab)、MaterialDesign來自不同團隊的設計師們，在紐約召開一個為期一周的緊張激烈的設計會議，我們草擬了4項想要去完成的挑戰： 具延展性：在一個限空間內可以完整傳達的標識； 動態效果：在每個轉換階段都能回應用戶； 系統化：透過系統化使產品品牌化，為用戶使用Google過程中提供一致性的服務； 風格精緻化：結合用戶熟悉喜愛Google的地方，在此基礎上對用戶需求的變化進行分析； 我們從擷取Google的品牌精華開始，找到設計的關鍵——在一塊白色背景上的四種顏色——並把它們組合在一起。

過程中工作室裡混亂不堪，膠水粘在一起，圖釘散落一堆，但隨著投入幾百個小時的設計工作，我們找到了幾個讓我們感到激動的新方向。

團隊中彼此分享自己的想法，工程部門、研究部門、產品部門與營銷部門各自反複檢驗不同的想法，並推測不同想法的可行性。

通力合作終於完成了一個足夠靈活的、可以被用在不同平台的營銷素材和產品任務中的新系統：由3個基本狀態構成一個單一的logo。

Google設計理念是：瞭解使用者熟悉喜愛Google的地方，以此發展我們的品牌，努力成為一間有活力、不墨守成規的企業。

  設計元素 標誌 保留Google傳統的四色元素，使用無襯線字。

點 動態的四個點可增加互動性、輔助性、過渡性．提高使用者體驗． 圖示 四色的G可用於窄小畫面中。

  規範系統 Google在思維與設計方面的發展比起一些核心元素要走得更遠，因此開發出一套規範可以幫助整個團隊在不同方面保持一致性。

下面的例子並不能完全說明問題，但是也展示了一些我們對於這個系統的想法。

  商標 Google的標識一直保持著簡單、友好、親近用戶的設計風格。

我們想要繼續保持logo原有的幾何形式與教科書字母印刷字體，這些如孩子般的簡單特點。

新的標識設定為自定義的無襯線字體，同時繼續維持多種色彩的輕鬆風格，並且將原有標識中的字母「e」旋轉—表示Google永遠追求創新的理念。

最終的標識經過了很多嚴苛的測試，其中包括尺寸的問題，以及在不同的數字化場景中呈現的清晰度。

同時為了指導用戶在螢幕上的使用和印刷，我們開發了覆蓋所有領域的關於logo的標準，其中包括logo的位置、清除logo的規則、以及產品的出版與印刷方法等各個方面。

  GoogleG構造 GoogleG是直接從Google標識中的“G”發展出來的，增強了在小尺寸界面下使用視覺效果。

在同一個網格內設計的產品形象，圓形的設計從光學角度防止了視覺上“過於集中在一點”的問題，而色彩的比例傳遞出標識的完整光譜，顏色的順序也有利於看這個字母時的視線運動。

  動態圓點 Google圓點是logo在動態的、永恆運動中的狀態。

它們既能展現Google在工作當中的聰明，又能顯示出Google正在為你服務，我們認為這是一種獨特的、奇妙的運動形式。

一個完整Google圓點的展現形式包括傾聽、思考、回覆、不解、以及確認這幾個步驟。

也許他們的動作看起來是同步發生的，但它的動態是基於一致的路徑與時間。

  色彩 Google的彩色標識很顯眼，受益於logo字母之間的留白範圍。

當顏色很接近時——比如GoogleG的例子——從視覺上就容易混淆，可能導致最初的想法受到影響。

因此，我們調整了顏色，選擇了有活力的紅色、綠色和黃色去維持logo的色彩飽和度和流行性。

  字體設計 為了配合新標識的開發，我們創造了一個無襯線的字體，以滿足產品的標識識別及設計素材，我們把這種字體稱為「ProductSans」。

字體設計的靈感來自相似的教科書字體風格，但採用無襯線中性化的一致風格。

我們可以在Google的標識與產品名稱以維持一個恰當的區別。

字型由數字、標點符號、發音、備選字符、分數、標誌以及一些諸如拉丁語、希臘語在內的擴展語種完整組成。

  產品 儘管Google旗下的許多其他產品都將會更新，但對於大多數用戶而言，於這個新標識的第一印像還是來自於搜尋頁面，因此搜尋方面的用戶體驗團隊及工程師團隊，努力提供文本及語音搜尋的方案，以完善產品的全方位展現。

  廣泛運用 隨著設計的發展，工程開發了一個獨特的代碼資源，用於版本控制versioncontrol、自助服務self-service。

使用基礎在像素完美的SVGs，我們自動生成了上千個向量的變體去滿足不同尺寸、顏色和背景的需求。

這些變體被放進規範的位置進行代碼檢驗，避免重複，並確保每一個團隊都在使用最正確的、最新的資源。

這幫助我們設計時在任何地方都能呈現完美的像素，並且可優化這些資源的尺寸和延遲時間，其中包括開發一個只有305bytes的全彩logo變體（過去使用的全彩logo需要14000bytes）。

舊的logo，因複雜的襯線字體和較大的檔案，需要為頻寬較低的用戶提供「相似版」logo。

新的logo則縮減了檔案大小，避免了這種具有極大的影響的解決辦法；面對全球用戶時讓Google更加有用方便，包括下一個十億的目標，產品的一致性才能得到完全的發揮。

  設計之外 設計只是我們努力中的一部分而已，新標識的實現需要集體的努力以及上百位Google員工的智慧。

為了建設並實施這個最新的像素系統，他們值得充分的信任。

因為Google一直致力於創造新的產品和新的用戶體驗，我們希望這一次的工作，可以傳遞出你想要在Google看到的、感受到的簡潔與樂趣—無論新的科技將會把我們帶向何處。

  原文與圖片來源自 GoogleDesign：https://design.google/library/evolving-google-identity/ 相關網頁設計觀點 ESG企業永續網頁如何設計？五大評鑑重點架構 Nike如何用30年資深員工的故事，溝通重視員工的企業文化？ESG永續故事影響力 如何讓抽象的服務具體化，讓網頁設計傳遞正確的理念：永齡未來醫院 返回列表 P A G E L O A D I N G P A G E L O A D I N G