纸墨晕开的灵感 初探Material Design

PChome | 编辑: 李晨 2014-07-08 05:00:00原创

纸墨晕开的灵感 初探Material Design

在今年的谷歌I/O大会上,开发者工程师们所关注的可能是API和数据调用方面的事情,普通消费者关注的可能是那一堆出现在不同屏幕上的Android系统,而设计师们关注的方面则和以上两个群体都有不同,而谷歌推出的全新设计语言——Material Design。

Material Design被来自智利的设计大师Matias Duarte和他的团队一手推动,根据Matias的说法,Material Design最初的想法来自于卡片设计的背后思考,卡片是一个浮动的元素,是有边框限制的,所以在屏幕中并不会撑满整个屏幕,那么在空余的地方,卡片的背后究竟是什么呢?这个想法引起了Matias团队的思考,如果来思考卡片的背后是什么。

关于卡片的阴影使用

不妨先把卡片想作是现实中真正存在的物体,那么卡片的背后,就可能是一些铺开的东西,让卡片能够平铺在上面。这样的话,他们想到了纸张,纸张铺在卡片的背后,卡片在上面变化。这样一来,模拟到现实的世界里,卡片就必须遵守一些现实中的物理规则,比如卡片不能凭空消失而是要被移除,卡片缺少空间不能翻转显示等等。之后,他们还吸取了来自于墨水的灵感,让整个设计看起来非常的灵动活泼。

Material Design的层级理念

纸张和墨水是Material Design的灵感来源,经过一些细节上的规定和思考,Material Design的基础框架被定了下来。这是一个不能被简单的称为Flat Design(扁平化设计)的设计语言,和iOS 7去掉了高光阴影采用了大量的色彩渐变不同,Material Design非常注重阴影的表现,阴影的加入在于表现出层级的效果,Material Design具备着层级的概念,也就是空间上的Z轴,所有元素在空间上有一个远近上的堆叠,阴影的使用会让被选中的元素产生浮动的效果以及上下层级的逻辑顺序。其实在iOS上也有着Z轴的概念,在iOS 7的系统中使用了大量的毛玻璃效果,毛玻璃效果区域会透出下面一层颜色,这就是iOS所表达出的Z轴概念。

Material Design下的程序

丰富大胆的色彩运用是Material Dsign的特点之一,它是多彩的,就如同谷歌的logo一样,多元化、活泼、大胆以及富有活力,在谷歌的官网上的设计页面中也给予了很多关于颜色搭配方面的指导。

动效是Material Design另一个注重的地方,从谷歌官方的演示视频来看,动效的使用可以说是Material Design的半个灵魂所在,如何能体现出墨水灵感的所在?这里就需要依靠动效来实现了。在我们现实的世界中,墨水在纸张上侵染的过程中有一个从接触点晕开的效果,而Material Design所追求的就是这样一种效果。在屏幕上进行点击的时候,会有以点击的地方向周围扩散的动效,整个过程如行云流水一般流畅。

应该这样

不该这样

虽然Material Design整体看起来是非常简洁的一种设计语言,但也正是如此才非常的考验设计师的功力,不过Matias的团队为了加强这种设计语言的规范,也在很多细节之处做了诸多的限制,比如同一组物体的飞入动画要从同一个方向进来,消失的动画要有一定的时间差等等,Matias也说到:“设计是在限制之内做事,没有限制那不叫设计是艺术”。但显然谷歌并不想做一个艺术家。

未来的谷歌将迎来设计的统一

在未来,谷歌的几乎所有产品都会统一在Material Design之下,这个愿景显然是十分美好而且理想的,但对于谷歌而言,最难得事情不是创造而是坚持,谷歌很喜欢去推翻自己过去的东西,无论是产品还是设计语言,对于谷歌来说都是一样的,比如从Android 3.0开始到后来的Android 4.4,其设计规范一直处于一个变化之中,Material Design究竟能在谷歌坚持多久,这点值得让人期待。

Material Design

关于Material Design的更多内容可以上www.google.com/design进行浏览。

相关阅读

每日精选

点击查看更多

首页 手机 数码相机 笔记本 游戏 DIY硬件 硬件外设 办公中心 数字家电 平板电脑