Google视觉识别系统分析报告我所研究的这一份VI手册来自谷歌公司。2012年，Google高级平面设计师 和艺术主管带领团队，在原有的Google Creative Lab设计的icoiiography style 基础上拓展的一套视觉识别系统，建立起固定的、灵活的指导方针以便谷歌设计 师和销售商更高效工作，增强品牌识别度。这套VI手册分成两个部分：第一-部分是图标和产品名称的组合；第二部分是用 户界面图标和插图。我看来，整个VI系统是就是为了提供统而简约的用户体 验，从菜单到用色，使用同一套设计，以及一个细微乂麻烦的问题：图标或者文 字在最小尺寸11的应用。第一部分详细阐述了 Google的产品图标设计。他们的产品图标设计“简约、 现代、友好，有时古怪”，Google鼓励设计师们采取精致的“最简化手法”，即 使在最小尺寸应用中也能分辨清晰。设计中还提出要使一些普通的产品图标能具 有代表产品特点的能力。系统中通过两种改进图标的方式：简约化。比方说联 系人的图标变得色彩简单，结构单一，图形元索降到最简单的程度，反而提高了 识别力。Cun tot kons与透视法相关。图标需要止面向前，不以立体形式呈现，鼓励使用直线硬阴影, 取代投影、渐变、明喑等效果。文件展示了所有图标设计中需要采用的颜色，如同颜色不同的四个小方块组成的 微软图标，Google也希望培养起大众这样的联想意识。可是对比Google和 Microsoft的色彩，会发现二者很相似。MicrosoftGoogle二者都使用了同样的四种颜色：蓝、绿、黄、红。仔细对比，微软挑选的颜色饱 和度更高，显得更饱满、鲜艳。Google表示新的logo也是其Material Design 材料设计理念的体现，代表着现实世界感，所以饱和度较低。如此，Microsoft 就倾向于表达数字世界了。Google惯用的四色，较有亲和力，但之后的应用中 难免会让人感到幼稚。而且，蓝绿两色在小尺寸的显示中已经有点混在一起了。 回到系统中，图标的色彩有详细的解释，一般就选取厂3个基木颜，在此次基础 上增加灰度。使得图标并不花哨难以识别，又有色彩能分辨，组合在-起也风格 统一。logo lockups被公司称作产品的品牌大使。在这一部分明确描述了 logo lockup的三个组成部分：产品图标、Google标识以及产品名称所需要采用的间 距、大小和排版格式。图标的背景颜色也十分统一，不再花里胡哨。考虑到图标 的最小尺寸，最小的尺寸可能出现在浏览器标签页的title 于是制作图标的 过程中有些小调整，本來，图标的制作是由放大的像素点组合而成的，改进中的 图标去掉了外圈浅蓝色的渐变，将灰色也转化成黑色。可见，系统随时秉持着简 约化的原则。设计师们也做到了，在迷你的空间内，图标仍I口清晰可识别。Logo lockup 以 Google 钱包为例:Color values: 产詁名称的字体选择并不是固定的，而是会根据Google标识的像素大小产牛变 化，Google标识在60像素上下分别才有Open Sans Light字体和Open Sans Regular 字体。W Google WalletRCSRH/GUO bUJHEX75787BCMYKK60PANTONt Cool Gray 9C在指示的第二份文件中，除了展示Google在产品视频中常采用的扁平化的 Charley Harper式插图外,还详细介绍了 UI设计中图标的比例、大小和填充细 节。在交互界而中，谷歌从特色图标、插图和信息可视化三方面来规范品牌统一 性，并且向用户提供了更为便捷的操作方式。同样，在门设计中使用了和产品设计相同的原理最简化，图标被设计成简 单的几何形状拼接，对比可见，原来的图标繁复而且没有统一的特征，写实虽然 容易理解，但给人凌乱、复杂、无章的感觉。一个图标虽然小，但其构图处处都 体现最合理且精致的布局cG) 0像素点制成的 产品一样，去掉 块，适用于最小图标）11,也和 了渐变的色 尺寸。不同于产詁图标,UT设计的色彩应用十分简单，非黑即白加点灰。改进后，Google 的Gms订、Google文档、日历的有了统一的形式感，简约大方、容易辨析。插图的特性符合一贯的设计风格“友好、现代、一点古怪”，但是铺天盖地的扁 平化风格，加上童趣的色彩，使得Google的形象幼稚很多。Google的字体设计一直存在很多争议。Google的logo也经历儿代变迁，为 人熟悉起，Google是衬线字体，四色都采用基色，一直沿用到2010年；Z后两 年,Google去掉了 logo的阴影部分，显得更加明亮;然后顺应扁平化潮流,Google 又去掉了高光部分；除了细微的像素点改变，最大的改动就是直接将字体改成了 非衬线字体，似乎是为了打造一个“调皮”、“年轻”的互联网站牌。Google其实Google的设计跟进不只是顺应潮流，而需要适应各种不同的平台、应用程 序和设备。像facebook或者twitter,在网页标签页都是首字母，rflj且相当具 有识别力，Google以前都是写全称，获取两倍于另外两个logo的视觉注意力。在Google最新的交互界面中,Google全称被一个四色集中的G代替,依旧褒贬 不，有人说像山寨。，空竺好搜心啖搜素 回到门设计中，手册中因为是平而效果没有表达出来动态的设计，但有一点挺 招人喜欢的，就是四种标志色的动态原点，可以表达语音识别中、搜索中、登录 中等等,虽然做法上谈不上独创性,Microsoft就在Win8 使用原点链来表示 载入。不过本來作为标识的四色赋予功能性还是挺有趣的，所以他做到了在表达 丰富的交互体验吋，保持一个强烈的识别。除了交互部分提到的一些手册之外的，我认为这两大部分的VI更新较为着 重的应该就是建立一套规范的尺寸系统，同吋统一化风格，设计上追求简约化、 扁平化c Google作为互联网巨擎，从一开始也不擅长设计，如今看来成长得还 是很迅速。手册中其实可以看出，虽然分成产品图标和交互图标两块，但Google 的重心还是会放在交互上。说到底，产品图标也是为了配合交互设计的，Google 说过往计算机里添加任何一点漂亮的东西，就只会把速度拖慢，只是时过境迁, 速度已不会成为设计的羁绊。也许是原來的产品图标太糟糕，在佩奇的支持下, 一众设计师的磨合下，短短几个月后，邮件、日历、地图和搜索就已全部变得清 爽吋髦，可以提供统一的用户体验了。这些产品不仅变得更干净，而且从菜单的 位置到如何用色的各个方面，它们也终于使用同一套设计原则。而且，为了平息 工程师的牢骚，谷歌进行了大量的用户测试，证明了新设计是成功的。这种对一 致性的强调，后来成为了 Material Design的精髓。我从Google的VI设计中受到最大的启示，不是那些大动干戈的创新，而是他对 于细节的追求logotype、icon相对容易，但应用在用户界面中，在有限的方 寸内，要表达清晰，并具有詁牌识别力和统一的形象其实是很难的，失之毫厘, 差之千里。两份文件中展示的都是些枯燥乏味的设计细节，但这些看似微不足道 的细节正是Google之前所忽视的。Google推出这样的设计指南并不特别让人 感到意外，每一家晶牌都是这样建立规范的，这些大到公司Logo小到应用图标 的设计标准正是Google那些驰骋各大平台的平面设计师们所需要的。但看到 Google这样做，这证明了公司正在细微处下功夫。