原文链接: Material Design
引言
我们挑战自我，为用户创造了一种视觉语言，综合了好设计的经典原则，革新以及科技的可能性。这就是material design。这份说明是一个动态的文档，会随着我们持续开发material design的原则和特性而更新。
内容
目标
创造一种视觉语言，综合良好设计的经典原则，革新以及科技的可能性。
开发一个单一的底层系统，提供跨平台和设备尺寸的统一体验。移动性是根本，但触摸，语音，鼠标和键盘都是第一层级的输入方法。
原则
- Material 是一种隐喻
Material的隐喻是关于合理化的空间和系统化的操作的统一理论。 Material扎根于可知觉的现实中，受到对纸和墨的研究的启发，然而在技术上是先进的，同时对想象的魔力开放。
Material的表面和边缘提供了立足于现实的视觉线索。对熟悉的触觉属性的使用，帮助用户快速理解功能可见性。然而Material的灵活性还创造了一种新的功能可见性，超越了物理世界已存在的那些，同时又没有打破物理法则。
光线，表面和运动的基调是传达物体如何移动、交互、在空间中存在及其相互关系的关键。现实风格的光线显示出缝隙，区分开空间，指示出可活动的部件。
- 大胆的，形象的和故意的
基于印刷体的设计排版的基础元素，如网格，空间，比例，颜色和由意象引导的视觉处理，这些元素所能做到的远远不止愉悦眼球。它们创造了层级，意蕴和焦点。深思熟虑的颜色选择，边缘间的意象，大比例的排版和有意的留白创造了一种大胆而形象的界面，让用户沉浸于使用体验之中。
对用户行为的强调使得核心功能立刻可见，为用户提供了路标。
- 动作提供了意义
动作尊重和强化用户作为主要移动者的地位。最初的用户行为是开始动作的转折点，转变着整个设计。
所有的行为都在单一环境中发生。客体在不打断用户体验的持续性的情况下呈现给用户，即使它们在转换和重组。
动作是有意义的和合理的，为集中注意力和维持持续性服务。反馈是微妙但清晰的。转换是有效而连贯的。
什么是Material？ —— 环境
内容
3维世界
Material环境是一个3维空间，这意味着所有的客体都有x、y和z轴的尺度。z轴与显示平面正交，正的z轴方向向观察者处延伸。每一片Material占据z轴上的一个单一位置，并有一个标准的1dp厚度。
在网页上，z轴是用来分层而不是透视。3维世界是通过操纵y轴而模仿出来的。
光线和阴影
在Material环境中，虚拟的光线照亮了整个场景。关键的光线创造出有向的阴影，同时环绕的光线创造出全角度的柔和阴影。
在Material环境中，阴影是由两种光源投射出来的。在Android开发中，当z轴上不同位置的material挡住光源时，会产生阴影。在网页上，阴影仅通过操纵y轴位置描绘出来。下面的例子显示了一张高度为6dp的卡片产生的阴影。
什么是Material？ —— Material的性质
Material拥有特定的不可变特性和内在的行为。理解这些特质会帮助你用与Material设计相一致的方式来操控Material。
内容
物理属性
Material有不同的x和y轴尺寸(用dp衡量)，和统一的厚度(1dp)。
-
Material的高度和宽度可以不等。
-
Material的高度应该始终是1dp。
Material会投射阴影。
阴影是由Material元素之间的高度差(z轴)自然的造成的。
-
阴影描述了Material元素间的相对高度。
-
永远不要通过给Material着色来近似估计阴影。
内容在Material上显示，可以是任何形状或颜色。内容不会给Material增加额外的厚度。
- Material可以显示任何形状和颜色。
内容可以独立于Material运作，但被限制在Material的边界之内。
- 内容的行为可以不依赖Material的行为。
Material是立体的。
输入事件不能穿过Material。
-
输入事件只会影响前台Material。
-
输入事件无法穿过Material。
多个Material元素不能同时占据空间中的同一点。
-
使用高度来区分不同的Material元素是一种防止多个Material元素占据空间中同一点的方法。
-
多个Material元素无法同时占据空间中的同一个点。
Material不能穿过另一个Material。
例如，当改变高度时，一片Material不能穿过另一片Material。
- Material不能越过另一个Material。
Material的转换
Material可以改变形状。
- Material可以改变形状。
Material可以沿着它所在的平面变大或缩小。
- Material尽能沿其所在平面变大或缩小 。
Material永远不会弯曲或折叠。
- Material永远不弯曲或折叠。
多片Material可以合并到一起变成一片Material。
- 多片Material可以合并成一片。
当分割时，Material可以恢复。例如，如果你去掉一片Material中的一部分，该片Material会再次变成一整片。
- Material可以分割和重新恢复完整。
Material的移动
Material可以自发的在环境中的任何地方产生或者销毁。
- Material可以自发的产生或者销毁。
Material可以沿着任何轴移动。
- Material可以沿着不同的轴移动。
z轴的运动典型来说是用户和Material交互的结果。
- z轴的运动由用户交互引起。
什么是Material？ —— 高度和阴影
在Material Design中的客体拥有和物理世界中的客体类似的性质。在物理世界中，物体可以堆叠或者粘贴到另一个物体上，但不能穿过别的物体。物体可以投射阴影和反射光线。
这些性质组成了用户熟悉的空间模型，可以跨不同应用一致的使用。高度和阴影的概念可以巩固这一空间模型。
内容
高度(Android)
高度是指相对深度，或者沿z轴的两个表面之间的距离。
说明：
-
高度的计量单位和x、y轴一致，典型来说是用密度无关像素(dp)。因为Material元素拥有厚度(所有的Material都是1dp厚)，高度的测量方法是从一个表面的顶部到另一个表面的顶部。
-
子对象的高度是相对于父对象的高度来说的。
静止高度
所有的Material对象，不论其尺寸是多少，都有一个静止高度，或者说不变的默认高度。如果一个对象的高度被改变了，它应该尽快地会到其默认高度。
组件高度
-
组件类型的静止高度应该是跨应用一致的(例如，FAB的高度不应该在一个应用中是6dp而在另一个中是16dp)。
-
组件在不同的平台中可以有不同的静止高度，这依赖于环境深度(例如，电视比手机或电脑的深度大)。
响应深度和动态深度偏移
有些组件类型拥有响应高度，意味着在响应用户输入(例如触摸或按下)或系统事件时，它们的高度会改变。这些高度的改变通过动态高度偏移一致的实现。
动态高度偏移是组件移动的目标高度，相对于组件的静态状态来计算。它保证了对不同的操作和组件类型，高度的变化是一致的。例如，所有按下时会抬高的组件，相对于它们的静态高度来说都会有同样的高度变化。
一旦输入事件完成或被取消，组件会回到它的静态高度。
避免高度干扰
拥有响应高度的组件，当它在静态高度和动态高度偏移之间移动时，可能会遭遇其它的组件。因为其它的Material不能穿过其它的Material，组件应该避免以任何方式干扰其它组件，不论是针对单个组件来说还是使用整个应用的布局。
在组件水平上，组件可以在它们引发干扰之前移动或者被移除。例如，一个浮动操作按钮(FAB)可以在用户选取一张卡片时消失或者移动到屏幕后，或者在snackbar出现时移开。
在布局水平上，设计你的应用布局，让发生干扰的机会最小。例如，将FAB放置在卡片流的旁边，这样当用户视图挑选一张卡片时，浮动操作按钮不会干扰。
-
24dp: Dialog, Picker;
-
16dp: Nav drawer, Right drawer, Modal bottom sheet;
-
12dp: Floating action button(FAB-pressed);
-
9dp: Sub menu(+1dp for each sub menu);
-
8dp: Menu, Card(picked up state), Raised button(pressed state);
-
6dp: Floating action button(FAB-resting elevation), Snackbar;
-
4dp: App Bar;
-
3dp: Refresh indicator, Quick entry/Search bar(scrolled state);
-
2dp: Card(resting elevation), Raised button(resting elevation), Quick entry/Search bar(resting elevation);
-
1dp:Switch.
阴影
阴影提供了关于物体深度和有向移动的重要视觉线索。它们是不同表面间所有间距的唯一视觉线索。一个物体的高度决定了它的阴影。
-
没有阴影，无法表明FAB(floating action button)同背景的表面是分隔开的。
-
锐利的阴影表明FAB和蓝色的薄片是单独的元素。然而，它们的阴影如此类似，这意味着它们有同样的高度。
-
更柔和，更大的阴影表明FAB的高度比拥有锐利影子的蓝色薄片高。
对于动作，阴影提供了有用的线索，来表明物体的移动方向，以及表面间的距离是增加了还是减少了。
-
没有阴影来表明高度，无法确定方块是增加了尺寸还是增加了高度。
-
当物体高度增加时，阴影变得更柔和，面积增大；反之，阴影会变得锐利，面积缩小。
-
一致的阴影帮助用户理解，物体是在改变形状而不是改变高度。
物体间关系
物体层级
在一个应用中，你组织物体或物体集合的方式决定了它们之间如何互相移动。物体可以独立于其它物体移动，也可以被高层级的物体约束着移动。
所有物体都是一个用父子关系来描述的层级中的一部分。每一个这些关系中的“儿子”都是它的“父”元素的从属元素。物体可以是系统或者其它物体的子元素。
父子关系的特性：
-
每一个物体都有一个父元素。
-
每一个物体可以有多个子元素。
-
子元素继承父元素变化的属性，例如位置，旋转，缩放和高度。
例外
父元素是根元素的项目，例如主要的UI元素，会独立于其他物体移动。例如，FAB不会随着内容滚动。其它元素包括：
-
应用的侧边导航抽屉。
-
状态栏。
-
对话框。
交互
物体之间如何交互是由它们在父子层级中的位置决定的。
例如：
-
子元素同它们的父元素间有最小的z轴间距，其它物体不能插入到父子之间。
-
在滚动的卡片集中，卡片之间是同级的，所以它们串联在一起移动。它们都是控制其动作的卡片集的子元素。
高度
你如何决定物体的高度——它们在z轴上的位置——取决于你想表达的内容的层级，以及该物体是否需要独立于其它物体运动。
-
当作为其父元素的薄片滚动时，凸起的按钮（它的子元素）随之一起滚动到屏幕外。
-
当卡片集滚动到屏幕外，它的子卡片随之一起滚动到屏幕外。但FAB保留在原位置因为它的父元素没有滚动。
动画——真实的动作
正如物体的阴影表明了它可能具有的行为，观察一个物体移动可以发现它的轻重，是灵活还是僵硬，以及大小。在Material Design的世界，动作美妙而流畅地表现了空间关系，功能性以及意图。
内容
质量和重量
在物理世界，要移动物体，必须给它施加力的作用。力的强度和持续时间决定了物体能多快地加速，减速或者改变方向。即使最突然的停止和启动都不是瞬时的，因为物体加快或者放慢速度都需要时间。因此，当动画突然的开始，结束或者改变方向，它们会显得不自然。
在Materiald Design中的动作应该包含人们熟知的，真实世界中物体的行为，同时又不牺牲优雅，简洁和美观。
自然的加速和减速
在动画的持续时间中，加速和减速的变化应该是平滑的。
如果为了特定目的要让一个物体吸引注意力，或者给动画增加特性，就让它开始和结束时速度的变化多样化。
- 不对称的加速和减速创造出更自然，更让人愉快的动作。
当加速或减速是不平滑的，移动会显得很机械。速度或者方向上突然的改变是不和谐和引人注目的。
- 避免线性地移动。
进入和退出
物体速度和方向的变化会引起用户的注意。
当物体进入和退出边框时，它速度的改变暗示了它将会移动的距离。例如，当退出时减速会引起注意，并表明物体将会停在框架的边缘。
在转换期间，特别要考虑的是，进入和退出的哪一部分应该得到最大的关注。
-
球速度的改变强调了它到达和离开其静止位置。当球以近似常量的速度进入和退出框架时，注意力是最小化的。
-
进入时加速，退出时减速，会吸引不想要的关注，扰乱用户。
关于easing这一概念
在谈及时间曲线时，理解所用的定义是很重要的。“缓入”和“缓出”的概念在传统动画和UX动画中都用到了，取决于上下文，这些概念有相对的意义。
传统动画
传统动画通过绘制关键姿态来表现一系列的动作。在这一上下文中，缓出指的是离开一个姿态的动作，缓入指的是进入一个姿态的动作。
现代动画工具用“关键帧”来描述这些关键姿态，在这个上下文中，缓入和缓出指的是引入和引出一个关键帧的动作。
UX动画
在UX的语境中，easing指的是状态间的转换。因此，缓入指的是进入一个状态的动作，而缓出指的是离开一个状态的动作。
做出调整
不是所有的物体都用同样的方式移动。更轻和更小的物体可能会移动得更快，因为它们需要的力较小，而大和重的物体可能需要更长的时间去加速。
使用曲线型的动作，避免线性的空间路径。找出你的物体最适合的动作特质，然后相应地描绘它们的动作。曲线代表了在一个特定取值范围内随时间的变化。找出符合你所描述的动作的特性的曲线。