设计原理
设计是一门让人感觉很抽象的艺术。设计需要从两个方面来考虑问题:
- 实用:体现在功能上和交互性上;
- 美观:体现在界面的布局,色彩的搭配,字体的运用上;
对于我们的安卓应用来讲,设计
的目的就是要体现需要显示给用户看的内容的
价值,将用户所有的注意力都吸引到要呈现的内容之上。
对安卓应用来讲,这些内容无非就是:文字和多媒体(视频、图片等等)。
在这里游戏就不是我们讨论的范畴了。
围绕内容,Google为此提出了一套针对于此的设计原则。
Material Design简介
Material Design
是Google专门为安卓应用开发而规定的一套设计语言
。
在Material Design
提出以前,安卓系统当中存在过两种不同的设计风格,每种风格都有暗Dark
和亮Light
两种表现形式。例如,
安卓系统最早问世的时候,界面风格是这样的,
后来在经历到安卓3.0点时候,设计了Holo主题,
需要注意的是,当时这两种风格只能被称作安卓应用的主题,还没有上升到设计语言
的高度。因此当时的应用,交互界面被设计的千奇百怪,拿着安卓手机,打开不同的应用(除了Google原生的应用),感觉很不协调。例如应用A的新建
按钮放在左上角,而应用B的新建
按钮又放在右下角,虽然可以这样设计,但是用户的使用体验不一致。
为了减少这种设计分裂的问题,Google从安卓5.0起,就提出了名叫Material Design
的设计语言
,倡导各位App的设计者,根据Material Design
规范中的建议来开发应用,不要都去自创门派。
这套规范就规定了应用的,
- 实用性-交互方式;
- 美观-布局、配色等等
为了与Material Design
配合,从安卓5.0开始,Google中安卓系统当中增加了Material
主题。因此系统当中形成了原始主题、Holo主题、Material主题三者并存的状态。
从安卓5.0开始,Google强烈建议大家按照Material Design
进行开发了。
![matiaral_theme](http://7xrwhw.com1.z0.glb.clouddn.com/matiaral_theme.png)
当然这个规范也只是个建议,开发者实在不去使用,Google也没有办法
为了让Material Design
的设计规范能容易的被程序开发者实现,Google在开发工具上也给出了相应的支持,从界面布局的设计到控件的使用,都提供了全套的支持。我们讲在后面程序开发的部分,对这些技术支持进行详细的介绍。
Material Design的理念
在Material Design
存在以前,我们已经经历过了拟物设计
。最早的iOS系统就是拟物设计
典型的代表。
![original_design](http://7xrwhw.com1.z0.glb.clouddn.com/original_design.jpeg)
后来出现了扁平化设计
,将以前立体的设计都拍扁,平摊在屏幕之上。
![flat_design](http://7xrwhw.com1.z0.glb.clouddn.com/flat_design.jpg)
后来Google为了保持扁平化设计
简洁,增加交互的立体感,提出了Material Design
。
Material Design
是基于印刷品
的理念来设计的。真实世界中,我们依靠阅读获取大量知识,Google将我们的屏幕想象成印刷着各种内容的载体。书是一页一页的,对应着屏幕上呈现内容的每一个区域,每个内容区域就是一种材质
。它们就像一张张纸片,通过纸片摆放的位置、纸片间的运动,展示应用中不同的功能。
例如,通过两张纸片
通过阴影的效果,反应了它们在3D空间中的位置关系,
![material_relations](http://7xrwhw.com1.z0.glb.clouddn.com/material_relations.gif)
对位于不同层次的一张纸片来说,它的移动不会影响到另外层次的纸片。
因此可以想见,采用Material Design
的应用,界面的层次感应该是呈堆叠状的,
![material_stack](http://7xrwhw.com1.z0.glb.clouddn.com/material_stack.png)
因此我们说MaterialDesign
将扁平化
与位置关系
结合了起来。
Google给Material
-纸片定义了一些基本的特点:
每一张纸片的厚度都是1个单位(就是1dp,dp的概念我们将在后面详细介绍);
纸片之间都有z轴方向上的位置关系,有阴影效果;
纸片上显示的内容是直接印在纸片上的,没有厚度,内容显示的区域限定在这张纸片之上;
纸片上下层关系一旦确定就不能变化了,不允许纸片上下移动时的穿透;
纸片的形状和大小是可以变化的;
纸片不能被折叠
设计的秘诀
当设计师拿到框线图之后,就需要使用Material Design
的设计语言来改造。所以,对于刚接触设计的我们来讲,要首先要学习的就是Material Design
的种种套路。
不要被Material Design
的概念吓唬到,将它分解成我们熟悉的内容,逐个掌握它的设计精髓。
内容的展示
Material
-纸片,是用来展示具体内容的。
这涉及到了,
- 字体的选择、字体大小的设置、文字内容的排列方式。
- 图片的大小区域、展示方式。
逻辑的体现
配色以及纸片的位置关系,是用来体现内容与交互之间逻辑关系的。
这涉及到了,
- 给
material
纸片配色。 - 界面模块的布局方式。
- 系统图标的样式、放置规则。
- 动画效果的设定。
- 声音、震动等辅助效果的使用。
本文是《从设计到实现-手把手教你做android应用开发》系列文档中的一篇。感谢您的阅读和反馈,对本文有任何的意见和建议请留言,我都会尽量一一回复。
如果您觉得本文对你有帮助,请推荐给更多的朋友;或者加入我们的QQ群348702074和更多的小伙伴一起讨论;也希望大家能给我出出主意,让这些文档能讲的更好,能最大化的帮助到希望学习开发的伙伴们。
除了CSDN发布的文章,本系列最新的文章将会首先发布到我的专属博客book.anddle.com。大家可以去那里先睹为快。