谷歌这款 Material Theme Editor ，让你做设计又快又好！
本篇文章主要是详细介绍 Material Theme Editor 这款工具如何使用，让大家快速熟悉和了解 Google 的这款工具，希望对大家能够有所帮助！
△ Google 官方 Material Theme Editor 的操作视频
一、Material Theme Editor —「一款强大的主题编辑器」
在2018年5月份的 Google I/O 大会上，Google 设计团队一款叫做 Material Theme Editor 工具，可以帮助开发者更轻松地制作既符合自身品牌又符合 Material Design 风格的应用。这款全新的工具可以简化工作流程并提升团队工作效率！
本篇文章主要是详细介绍这款工具如何使用，让大家快速熟悉和了解 Google 的这款工具，或许在工作中能够用的上。
二、简介
简单来说，这是一款能够在 Sketch 上快速生成：基于 Material Design 设计规范的控件库，并且让用户能够最大程度的自定义组件样式的插件！（Tips：只能进行符合 Material Design 规则的更改）
三、下载
下载链接：https://material.io/tools/theme-editor
安装插件后，在 Plugins — Material — Open Theme Editor 中打开。
四、Material Theme Editor操作面板
这就是主题编辑器的操作面板了：
这款主题编辑器有内置四套不同产品类别的主题，其中，Baseline 是 Material Design 基础设计组件主题，另外三个主题是 Google 基于 Material Design 设计语言创造出的不同产品类别的主题。
五、Material Studies
其实 Google 这次有基于 Material Design 语言设计创建了餐饮、旅行、新闻、购物、教育、金融等7款不同产品类别的主题，Google 称之为「 Material Studies 」，链接：https://material.io/design/material-studies/about-our-material-studies.html
在这个网站中，Google 有向你呈现每个主题整体设计思路，从产品架构、布局、色彩、字体排版、图标、组件、动效、设计与品牌的结合度等维度，非常详细，大家可以去看一下，相信会有很多的收获！
Material Studies 是为了向大家展示 Material Design 设计语言的灵活性，证明 Material Design 是可以创建出独特的以及富有表现力的产品的！让你了解 Material Design 并不是一个刻板不变的设计规范，而是能够基于其中的设计理念做非常多创造的设计体系！建议去看一下。
六、Baseline——Material Design基础设计组件库
好，我们打开第一个 Baseline （也就是 Material Design 基础设计组件主题），这个是最常用到的！
打开后会进入 Sketch 界面，看右上角，内置了五个页面，分别是：
- Cover 封面
- Getting Started 入门介绍
- Material Theme 主题库（主要控件、字体、颜色以及示例界面展示）
- Material Components 组件（全部的组件展示）
- Symbols（Sketch 默认生成的组件库）
现在，让我们来具体了解 Material Theme Editor 的四个功能。
功能一：颜色 Color
通过该插件我们能够快速对组件中的主色、次级色以及背景色进行全局替换，它还会根据（WCAG）2.0 的规范对你选取的颜色做可视性校准（WCAG是指：Web无障碍指南，能够帮助残疾人士「学习障碍、认知障碍、光过敏等患者」更方便地使用。）
在颜色控制的面板左下角有三个色块，分别对应主色、次及色、背景色的调整。
任意点开一个色块，会弹出另外一个操作面板，在这里可以选取颜色，「Custom」和「Material」 ，可以进行自定义，也可以在 Material 色板库里选取颜色。
这里我有录制一段视频，可以帮助大家更了解具体每一个色块对应调整的组件：
△ 视频链接：https://www.bilibili.com/video/av23926642
可以看出：
- 主色 — 应用程序栏、按钮、选中样式；
- 次级色 — FAB、底部导航、滑块、单选／复选框；
- 背景色 — 页面背景色。
功能二：字体 Typography
通过该插件，能够设置默认 Font Family，并且能够对每个字体层级设置字重，不过暂时不能修改字体大小，并且字体层级名称不能修改。
△ 视频链接：https://www.bilibili.com/video/av23926503
功能三：图形 Shape
有「Curved」 、「Angied」两个选项，通过这个插件可以全局设置卡片、按钮等的四个角形式，可以自定义直角、圆角或「折角」的形状。
△ 视频链接：https://www.bilibili.com/video/av23926276
功能四：图标 Iconography
Material Design 新推出了多种图标风格（填充，圆角，锐利，描边和双色），能够通过该插件快速下载不同图标风格的 Icons Symbol 以供使用。
这里的功能和官方宣传介绍的不一样，并不是直接点击就可以进行切换，而是会自动为你下载 icon 的 sketch 文件。
那难道不可以快捷更换 icon了吗？不，还是有办法的！
△ 视频链接：https://www.bilibili.com/video/av23926183
这是我在 sketch 中新建了一个页面，用组件设计了三个页面，当你点击任何一个组件的时候，右侧会出现快捷操作栏让你更改组件，分类很详细，点开「icon」可以看到五种风格的 icon 都在里面，选择就可以快捷替换了，而且还可以更改 icon 的颜色，还是很方便的。
总结
Material Theme Editor 这款主题编辑器的功能我已经介绍完了。
总的来说，Material Theme Editor 还是一款让人比较惊喜的工具，会简化我们的工作流程并提升团队工作效率。它也表明 Material Design UE 设计工具已经全面转向 Sketch 了！
欢迎关注作者的微信公众号：「野驴少女」
「提升效率的Sketch技巧与插件」
- 《新版抢先看！Material Design 的7个重大更新》
- 《简单实用！七步学会用 Sketch 搭建复杂表格》
- 《学会这4大Sketch 高阶技巧，让你的效率猛翻10倍！》
- 《6个能大幅度提升 UI 设计效率的 Sketch 插件》
- 《用了这9个最强大的Sketch插件，工作效率提高了一倍！》
================明星栏目推荐================
优优教程网： UiiiUiii.com 是优设旗下优质中文教程网站，分享了大量PS、AE、AI、C4D等中文教程，为零基础设计爱好者也准备了贴心的知识树专栏。开启免费自学新篇章，按照我们的专栏一步步学习，一定可以迅速上手并制作出酷炫的视觉效果。
设计导航：国内人气最高的设计网址导航，设计师必备： http://hao.uisdc.com
