x

Windows 7 旗舰版下载

微软经典Windows操作系统,办公一族得力助手

立即下载,安装Windows7

下载 立即下载
查看视频教程

Windows10专业版下载

办公主流Windows 操作系统,让工作更稳定

立即下载,安装Windows 10系统

下载 立即下载
查看视频教程

Windows 11 专业版下载

微软全新Windows 操作系统,现代化UI更漂亮

立即下载,安装Windows 11 系统

下载 立即下载
查看视频教程

系统之家一键重装软件下载

永久免费的Windows 系统重装工具

立即下载,安装Windows 系统

下载 立即下载
查看视频教程
当前位置:首页 > windows7教程

解密Google平面设计指南方针

分类:windows7教程   发布时间:2013-06-12 09:35:08

  WWDC 上,苹果发布了万众瞩目的 iOS 7。Ive 带来了全新的 UI 设计,顿时拍砖四起。好,咱先不提“安 X 化”、“扁 X 化”,让我们来看看近期 Google 的一位高级平面设计师在 Behance 上发布的两份不多见的设计指南,清晰地展示了 Google 产品图标的设计细节。
 

  时间回到 2011 年 4 月,Google 联合创始人 Larry Page 接过 Eric Schmidt 的枪,走马上任 Google CEO。他马不停蹄,在上任第一天就宣布将对公司的主要产品重新进行视觉设计——其中包括公司代表性的搜索、地图和邮件。他想让它们改头换面(要知道 Google 从来不以设计优雅著称),但同时他要求产品之间要密切关联,而不是一群风马牛不相及的数字工具扎堆在一起。在此之后我们就注意到 Google 的产品在视觉美感上出现了大幅提升,这还是在基本设计语言不变的前提下实现的。接下来我们就来看看 Google 的平面设计师们是如何做的。
 

  这篇 Guideline 由两份文件组成,主要聚焦于图标设计学。由 Google 高级平面设计师 Roger Oddone 和艺术主管 Christopher Bettig 带领 Alex Griendling、Jefferson Cheng、Yan Yan 以及 Zachary Gibson 等设计师在 18 个月内完成,同时覆盖了与应用图标和 UI 元素相关的宽泛原则以及像素层面的细节。推出这份指南的目的是为了确立一系列即固定又灵活的指导方针——引领 Google 的设计师们为壮大 Google 的身份而奋斗。
 

解密Google平面设计指南方针
 

  其中的第一份文件更让人兴奋,其中详细地阐述了 Google 的产品图标设计。Google 的产品图标设计“简约、现代、易懂,有时略显古怪...... 极度精简、夸张、漫画化”。Google 鼓励设计师们在产品图标设计方面采取“最简化手法”。比方说,在地图图标的设计上,他们会放弃“在地图上方插一根钉”的图标设计,而会鼓励采用“一根钉” 这种更简约的方式。接下来的一章阐述了依照简单几何图形来绘制图标的重要性。

解密Google平面设计指南方针
解密Google平面设计指南方针
 

  接下来的部分与透视法相关。图标需要面向前方,不以立体呈现(仅横竖两根坐标轴),鼓励使用直线硬阴影,而非投影、渐变或是明暗效果。文件展示了所有图标设计中需要采用的颜色的细节——比如 Google 代表色:蓝、红、黄、绿的精确数值。文件中还讲述了 Google 采用的字体,从为小码文本设计的像素完美字体到公司产品名称所采用的默认字体:Open Sans Semi Bold。

解密Google平面设计指南方针
解密Google平面设计指南方针
解密Google平面设计指南方针
 

  介绍完了产品图标设计,接下来我们来看看 Logo lockups(图标和产品名称的组合)——公司把它称作产品的品牌大使。在这一部分明确描述了 Logo lockup 的三个组成部分:产品图标、Google 标识以及产品名称所需要采用的间距、大小和排版规格。比方说,产品名称的字体选择并不是固定的,而是会根据 Google 标识的像素大小产生变化。如果 Google 标识是 60 像素以上(包括),产品名称采用 Open Sans Light 字体,如果是 60 像素以下,产品名称则采用 Open Sans Regular 字体。

解密Google平面设计指南方针

  在 Guideline 的第二份文件中,除了展示了 Google 在产品视频中常采用的扁平化的 Charley Harper 式插图之外,还详细介绍了 UI 设计中图标的比例、大小和填充细节。
 

  两份文件中展示的都是些枯燥乏味的设计细节,但这些看似微不足道的细节正是 Google 之前所忽视的。Google 推出这样的设计指南并不特别让人感到意外,这些大到公司 Logo 小到应用图标的设计标准正是 Google 那些驰骋各大平台的平面设计师们所需要的。但真的很高兴能看到 Google 这样做,这证明了公司正在细微处下功夫。
 

  windows之家点评:google在平面设计上很用心,特别注重细节。可以看出对科技和和技术的严谨性。这个值得我们学习。

有用
+
分享到:
关闭
微信暂不支持直接分享,使用“扫一扫”或复制当前链接即可将网页分享给好友或朋友圈。
热门搜索
win10激活工具
当前位置 当前位置:首页 > windows7教程

解密Google平面设计指南方针

2013-06-12 09:35:08   来源: windows10系统之家    作者:爱win10

  WWDC 上,苹果发布了万众瞩目的 iOS 7。Ive 带来了全新的 UI 设计,顿时拍砖四起。好,咱先不提“安 X 化”、“扁 X 化”,让我们来看看近期 Google 的一位高级平面设计师在 Behance 上发布的两份不多见的设计指南,清晰地展示了 Google 产品图标的设计细节。
 

  时间回到 2011 年 4 月,Google 联合创始人 Larry Page 接过 Eric Schmidt 的枪,走马上任 Google CEO。他马不停蹄,在上任第一天就宣布将对公司的主要产品重新进行视觉设计——其中包括公司代表性的搜索、地图和邮件。他想让它们改头换面(要知道 Google 从来不以设计优雅著称),但同时他要求产品之间要密切关联,而不是一群风马牛不相及的数字工具扎堆在一起。在此之后我们就注意到 Google 的产品在视觉美感上出现了大幅提升,这还是在基本设计语言不变的前提下实现的。接下来我们就来看看 Google 的平面设计师们是如何做的。
 

  这篇 Guideline 由两份文件组成,主要聚焦于图标设计学。由 Google 高级平面设计师 Roger Oddone 和艺术主管 Christopher Bettig 带领 Alex Griendling、Jefferson Cheng、Yan Yan 以及 Zachary Gibson 等设计师在 18 个月内完成,同时覆盖了与应用图标和 UI 元素相关的宽泛原则以及像素层面的细节。推出这份指南的目的是为了确立一系列即固定又灵活的指导方针——引领 Google 的设计师们为壮大 Google 的身份而奋斗。
 

解密Google平面设计指南方针
 

  其中的第一份文件更让人兴奋,其中详细地阐述了 Google 的产品图标设计。Google 的产品图标设计“简约、现代、易懂,有时略显古怪...... 极度精简、夸张、漫画化”。Google 鼓励设计师们在产品图标设计方面采取“最简化手法”。比方说,在地图图标的设计上,他们会放弃“在地图上方插一根钉”的图标设计,而会鼓励采用“一根钉” 这种更简约的方式。接下来的一章阐述了依照简单几何图形来绘制图标的重要性。

解密Google平面设计指南方针
解密Google平面设计指南方针
 

  接下来的部分与透视法相关。图标需要面向前方,不以立体呈现(仅横竖两根坐标轴),鼓励使用直线硬阴影,而非投影、渐变或是明暗效果。文件展示了所有图标设计中需要采用的颜色的细节——比如 Google 代表色:蓝、红、黄、绿的精确数值。文件中还讲述了 Google 采用的字体,从为小码文本设计的像素完美字体到公司产品名称所采用的默认字体:Open Sans Semi Bold。

解密Google平面设计指南方针
解密Google平面设计指南方针
解密Google平面设计指南方针
 

  介绍完了产品图标设计,接下来我们来看看 Logo lockups(图标和产品名称的组合)——公司把它称作产品的品牌大使。在这一部分明确描述了 Logo lockup 的三个组成部分:产品图标、Google 标识以及产品名称所需要采用的间距、大小和排版规格。比方说,产品名称的字体选择并不是固定的,而是会根据 Google 标识的像素大小产生变化。如果 Google 标识是 60 像素以上(包括),产品名称采用 Open Sans Light 字体,如果是 60 像素以下,产品名称则采用 Open Sans Regular 字体。

解密Google平面设计指南方针

  在 Guideline 的第二份文件中,除了展示了 Google 在产品视频中常采用的扁平化的 Charley Harper 式插图之外,还详细介绍了 UI 设计中图标的比例、大小和填充细节。
 

  两份文件中展示的都是些枯燥乏味的设计细节,但这些看似微不足道的细节正是 Google 之前所忽视的。Google 推出这样的设计指南并不特别让人感到意外,这些大到公司 Logo 小到应用图标的设计标准正是 Google 那些驰骋各大平台的平面设计师们所需要的。但真的很高兴能看到 Google 这样做,这证明了公司正在细微处下功夫。
 

  windows之家点评:google在平面设计上很用心,特别注重细节。可以看出对科技和和技术的严谨性。这个值得我们学习。

标签:
googlegoogle平面设计平面设置指南

本站资源均收集于互联网,其著作权归原作者所有,如果有侵犯您权利的资源,请来信告知,我们将及时撒销相应资源。

Windows系统之家为大家提供一个绿色的平台 Copyright © 2013-2024 win10.lianlianwj.com 版权所有 京ICP备14010074号-25 粤公网安备 44130202001061号

微信公众号 公众号

扫码关注微信公众号

扫一扫 生活更美好

微信公众号
客服 客服