Material Design你真的了解吗？

• Material Design是一个统一的系统，它结合了理论、资源和工具来制作数字体验。

---

简介

创造一种视觉语言，将优秀设计的经典原则与技术和科学的创新和可能性结合起来。
允许在不同平台和设备大小之间进行统一的体验。

• 材料是比喻

  
  
  

  例如现实的照明显示接缝，分隔空间，指示移动部件。

基于对纸和墨水的研究的启发而建立在触觉的现实基础上，而技术上的进步释放了想象的空间。

• 大胆，图形，想象力

  
  
  

基于打印的设计的基本元素——排版、网格、空间、比例、颜色和图像的使用——指导视觉处理。这些元素远远超过了眼睛的视觉。它们创建层次、意义和焦点。深思熟虑的颜色选择、边缘到边缘的图像、大规模的字体设计和有意的白色空间，创造了一个大胆而生动的界面，让用户沉浸在体验中。
对用户操作的强调使核心功能立即变得明显，并为用户提供了路径。

• 有意义的运动

运动是有意义的，也是适当的，它有助于集中注意力和保持连续性。反馈微妙而清晰。过渡有效而连贯。

---

空间环境

所有的物质对象都有x，y和z维。
所有的物体都有一个z轴的位置。
主要的灯光会产生方向性的阴影，而周围的光线会产生柔和的阴影。

---

特性

物质具有某些不可改变的特性和固有的行为。

• 物理属性

1. 材料有不同的x和y尺寸和均匀的厚度(z)。
2. 材料投下阴影。阴影在物质元素之间的相对海拔(z位置)自然产生。
3. 内容以任何形状和颜色显示在材料上。内容不会增加材料的厚度。
4. 内容可以独立于材料，但在材料的范围内是尽可展示有限的。
5. 材料是实体。输入事件不能通过材料。
6. 多重物质元素不能同时在空间中占据相同的位置。
7. 材料不能通过其他材料。
   例如，一层材料在改变高度时不能通过另一层材料。

• 形变

1. 材料可以改变形状。
2. 物质在它的平面上拉伸和收缩。
3. 不要弯曲或折叠。
4. 材料可以连接在一起，成为一层材料。
5. 当分裂时，物质可以治愈。
   例如，如果你把一块材料从一块材料中移走，那么材料的薄片就会变成一整张纸。

• 动态

1. 物质可以自发产生或销毁于空间中的任何地方。
2. 材料可以沿着任何轴移动。
3. z轴运动通常是用户与材料交互的结果。

---

海拔和阴影

在物理世界中，物体可以被堆叠或粘在一起，但不能通过彼此。物体也会投射阴影，反射光线。
材料设计反映了这些品质，形成了一种对用户来说很熟悉的空间模型，并且可以在应用中一致地应用。

• 海拔

  
  
  

从一个表面到另一个表面，一个元素的高度表明了表面和它的阴影的深度之间的距离。

1. 静态海拔
   所有的物质元素都有静止的高度。虽然组件在不同的应用程序之间有着一致的静态高度，但它们在不同平台和设备上可能有不同的静态高度。
2. 动态的高度补偿
   动态海拔偏移量是一个构件相对于静止状态的目标提升。

• 阴影

阴影为物体的深度和方向运动提供了重要的视觉线索。它们是唯一的视觉线索，指示出物体表面之间的距离。物体的高度决定了它的影子的外观。

---

好了，本篇我们对Material Design的概念有了一个初步的了解，其核心思想就是将物理世界的体验带入屏幕的方寸之间，下一篇我们会对Material Design的Motion做详细介绍。

每星期至少一篇跟新本系列，感兴趣可以关注。
一起学习，一起进步。

顺便提一句我的个人主页就是Material Design风格的，不信点点看
DuYang_ZXM(https://duyangs.github.io/)

声明本文图片多数取自官网https://material.io/，转载请注明

下一篇：Material Design之Motion