听Google设计团队讲述新logo是如何被设计出来的

[核心提示] Google 为什么要换 logo,这个新 logo 是以什么样的理念和思路设计出来的?来听听 Google 设计团队自己的解释吧~
Google 从来不是一家循规蹈矩的公司,我们的目标是帮助人们可以充分利用世界上的信息并从中获益,并且不断向前进步。去年,我们就开发了 Material Design 去帮助设计师与开发者们进入一个广阔的、多设备的、多屏的世界中去。因为有这些想法在心中,所以我们非常高兴地与你分享 Google 新的品牌形象:不管你身在何方,我们都希望可以帮助你更轻松、更有效地使用 Google。
从一开始,Google 的官网设计就非常简洁:在白色的页面中间是显眼的搜索输入框,在它的上方,则是 Google 独特多彩的 logo。科技是不断向前发展的,页面也在不断改变,输入方式与用户需求也在不断变化。新的用于沟通交流的设备与途径正在出现,尤其体现在可穿戴设备、语音技术以及智能设备等方面。用户们现在使用各种不同的设备登录 Google,而我们自己也应该在首页向用户传递他们所期待的简洁有趣的感觉,这样才可以拥抱不同设备与平台所带来的机会。
现在,我们要向你介绍一下我们的设计理念,那就是:了解用户熟悉和喜爱 Google 的地方,在此基础上发展我们的品牌,努力成为一家有活力的、不墨守成规的公司。
共同设计
今年早些时候,包括创新实验室 (Creative Lab)、Material Design 团队在内的来自不同公司的设计师们,在纽约召开了一个为期一周的紧张激烈的设计会议,我们起草了 4 项想要去完成的挑战:
创造一个可以在有限空间内传达完整标识的可扩展性标志符号;
通过动态化与智能化概念的结合,做到在交流中的每个阶段都可以回应用户的需求;
通过系统化的方法使我们的产品品牌化,为用户在日常使用 Google 的过程中提供一致性的服务;
使 Google 的风格精致化,并结合用户熟悉和喜爱 Google 的地方,在此基础上对用户需求的变化进行周密的分析。

我们从提取 Google 的品牌精华入手,以此找到了关键因素——在一块白色背景上的四种颜色——并把它们组合在一起。虽然工作室里混乱不堪,胶水粘在一起,图钉散落一堆,但随着花费在里面几百个小时的设计工作,我们找到了几个让我们感到激动的新方向。
我们在团队中分享自己的想法,工程部门、研究部门、产品部门与营销部门各自反复检验不同的想法,并且测算不同想法的可行性。这个通力合作的过程终于完成了一个足够灵活的、可以被用在不同平台的营销材料和产品任务中的新系统:由3个基本状态构成一个单一的 logo。
新元素
「Google」标识
使用无衬线字体,同时保留了 Google 独特的颜色使用顺序。

g-logo.png

Google 圆点
在互动性、辅助性及流畅性方面,这个标识进行了动态提升。

Google G
对于界面较小的使用平台,Google 也推出了相应的「紧凑」版本的 logo。

g-letter.png

了解这个系统
Google 在思维与设计方面的发展比起一些核心元素要走得更远,因此开发出一套规范可以帮助整个团队在不同方面保持一致性。下面的例子并不能完全说明问题,但是也展示了一些我们对于这个系统的想法。

标识
Google 的标识一直保持着简单、友好、亲近用户的设计风格,通过结合 logo 原有的几何形式与新的、儿童化的教科书字体,我们想要继续保持这些特点。我们新的标识设定为自定义的无衬线字体,同时继续维持多种色彩的轻松风格,并且将原有标识中的字母「e」进行了旋转—这是为了表明 Google 永远追求创新的理念。
最终的标识经过了很多严苛的测试,其中包括尺寸的问题,以及在不同的数字化场景中呈现的清晰度问题。同时,为了指导用户在屏幕上的使用和打印,我们开发了覆盖所有领域的关于 logo 的标准,其中包括 logo 的位置、清除 logo 的规则、以及产品的出版与印刷方法等各个方面。

Google G 的构造
Google G 是直接从 Google 标识中的「G」发展出来的,但是增强了在小尺寸界面下使用视觉效果。作为在同一个网格内设计的产品形象,圆形的设计从光学角度防止了视觉上「过于集中在一点」的问题,而色彩的比例传递出标识的完整光谱,颜色的顺序也有利于看这个字母时的视线运动。

运动中的 Google 圆点
Google 圆点是 logo 在动态的、永恒运动中的状态。它们既展现着 Google 在工作当中的聪明才智,又能显示出 Google 正在为你服务,我们认为这是一种独特的、奇妙的运动形式。一个完整 Google 圆点的展现形式包括倾听、思考、回复、不解、以及确认这几个步骤。也许他们的动作看起来是同步发生的,但它的运动基于一致的路径和时间。

色彩
Google 的彩色标识很显眼,这受益于字母式 logo 之间的空白区域。但是当颜色很接近时——比如 Google G 的例子——他们从视觉上就容易混淆,并且可能导致最初的想法受到影响。因此,我们调整了颜色的种类,选择了有活力的红色、绿色和黄色去维持 logo 的色彩饱和度和流行性。
实施过程

印刷
为了配合新标识的开发,我们创造了一个几何无衬线的自定义字体,以此来补充产品的标识识别及设计材料,我们叫它「Product Sans」。字体设计的灵感来自相似的教科书字体风格,但是采用的是无衬线中性化的一致风格。这使得我们可以在 Google 的标识与产品名称之间维持一个恰当的区别。字符集由数字、标点符号、发音、备选字符、分数、标志以及一些诸如拉丁语、希腊语在内的扩展语种完整组成。

产品
尽管 Google 旗下的许多其他产品都将会得到更新,但是对于大多数用户来说,他们对于这个新标识的第一印象还是来自于搜索页面,因此,搜索方面的用户体验团队及工程师团队努力去提供文本及语音搜索的实施方案,完善了产品的全方位展现。
更广的分布
随着设计的发展,工程方面也根据我们的代码库开发出了一个面向资源生成、版本控制、及自助服务分布的独特方法。使用在基础设置上像素完美的 SVGs,我们自动生成了上千个基于矢量的变体去满足不同尺寸、颜色和背景的需求。这些变体被放进一个典型的场景当中进行源代码检验,以此来避免重复的情况,并且可以确保每一个团队都在使用最正确的、最新的资源。

这帮助我们做出了在每一个方面都像素完美的设计,并且让我们可以优化这些资源的尺寸和延迟时间,其中包括开发一个只有 305 个字节的全彩 logo 变体(过去使用的全彩 logo 需要 14000 个字节)。旧的 logo,因为其复杂的字体衬线和更大的尺寸,需要我们为宽带连接不畅的用户提供基于文本的「相似版」logo。但新的 logo 则缩减了文件大小,避免了这种被迫的解决办法;而当我们面向用户,想要让 Google 更加接近他们、更加便于他们使用时,产品的一致性也可以得到完全的发挥。
超越设计
设计只是我们努力中的一部分而已,新标识的实现需要集体的努力以及上百位不同职能的 Google 员工的智慧。为了建设并实施这个最新的像素系统,他们值得充分的信任。
因为 Google 一直致力于创造新的产品和新的用户体验,我们希望这一次的工作可以传递出你想要在 Google 看到的、感受到的简洁与乐趣—无论新的科技将会把我们带向何处。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 199,519评论 5 468
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 83,842评论 2 376
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 146,544评论 0 330
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 53,742评论 1 271
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,646评论 5 359
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,027评论 1 275
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,513评论 3 390
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,169评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,324评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,268评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,299评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,996评论 3 315
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,591评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,667评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,911评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,288评论 2 345
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 41,871评论 2 341

推荐阅读更多精彩内容