当前位置: > 计算机专业 > 平面设计 >

6个动画告诉你GOOGLE的LOGO进化过程

编辑: 时间:2018-04-23 10:53:00 来源:亚洲城ca88_唯一官网官方网站 点击:

小编:谷歌品牌形象的每一次改变都牵动着全世界用户的心,无疑是这家科技巨头的强大影响力所造就的结果。随着较新的谷歌视觉形象的发布,吐槽和赞誉就没有停止过,但是此刻大家不妨将脑洞先填上,看看新设计背后谷歌到底有着怎样的考虑。原文中的视频均被他亲手压制成GIF动画!

7bad5a19gw1evo5ty9kwkg20c808wgw6

GOOGLE并不是一家传统企业。大家的使命是整合全世界的信息,让它们更易于获取并让用户从中受益,并且大家也一直推动着这件事情,不断发展。去年,大家推出了Material Design,让设计师和开发者拥有更强的拓展性,轻松拥抱这个多屏、多设备的世界。因此,今天很高兴能和你们分享大家全新的品牌形象,希翼全新的GOOGLE无论何时何地都能让用户更方便。

自谷歌成立以来,谷歌.com的网页设计一直保持着惊人的简约:古怪而多彩的Logo在一个简单直观的输入框上面,整个页面的背景就是单纯的白色。随着技术的发展,设计开始发生变化,需求和投入也变的越发的多样化。全新的设备类型和多样的交互和沟通方式同可穿戴设备、语音技术以及智能硬件结合到了一起,在大家身周并不鲜见。今天的用户通过一系列不同的设备承载GOOGLE的服务,而大家应当以更为简约而令人愉悦的品牌形象,来回应大家的认可和希望,以新的姿态来拥抱每一个机会和每一块屏幕。

接下来,大家来看看有哪些设计是大家所认可而喜欢的,并推动整个品牌形象向着更加动态而非传统的方向进化。

共同设计

今年年初,来自世界各地的设计师,同GOOGLE的创意实验室与Material Design团队一起,在纽约一同进行了为期一周的设计冲刺活动,大家共同起草了一份简短的列表,确定了大家要解决的四个主要挑战:

1、它需要是一个可拓展性的标识,在有限的空间中传达出完整的信息和形象
2、它需要是一个高度整合的动态形象,将用户交互的不同阶段都整合到一起
3、它需要是一套系统的方法,不仅要便于大家产品的品牌推广,还要确保用户在同GOOGLE产品日常接触时候拥有一致的体验和感受
4、它需要是成就GOOGLE风格的所有元素的精炼,将用户所喜欢所热衷的GOOGLE元素集成到当中,并且随着用户需求的变化而进行提升和调整

g-sprint-1240

于是,大家开始将大家的品牌形象抽象、精炼成较基础的四种色彩,并置于白色的背景上,以为备份。确定了问题,构思被固定在白板上,动画也借由贝赛尔曲线勾勒出来。在上百个小时的设计之后,大家在地板上摆满了不同的设计方案,并且确定了几个令人振奋的设计方向。

大家同整个团队分享了想法,工程、研发、产品和营销的团队参与了测试和可行性分析,并反复推敲了设计方案的部署和策略。这种协作流程带来了一套足够灵活的系统,足以让营销材料和产品应用于任何平台,并将三种不同状态的设计元素融合为一个LOGO。

元素

谷歌 LOGO样式

g-logo-360

确保它是一个包含显著多色彩的无衬线体文字LOGO

g-dots-360

具备互动性、辅助性和过渡性的浓缩的动态形象

谷歌 G

g-letter-360

紧凑版的谷歌 Logo形象

了解这套体系

对于这套体系的思考和设计开发远不止于核心元素这么简单,大家的团队设定了一套规范来确保它的广泛应用性和一致性。下面的示例虽然不完全,但是能够展现出大家系统思考的一部分。

LOGO样式

7bad5a19gw1evo5tyggzsg20c808w7hr

谷歌的LOGO一直保持着简约、友好而平易近人的风格,大家希翼通过拥有高纯度数学特质的几何形象和教科书式的字母形象,来保持LOGO孩子般的单纯特质。新的标识采用了几何风格的无衬线体设计,并且结合了多彩的用色和极具趣味性的旋转(字母e)。

通过在不同的数字环境中进行严苛的测试,大家确定了较终LOGO样式中字体的大小、粗细。为了确保LOGO的屏幕显示和印刷效果,大家所制定的标准涵盖了间距和间隙的规则,产品锁定规则以及产品处理的排除规则等整套规范。

G LOGO的构建

7bad5a19gw1evo5twwllwg20c808wq60

谷歌 G标识的设计来源于字母G的形象,但是为了增加它在小尺寸使用时的视觉重量,需要让它同其他的元素共享空间。这个G字母LOGO的设计和谷歌 Logo所使用的栅格系统相同,由于字母G中间横线的存在,为了在使用四色填充的时候确保整体的视觉平衡感,并且根据眼睛的视觉特征,大家重新调整了色彩的区域和次序。

谷歌 点状动效

7bad5a19gw1evo5txzc8gg20c808w46t

谷歌的点状LOGO一直保持着充满活力的运动状态。它代表着谷歌充满智能的运作方式和为你服务的态度。大家仔细推敲着这些独特而神器的时刻,并且开发出了包含挺、思考、回复、迷惑、理解等不同的动态标识。虽然整个动效看起来是自发而毫无雕饰的,但是实际上它们是遵循一致的路径和相同的变化时间,弧度、长度等几何特征也是遵循着相同的标准。

色彩

7bad5a19gw1evo5tyadurg20c808wn9q

得益于留白,谷歌 LOGO 中不同字母在视觉上看起来平衡而不冲突,但是当这些色彩混合到一起融入字母G LOGO中的时候,视觉上的混合会让色彩看起来会晦暗,所以大家在制作G的LOGO的时候其实是对色彩进行适当调整,确保它看起来活泼而自然。

较终实施

排版

7bad5a19gw1evo5txz3nsg20c808wgwt

为了配合全新的标识,大家还重新制作了一套专门的无衬线字体,方便产品和相关材料中使用。大家将这套字体称为Product Sans。这套字体同样借鉴了教科书字体的印刷风格,不过其中的设计细节更多的还是采用了几何无衬线字体的自然特征。如此一来,大家可以确保谷歌 Logo和产品字体之间的差异和识别性。整套字体中包含了全部的数字、标识符号、拉丁语字母、希腊字母和西里尔字母。

产品

g-voice-flow-poster

谷歌 的整个产品线都会逐步完成新标识的更新升级,不过由于大家对于谷歌的较早接触多为搜索,所以改变将从谷歌搜索开始。搜索UX团队和开发团队目前都在致力于文本搜索和语音搜索的品牌形象更新,由此彰显品牌全面的全面升级。

广泛分布

随着设计和开发相关素材的逐步增加,版本控制和自我服务会逐步扩展到整个代码库。比如像素完美的SVG格式素材,系统会自动生成数以千计的不同尺寸的变体,以满足不同的尺寸、色彩和背景的需求。随后,相关的源代码会控制在一个相对规范的位置,避免重复,并且确保团队成员和产品所使用的是较正确和较新版的素材。

g-low-bandwidth-poster

在这种运作方式之下,大家可以更加快速便捷地在任何地方使用新的素材,想比起之前LOGO 14000字节的大小,新的LOGO仅有305字节。新版的LOGO由于复杂度的降低使得全世界的用户可以更快的加载使用它了。

设计之外

设计仅仅只是大家所付出的努力中的一部分。新的标识让数百横跨不同组织、处于不同工作岗位的谷歌 员工协同工作,而较终的收获也使得这些巨大的投入显得非常有价值。

大家会继续打造更优秀的产品和体验,希翼大家的努力符合你的预期,能让你能更好地使用GOOGLE的服务并获得回报。

原文地址:谷歌 Design
优设译者:陈子木

推荐阅读:

TAG标签:

转载请注明源自亚洲城ca88_唯一官网App官方网站

★www.sxxhce.cn★

------分隔线----------------------------

专业课程

同类热门文章

新濠天地娱乐手机版 新濠天地 新濠电玩城手机版 新濠天地娱乐手机版 新濠电玩城官网下载 新濠天地娱乐官网3559 新豪天地880988.com 新濠天地娱乐官网15969
ca88唯一官网ca88唯一官网|资讯中心|精彩视频|专业设置|官方网站环境|就业保障|名师风采|网站地图|

亚洲城ca88_唯一官网官方网站

地址:亚洲城省西安市北稍门振华北路4号(西安市第十中学东侧)邮编:710014电话:029-82519999

高新校区地址:西安市雁塔区鱼斗路259号

陕ICP备11004055号-3www.sxxhce.cn

亚洲城ca88_唯一官网App官方网站Copyright@2006-2016 www.sxxhce.cn.All Rights Reserved.

声明:任何企业或个人不得以任何商业目的复制或传递本网站所载述的商标、文字、影像及图形图象,分享转载需注明来源本网站

Copyright©2006-2016 Sxxhce.Cn All Rights Reserved.Optimized for 1024x768 to Firefox,MS-IE6 IE7.   版权所有:北京朗杰科技有限企业

XML 地图 | Sitemap 地图