haoziboy

四、高度和投影（Elevation and shadows） Material design中的material对象的特性与现实物理世界中的物体特性相似。 在现实物理世界中，一个物体可以叠在另一个物体上面，但是物体间不能相互穿过。同时，物体也能投射投影和反射灯光。 Materia…

五、编排（Choreography） Material的动效能够吸引用户注意力，引导用户关注。 形状变化 合理的编排设计整个动效中形状变化过程。 径向变化的反馈方式 当用户触发某个material对象之时，反馈以径向变化的方式表现（就像水波一样）。 连续性 仔细挑选变化中所涉及到…

二、Icons Material icons使用几何图形直观地来表示其核心概念，功能或主题。 产品icons是一个品牌下产品、服务和工具的一种视觉表现 系统icons则代表一个命令、文件、设备、目录或常用操作。 尺寸 产品icons 48dp，边缘1dp；系统icons 24dp…

第三章节《样式》 一、颜色（Color） Material Design的色彩受大胆活泼的色调启发，并配合柔和的环境，阴影和高光组成。 颜色工具（Color Tool） 颜色工具可以帮助你在UI中创建、分享和使用调色板，以及测试不同颜色组合的可访问（accessibility）级…

第一章节《Material design》 一、介绍（Introduction） 译者注：关于“Material”如何翻译、解释，看看这篇报道。以下是截取部分： 谷歌的设计师们仍旧不愿为这个全新的虚拟物质命名，而这个决定也为他们提供了更多的灵活性，让他们能够进一步加深形而上学神秘…

四、字体与排版 Typography Roboto和Noto是Android和Chrome的默认字体。 Roboto是Android的默认字体。Roboto字体没有完全支持所有语言。 Noto是一个包含所有语言的字体，它是Chrome的默认字体。 文本类型 英文和类似英文的(例如…

第四章《布局》 一、原则 （Principles） Material design基于印刷的设计元素（如排版、网格、空间、颜色和图像等）去创建层次结构、情景含义和视觉焦点，这一切都是为了加强用户体验。Material design 采用印刷设计的基本工具（如通用于所有页面的基础网…

二、动效的持续时间和缓动效果（Duration and easing） 自然、灵动应该是Material动效带给人的第一感觉。要做到这样需要我们使用不同的缓动曲线效果和不同的时间长短去创造平滑、连贯的动效。 缓动曲线（Easing curves） 标准曲线（Standard cu…

三、度量和参考线（Metrics & keylines） 基线网格（Baseline grids） 无论是移动端、平板端还是桌面端上，所有的应用组件都对齐至8dp单位的方形基线网格上。但工具栏中的图则对齐至4dp单位的方形基线网格上。 基线网格的例子 基线网格的例子 文字于4dp…