在2014年的Google I/O大会上,谷歌发布了Android L即Android 5.0,并推出Material Design,重新统一了谷歌的设计语言,确立了谷歌设计的未来发展方向。
Material Design字面之意为“材料设计”,但是IT之家更愿意将之翻译为“本质设计”,顾名思义,这是一种考虑事物本质的设计,将显示屏里的各种UI元素看成是一种不存在于现实世界的新的物质,并赋予它物理特性,因此Material Design并不是去拟物化的设计,可以称之为抽象化设计。
时至今日,Android系统已更迭到7.1版本,再提起Material Design似乎有些过时了,但是我们不妨重新温习一下这种设计语言,再回看谷歌利用这种设计理念所创造出的后代系统,似乎会品尝到不一样的滋味。
Material Design的特点主要体现在以下几个方面。
1、模拟纸的形态:交互更有空间感、层次感
我们都知道一本书里每一页纸之间在空间上是相互独立的,但显示屏上的所有内容都在一个平面上,虽然没有立体空间,但信息内容却是有空间层级的关系。
Material Design引入了z轴的概念,z轴垂直于屏幕,用来表现元素的层叠关系,将之具体化就是把纸张的特性挪到显示屏里,把信息内容呈现在虚拟的纸上,“纸”与“纸”之间有上下层级关系,用阴影模拟纸张的空间感,阴影会随着纸张的空间关系而改变大小
另外,iOS的UI模糊效果从本质上来说与Material Design的纸张设计是相类似的,通过模拟景深的效果来表达内容信息的层级关系。
2、字体:字重区分细致
Material Design所采用的字体有详细的笔画的粗细(字重)区分,英文字体名为Roboto,中文及日韩文名为Noto。
Roboto有6种字重:Thin、Light、Regular、Medium、Bold和Black。
Noto有7种字重:Thin, Light、DemiLight、Regular、Medium、Bold和Black。
3、大面积色块,大插图:视觉感和谐,冲击力强
过去的Android多采用灰色、黑色等深色系,让人有冰冷科技感,同时也容易产生一种距离感。而Material Design采用了与过去相反的做法,在系统里大面积地使用鲜艳的色块,用色块来突出主要内容和标题,让界面的主次感更佳突出,也让原本的界面拥有了时尚和活力。
色块的颜色选择多使用饱和度高、明度适中的颜色,整体拥有比较强烈的视觉冲击,但并不会太刺眼,Action Bar状态栏也同样从过去的灰黑颜色改为彩色,并且让状态栏与之融为一体,这点与iOS的设计非常相似。
Material Design常采用一张与屏幕等宽,纵向占据半个屏幕左右的大图,状态栏悬浮于图片之上,后续也有一些应用(例如淘宝)跟进这样的设计,但并没有大面积流行起来。
4、图标,FAB和无边框按钮:简洁直观
Material Design图标多采用简约的折纸效果,通过扁平色彩表现空间和光影。
小图标也仅通过单色点线或文字来表现。
在Material Design里,最引人注目的可能就是就是那个淘气的圆形小按钮——FAB(Fixed Action Button)按钮。
本文来源:不详 作者:佚名