社交账号登录

社交账号登录

0/34

上传头像

拖拽或者缩放虚线框,生成自己满意的头像

头像

预览

忘记密码

设置新密码

Material Design: Google 向纸墨学了什么?

设计

Material Design: Google 向纸墨学了什么?

李如一2014-06-29 07:13:35

这不像我们熟悉的 Google,但它是一个我更乐于见到的 Google。它不再死守好听不中用的「开放」与「自由」等口号,开始从眼睛看得到的地方增强对 Android 的控制。移动互联网走到第七年,苹果与 Google这两大旗手在设计上终于殊途同归。

一向被视为只懂工程,不懂设计的 Google,在今年的开发者大会 Google I/O 上要咸鱼翻身了。

在长达两个半小时的 Google I/O 主题演讲里,Google 提出的全新设计理念「Material Design」无疑是最大亮点。智能手表、与汽车的整合、手机和 Chromebook 的协作(类似苹果 iOS 8 的 Handoff)、语音输入的进一步扩散……这些新功能并不令人兴奋,反而产生了既视感:要么猜到了,要么之前在别家产品中看过了。但是,以 Material Design 为本的那一整套框架和示范,让 Google 头一次完整地显露出设计野心。

有必要说明一下 Material Design 与 Google Design 的区别:前者是 Google 倡导的设计理念,后者则更像一个综合名称与品牌。由 Google 倡导,以 Material Design 为方法论,做出来的一套横跨智能手机、平板、web、汽车以及可穿戴设备的整体 UI 风格,就是 Google Design。之前坊间用「Android Design」来指代 Android 系统的设计风格,只是一种方便提法:关于这套风格的正式页面上并没有把 Android Design 当做一种「风格」提出。这次 Google 以 Google 代 Android,也是其不断收紧对 Android 的控制权的体现。

Material Design 中的「Material」指的是可以摸得着的实体物材,而这也是 Google 此次设计改版最令人意外之处。极少做硬件产品、贯彻数字本位态度的 Google ,高调宣称要在面向屏幕的设计中引入实物质感,甚至在 Material Design 的宣言书(注:PDF 文件)里写明了这套风格源自他们对于纸张与墨水的研究。

假如在 Google I/O 2014 之前,有好事者跳出来说「 Google 的设计太差了,他们应该多研究纸张和墨水,向传统平面设计学习」,一定会被群起而攻。在数字设计领域,旧不如新是政治上最正确的态度。不要拟物、不要以为把平面设计的美感搬到屏幕上就是好设计、数字媒介要有自己的审美和趣味……坚定地站在这条队列中的人,往往对 Google 的设计有相当的好感,也往往是最猛烈抨击 iOS 拟物化的那一群。可是如今, Google 的设计大总管马提亚·杜华(Matías Duarte)居然在 I/O 大会上公开宣称「我们有向纸墨学习」。 Google 终于背叛了数字本位精神,要向那个数字原住民心中不能提的词——拟物——靠拢了?

可是 Google 究竟向纸墨学了什么?在目前已经发布的 Material Design 设计成果里(例如 Android L 的预览版、Google Design 页面),我们确实看到了 Google 反复强调的对阴影的使用。但除此之外,几乎没有任何元素可以为反拟物原教旨主义者提供口实。而阴影又如何?iOS 7 的确几乎干掉了阴影,但 Mac OS X 直到目前尚未正式发布的 10.10 版(Yosemite)都依然保留了窗口阴影。阴影和缝线皮革、牌桌绿绒布(iOS 6 里的 Game Center)等「拟物重犯」完全不能相提并论,即便是再讨厌拟物元素的人,相信也不会仅仅因为一个窗口投下了阴影而掩鼻。

只要我们能够穿透那份必将被广泛传播的 Material Design 宣言,直接面对 Google Design 的设计成品,就会发现 Google 还是 Google 。他们向纸张学习,但并没有使用纸张纹理(例如 iOS 7 上的 Notes 软件);他们向墨水学习,但那只不过体现为按下某些按钮时、以点按处为圆心向外迅速扩散的纯色动画——我担保它不会让你想到墨水或水墨(两者在英文里是一个词)。如果你喜欢无纹理、无高光、长得不像实体按钮的按钮,新的 Google 设计不会令你失望。

今年的 Google I/O 和苹果 WWDC 的共同主题是不同平台、不同设备之间的整合。这里的整合并不是指公司战略,而是指那些直接面向用户的功能。可穿戴设备,以及移动设备和汽车的整合尚未普及,谈来为时尚早。但对于电脑、智能手机和平板这三者的整合,苹果和 Google 都交出了各自的答卷。无疑,由于 Android 的硬件并不由谷歌控制, Google 对于这种整合的完成度始终会比软硬件全都自己掌控的苹果逊色。但 Google Design 所倡导的「一套设计语言,多个平台」,也体现出了 Google 对于作为平台的 web 的持续信心与推进。

下面这张 Google 做的示意图可以很好地说明其「一套设计语言,多个平台」的构想:

在宽阔的屏幕上用卡片呈现信息,但当同样的信息出现在屏幕较窄的手机上时,则改用无边框设计。新出现的鲜艳圆形按钮(Google 称之为「悬浮动作按钮」)压在两个视觉区域边缘,令整体效果显得灵活跳脱。但当它出现在手机上时,则回归到最常出现的角落。这一切都只是弹性设计(responsive design)的入门级知识,但要用一套具体而微的规则统合碎片化如此严重的 Android ,不得不说是一种魄力。

的确,细读「Google 设计则例」(Google Design Guidelines),会发现 Google 为设计师定下了无比具体的规则。对于每一种设计元素,Google 都以实例向第三方设计师说明了「应该怎么做」和「不要怎么做」。对「卡片」的说明中有这样一句:

请勿将信息写在卡片背后并翻转显示。

翻转卡片,显示背后的信息,可以说是相当常见的 UI 技巧,但 Google 生生把它禁掉了。这不像我们熟悉的 Google ,但它是一个我更乐于见到的 Google 。它不再死守好听不中用的「开放」与「自由」等口号,开始从眼睛看得到的地方增强对 Android 的控制。 Google 设计则例里的规则是明确、清晰、可执行的。这也是中国古代建筑中「则例」的用途:列出用来建造房屋的各项元素的名称、特性与规格,并说明其用法。和苹果的「iOS 人机介面则例」(iOS Human Interface Guidelines)一样, Google 设计则例是一本供设计师随时翻查的工作手册。

讲到这里,人们不禁要问:第三方 Android 设计师社群会不会愿意遵循这套规则?iOS 与 Mac 人机介面则例之所以有效,是因为苹果从 1980 年代就开始用则例对第三方软件的 UI 设计进行规范。在图形介面尚属新生事物的当年,一份具体而可执行的则例是设计师们的苦海明灯,不用力推大家也会主动遵守。到了今天,虽然各种高度定制的 UI 在 Mac 和 iOS 上也屡见不鲜,但整个 Mac / iOS 第三方设计师社群仍然有阅读和参考则例的习惯。相反,一向处于三不管状态的 Android 社群直到近年才有了人称「Android Design」的设计规范,但这并不妨碍各家厂商于种种理由自行发明林林总总的信息架构、UI 形态与交互方式。新版 Google 设计有没有号令诸侯的魅力,是未来两年值得观察的问题。

无论如何, Google 这次的表现是受设计师欢迎的,而这家工程传统深厚的公司对于设计的人文维度的认可也令人感到欣慰。Google 在其 Material Design 宣言的开头说:

我们向自己提出了挑战:如何为用户创造一种视觉语言,结合好设计的经典原则与科技提供的创新可能性?

毫无疑问,这正是乔布斯那句名言「技术与人文的十字路口」的另一种表述。移动互联网走到第七年,苹果与 Google 这两大旗手在设计上终于殊途同归。

喜欢这篇文章?去 App 商店搜 好奇心日报 ,每天看点不一样的。