Material Design，中文名：材质设计，是由Google推出的全新设计语言，旨在为手机、平板电脑、台式机和其他平台提供更一致、更广泛的感官体验。Flutter与Material Design的关系密切，Flutter框架中有一个Material Design风格的Widget库，而且这个Widget库也是Flutter的重要组成部分。但是Material Design不仅仅应用在Flutter应用程序中，从2014年开始，从Android到衍生的Android Wear、Auto和TV中，Material Design贯穿其中，成为勾通不同平台、设备的灵魂，让用户在不同平台上也有连贯的体验。

Material就像是理性空间和运动系统的统一理论，Material根植于现实触觉，来源于对纸和油墨的研究，加上技术性的提升，也加入了更多不可思议的想像力。

以上是Google对Material Design的表述，大致可以描述为基于现实世界的纸和油墨，但并不局限于这些元素在现实世界的表现。

在Material Design的设计思想里，纸是所有元素的载体。但是和现实世界的纸不同的是：

• 纸可以自由伸缩，还可以改变形状。
• 纸不会突然出现，通常是以动画形式出现，例如大小变换、滑动位移。
• 两张纸的边缘发生碰撞时会互相推动。
• 一张纸可以分成两张纸，也可以是多张纸合成一张纸。
• 纸不能从另一张纸的中间穿过，但是可以从其表面滑过。
• 纸的x、y轴尺寸是可变的，z轴则是固定为1dp的厚度。

Material Design世界的纸

纸有固定的厚度，并且可以从另一张纸的表面滑过。说明Material Design是三维的，第三维即Z轴，表示纸距离屏幕的远近，这个距离会影响纸的阴影，也决定纸与其他纸在三维空间里的前后关系。

手机屏幕是平面的，没有第三个维度，那么如何在屏幕上实现Z轴呢？使用传统的虚化或遮挡（前面的纸会遮挡住后面的纸）、透视（距离屏幕表面更近的纸显示更大）和阴影（距离屏幕更近的纸会投射出阴影）技术可以实现。

将这些传统的技术结合在一起，你能清晰的看到两张纸之间的距离与大小，而且了解一张纸在另一张纸的前面。

在平面上实现三维空间

阴影是在光源的照射下产生的，Material Design世界中的阴影来自2个光源：主光源和环境光。举个例子，你使用相机给别人拍照，相机的闪光灯就是主光源，周围的其他光源则是环境光。环境光在各个方向制造柔和的阴影，而主光源位于屏幕顶端的中心位置，投射明显的阴影在纸的下方。这种对视觉细节的研究使阴影看上去更加真实。

Material Design世界的阴影

Material来源于对纸和油墨的研究，除了纸，墨水也是Material Design的一个关键要素。Material Design世界的墨水是指纸的颜色和纸上的文本，墨水没有厚度，可以在纸上随意移动、放大或缩小、改变颜色或形状。比如，一张照片可以从略缩图扩展为原图，还可以查看照片细节。

Material Design世界的油墨

交互是应用程序设计中经常被忽略的部分，在用户轻触按钮打开新页面的过程中，按钮会放大、缩小或改变颜色？新页面是滑入还是从旧页面放大？过去，轻触事件常常是以改变背景颜色的形式反馈，在列表中轻触一行时，背景色可能突然从白色变成蓝色。

Material Design的交互要求自然过渡，最典型的轻触反馈就是以触点为中心的涟漪。就像是手指轻轻触碰湖面后，看到水的波纹从指尖向外扩散开来的景色。另外，如果单独的一张纸对轻触作反馈，整张纸会升起来，就像是急切的想和手指相遇一样。

Material Design中动画首先要求流畅，其次是能根据情况对动画加速或减速，就像开车踩油门的时候，速度上升有一个过程。另外，目的也是动画还有一个重点，动画的目的不是让用户惊讶，也不是用来分散注意力，更不是为了使应用更有趣。动画的真正目的是让用户理解前一种状态与后一种状态之间是怎么样过渡的，这样不仅能引导用户注意到关键的元素，还解释了是什么、在哪里发生了变化。