谷歌这款 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 界面，看右上角，内置了五个页面，分别是：
现在，让我们来具体了解 Material Theme Editor 的四个功能。 功能一：颜色 Color
通过该插件我们能够快速对组件中的主色、次级色以及背景色进行全局替换，它还会根据（WCAG）2.0 的规范对你选取的颜色做可视性校准（WCAG是指：Web无障碍指南，能够帮助残疾人士「学习障碍、认知障碍、光过敏等患者」更方便地使用。） 在颜色控制的面板左下角有三个色块，分别对应主色、次及色、背景色的调整。 任意点开一个色块，会弹出另外一个操作面板，在这里可以选取颜色，「Custom」和「Material」 ，可以进行自定义，也可以在 Material 色板库里选取颜色。 这里我有录制一段视频，可以帮助大家更了解具体每一个色块对应调整的组件：
△ 视频链接：https://www.bilibili.com/video/av23926642 可以看出：
功能二：字体 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技巧与插件」
================明星栏目推荐================ 优优教程网： UiiiUiii.com 是优设旗下优质中文教程网站，分享了大量PS、AE、AI、C4D等中文教程，为零基础设计爱好者也准备了贴心的知识树专栏。开启免费自学新篇章，按照我们的专栏一步步学习，一定可以迅速上手并制作出酷炫的视觉效果。 设计导航：国内人气最高的设计网址导航，设计师必备： https://www.muzisucai.com/ 手机扫一扫，阅读下载更方便˃ʍ˂ |
@版权声明
1、本网站文章、帖子等仅代表作者本人的观点，与本站立场无关。
2、转载或引用本网版权所有之内容须注明“转自(或引自)网”字样，并标明本网网址。
3、本站所有图片和资源来源于用户上传和网络，仅用作展示，如有侵权请联系站长！QQ: 13671295。
最新评论
