Material Design 初识

MaterialDesign,由Google推出的统一设计语言,旨在为各种平台提供一致的用户体验。它不仅是一种视觉语言,也是设计规范,强调真实物理感与创新科技的结合。核心目标是创建跨平台、多设备尺寸的统一设计系统。

Material Design Infos

  • Material Design,中文名:材料设计语言,是由Google推出的全新的设计语言,谷歌表示,这种设计语言旨在为手机、平板电脑、台式机和“其他平台”提供更一致、更广泛的“外观和感觉”。
  • Google 2014上着重展示的Material Design,以非常高调的方式,宣布了Google Design的存在
  • MD,视觉语言,也是一种设计规范,它所设计的世界,来源于真实的物理现实(降低用户的学习成本,使其快速上手),但又高于现实(大胆而理想,让用户沉浸其中体验)。

Meterial Design 设计的目标

  • 遵循优秀设计的经典定则,同时还伴有创新理念和新的科技。
  • 创造一种独一无二的底层系统,在这个系统的基础之上,构建跨平台和超越设备尺寸的统一体验。遵循基本的移动设计定则,同时支持触摸、语音、鼠标、键盘等输入方式。

设计原则:

  • Material Design不再让像素处于同一个平面,而是让它们按照规则处于空间当中,具备不同的维度。

  • Material Design还规范了Android的运动元素
  • Material Design更加倾向于用色彩来提示。
  • Material Design为了适应多尺寸的屏幕
Meterial Design 基本构成
  • 元素
    • Material design中,最重要的信息载体就是魔法纸片。
    • 纸片层叠、合并、分离,拥有现实中的厚度、惯性和反馈,同时拥有液体的一些特性,能够自由伸展变形。
    • 但是纸片不能穿透、弯折、透视
  • 空间
    • 元素的厚度为1dp(设备独立像素)
    • 元素之间相互层叠
  • 动画(Animation)
    Material design重视动画效果,它反复强调一点:动画不只是装饰,它有含义,能表达元素、界面之间的关系,具备功能上的作用。

    • easing
    • 水波反馈
    • 转场效果
    • 细节动画
  • style

    • 色彩
    • 字体排版
    • 图标
    • 图像
  • 图标

    • 桌面图标
      桌面图标尺寸是48dp X 48dp。
    • 小图标
  • Components

    • 底部动作条
    • 按钮
    • 卡片
    • 纸片
    • 提示框
    • 分隔线
    • …等等…
  • Patterns
    • 内容选取
    • 手势
    • 改进的操作
    • 设置
    • 影像处理
    • 搜索
  • Usability
    • 可达性
  • Resources
    • 布局模版

    • 贴片集

    • 英文Roboto字体,中文Noto

    • 调色板

补充:

下面介绍一款工具

Material Theme Editor

链接地址:

Material Theme Editor

简单来说,Material Theme Editor 就是一个能够在 Sketch 中快速生成基于 Material Design 的设计规范,
并且能够按照你的需求最大程度自定义组件样式的插件。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值