Material Design 简单概述

移动开发 Android
我们挑战自我,为用户创造了崭新的视觉设计语言。与此同时,新的设计语言除了遵循经典设计定则,还汲取了最新的科技,秉承了创新的设计理念。这就是原质化设计(Material Design)。这份文档是动态更新的,将会随着我们对 Material Design 的探索而不断迭代、升级。

我们挑战自我,为用户创造了崭新的视觉设计语言。与此同时,新的设计语言除了遵循经典设计定则,还汲取了最新的科技,秉承了创新的设计理念。这就是原质化设计(Material Design)。这份文档是动态更新的,将会随着我们对 Material Design 的探索而不断迭代、升级。

目标

我们希冀创造一种新的视觉设计语言,能够遵循优秀设计的经典定则,同时还伴有创新理念和新的科技。

materialdesign-goals

我们希望创造一种独一无二的底层系统,在这个系统的基础之上,构建跨平台和超越设备尺寸的统一体验。遵循基本的移动设计定则,同时支持触摸、语音、鼠标、键盘等输入方式。

materialdesign-goals-cutrectangles

设计原则

materialdesign-principles-layersquares

实体感就是(通过设计方式来表达)隐喻

通过构建系统化的动效和空间合理化利用,并将两个理念合二为一,构成了实体隐喻。与众不同的触感是实体的基础,这一灵感来自我们对纸墨的研究,但是我们相信,随着科技的进步,应用前景将不可估量。

实体的表面和边缘提供基于真实效果的视觉体验,熟悉的触感让用户可以快速地理解和认知。实体的多样性可以让我们呈现出更多反映真实世界的设计效果,但同时又绝不会脱离客观的物理规律。

光效、表面质感、运动感这三点是解释物体运动规律、交互方式、空间关系的关键。真实的光效可以解释物体之间的交合关系、空间关系,以及单个物体的运动。

materialdesign-principles-circleplus_large_mdpi.png

鲜明、形象、深思熟虑

新的视觉语言,在基本元素的处理上,借鉴了传统的印刷设计——排版、网格、空间、比例、配色、图像使用——这些基础的平面设计规范。在这些设计基础 上下功夫,不但可以愉悦用户,而且能够构建出视觉层级、视觉意义以及视觉聚焦。精心选择色彩、图像、选择合乎比例的字体、留白,力求构建出鲜明、形象的用 户界面,让用户沉浸其中。

Material Design设计语言强调根据用户行为凸显核心功能,进而为用户提供操作指引。

materialdesign-principles-flyingsquare

有意义的动画效果

动画效果(简称动效)可以有效地暗示、指引用户。动效的设计要根据用户行为而定,能够改变整体设计的触感。

动效应当在独立的场景呈现。通过动效,让物体的变化以更连续、更平滑的方式呈现给用户,让用户能够充分知晓所发生的变化。

动效应该是有意义的、合理的,动效的目的是为了吸引用户的注意力,以及维持整个系统的连续性体验。动效反馈需细腻、清爽。转场动效需高效、明晰。

译文:http://design.1sters.com/material_design/material-design/introduction.html

原文:Introduction 翻译:iceskysl 校对:siton

责任编辑:闫佳明 来源: design.1sters
相关推荐

2014-08-07 14:19:46

Material DeGoogle

2014-12-08 14:35:51

Material De真实动作

2015-07-21 15:02:37

设计扁平

2014-12-08 15:03:17

Material De图像

2014-12-08 13:40:10

Material De色彩

2014-12-08 14:15:48

Material De字体排版

2017-02-14 13:35:15

AndroidMaterial De动画

2018-04-25 09:06:32

Chrome浏览器语言

2015-08-07 10:24:17

AndroidMaterialDes

2014-10-27 14:18:06

Material De交互响应

2014-09-10 10:35:11

Material De设计原则

2014-08-21 15:40:53

Material De真实动作

2014-08-19 16:10:05

Material DeUI设计趋势

2017-02-20 16:03:35

Android We谷歌硬件

2016-02-02 10:03:15

chromeMaterial De

2022-01-20 20:08:38

MaterialpalettesMaterial 3

2014-08-11 11:19:19

Material De

2014-07-02 10:26:52

Material DeGoogle

2014-08-07 10:13:43

谷歌Material De设计规范

2014-07-22 10:44:21

Material De
点赞
收藏

51CTO技术栈公众号