基本元素 material design文档里的每一种元素都被描述得很详细,从如何创造它们到放置于屏幕的哪些位置。你简直难以想象它有多细致。(准确的说这个列表包括19个组件) • Bottom sheets 底部控件 • Buttons 按钮 • Cards 卡片式 • Chips 纸夹式 • Dialogs 对话框 • Dividers 分隔式 • Grids 网格线 • Lists 列表 • List controls 列表控件 • Menus 菜单 • Pickers 选择器 • Progress and activity 进度条 • Sliders 滑块 • Snackbars and toasts 快闪条 • Subheaders 小标题 • Switches 开关 • Tabs 选项卡 • Text fields 输入框 • Tooltips 工具提示 (译者注:想更加详细了解这19个控件的具体内容,推荐可乐橙的material design学习笔记: http://colachan.com/post/3416 。) 喜欢这些控件的设计师可以下载一个Photoshop的矢量文件,它包含所有元素以及安卓的系统图标,这个贴片集 附带各种样式并遵循文档建议的网格系统。 可用性和互动性 “一个产品的易用性在于所有人(不论理解能力高低),都能够浏览它,理解它,并能用它来实现他们的目标。因此,一个真正成功的产品应该对尽可能广泛的受众易用。” Material design文档通过一个非常有用的方式让我们对交互性模式,可用性模式,以及可访问性问题上开了眼界。虽然实际的美观性对经验丰富的设计师来讲是必不可少的,但可用性和交互性的概念也需要引起重视。 它的交互模式部分特别有用。它详细介绍了一系列想法,即让一些元素通用于整个设计。(试想一下,比如如何输入时间或日期,或搜索功能怎样工作。)这些是用户期望使用到的一些最基础的工具,并且这些工具如果能以特定的方式为所有用户们发挥作用,无疑是有益的。 易用性则是另一个重要问题,material design文档为易用性提出并提供了更好的选择。想一下,那些可能没有办法通过声音或颜色与web进行交互的用户,那些没有高对比度大屏幕、没有屏幕只能语音控制、甚至没有所有这些条件呢?这样的用户其实也占了相当大的比例。 10个Material Design 资源: Material Design 在各处流行了,从谷歌上你可以找到大量的可下载资源和利用方法。这里我们为你收集的一些资源将会帮助你更好地探索Material Design的概念。 1. Google layout templates (谷歌布局模式<移动端,平板,桌面框架>) 2. Material design for Bootstrap(基于Bootstrap的Material Design) 3. Angular.js Material Project(Angular.js的Material项目) 4. Polymer Designer(Polymer 设计师) 5. Materialize Front-End Framework(Material化前端框架) 6. Material color palette(Material 色板) 7. Material Interaction(Material 交互) 8. Material design on Android checklist(安卓上的Material Design清单) 9. Material design Sketch template(Material Design 的Sketch 模板) 10. Free material UI kit(免费的Material 组件包) |