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