Material Design 现在不仅仅是设计指南
jopen 6年前
<p>自 2014 年问世以来，Material Design 已经不仅仅是一套公开的设计原则，它已经成为了包含指南、工具和代码的不断扩展的高适应性设计体系，为全球市场中的应用所用。但是，设计永远没有最终完成的那天。在过去的几年里，Material 团队一直在努力为设计师和开发者面临的常见挑战研究全新的解决方案，团队会手动评阅大家反馈过来的操作困扰，理解定制化操作的需求，以及提供更多的开箱即用的代码。</p> <p><img alt="Material Design 现在不仅仅是设计指南" src="https://simg.open-open.com/show/2ac670fd36b172b1f8bf223528699df5.jpg" /></p> <p>Material 最近更新之后，提供了增强和扩展后的设计指导文档，并提供了新的工具用来解决设计和开发之间的滞后现象，以及多套支持定制的组件，帮助您更快地构建美好的数字体验。通过本文，您将会看到一些全新的强大 Material 新功能，并了解它们可以如何帮助您和您的团队。</p> <p><img alt="Material Design 现在不仅仅是设计指南" src="https://simg.open-open.com/show/92a8bf253b1878ec5df64f71fbb4dac5.jpg" /></p> <p><strong>在最短时间内打造定制外观</strong></p> <p><strong>Material 主题</strong></p> <p>产品团队面临的最常见的困境之一，就是不得不在开发速度和精良设计之间选择一个。Material 新杀手功能 Material Theming (Material 主题) 的目标，正是让鱼和熊掌可以兼得。这个功能可以让任何人都能在自己的产品中系统地表达其独特风格，同时还完美契合 Material 设计规范。您甚至只需要选择一下颜色和字体等基本设定，就可以直接将这些设置快速应用到整个设计方案中。Material Theming 意味着您和您的团队都可以在 Material 按钮、底部表单和导航模式等等各种设计要素里使用相同的且经过实战考验过的稳健代码，同时外观能根据您的品牌个性进行定制和调整。我们自己使用自定义的 Material 主题已经有一段时间了，现在，大家都可以这么做。</p> <p style="text-align:center"><img alt="" src="http://static.open-open.com/news/uploadImg/20180625/20180625081953_744.webp" /></p> <p><strong>让团队协作更加容易</strong></p> <p>每个团队都希望更好地协作，这不光是设计团队或者开发团队各自内部的问题，而是整体的问题。我们准备了三款全新强化后的 Material 工具，旨在简化工作流程，并解决设计和开发过程中常见的痛点。</p> <p><strong>- Material 主题编辑器</strong></p> <p>设计师总是希望多多尝试视觉方案，这几乎是本能。但有时候，您就是不知道某个东西将会拥有什么样的外观，直到您画出来，然后改改，直到自己叫出来 “就是这个”。使用不同的阴影、配色或更多的留白空间。但是对各个设计元素进行单独的样式调整可能会非常单调乏味，并且效率低下，更重要的是很难快速获得全局的视觉感受。在全新的 Material Theme Editor 的帮助下，您更改一个主题设置，它就会在您的设计中自动应用。</p> <p style="text-align:center"><img alt="" src="http://static.open-open.com/news/uploadImg/20180625/20180625081953_670.webp" /></p> <p>Material Theme Editor 基本上是一个事无巨细的控制面板，可让您将全局样式的更改应用于组件颜色、排版和形状。编辑器还提供了教学，指导您完成制作自己的 Material 主题。今年晚些时候我们会发布更多可定制的系统。目前，Material Theme Editor 暂时只支持和 Sketch 配合使用，您只需下载 Material Plugin 即可访问该编辑器。</p> <p><strong>- Gallery</strong></p> <p>“FINAL_final_v2.png”，设计师们都曾经碰到过这种文件名吧 ��。其实我们也知道，跟踪设计更改和反馈是非常烦心的一件事。再也不会是这样了！现在任何人都可以使用 Material Gallery 查看和评论设计迭代。这套工具在 Google 设计师中已经使用多年，现在它向所有人开放了。</p> <p style="text-align:center"><img alt="" src="http://static.open-open.com/news/uploadImg/20180625/20180625081954_452.webp" /></p> <p>Gallery 不仅是一个共享设计的直观平台，当需要写代码的时候，使用 Material Theme Editor 制作 (并上传到 Gallery) 的设计将显示自动生成的评阅，哪个 Material Component 正在被使用，它一直以来都是如何被定制化的等等细节信息。因此，开发者可以立即获得相关资源，并像素级地完美执行出设计意图。</p> <p><strong>- Material 图标</strong></p> <p style="text-align:center"><img alt="" src="http://static.open-open.com/news/uploadImg/20180625/20180625081954_188.webp" /></p> <p>精心打造图标可以增加数字产品的质感和表现力，但是精心制作每个图标也是件非常海量的工作。我们最早的 Material 图标库从第一天起就受到了那些正在寻找优雅的现成解决方案的产品团队的积极评价。现在，即使是这些小小的图标也蕴含着更强大的表现力 —— Material 图标现在有五种不同的主题风格 (基线、圆角、锐利、轮廓、双色) 可供选择。</p> <p style="text-align:center"><img alt="" src="http://static.open-open.com/news/uploadImg/20180625/20180625081955_424.webp" /></p> <p><strong>更多开箱即用的代码，打造更优秀的产品</strong></p> <p><strong>Material 组件</strong></p> <p>之前对 Material Design 的一个普遍批评是，代码和工具支持有时不够强大，因此难以精确和快速地按照 Material 指南来构建产品。现在，借助开源的 Material 组件，您可以对应用设计的关键方面进行自定义，包括颜色、形状和字体主题。我们在 Google 自己的产品里也是用这批组件来完成构建的。更多 Material 组件和 Material Theming 的内容将于 2018 年内发布，随着最新版本的发布，在 Android、iOS、Flutter 和 Web 上实现 Material 将更加容易。由于这些内容更新较为频繁，我们建议每月检查一次我们的更新，确保能及时使用到最新的组件内容。</p> <p style="text-align:center"><img alt="" src="http://static.open-open.com/news/uploadImg/20180625/20180625081955_199.webp" /></p> <p><strong>让 Material 真正为您所用</strong></p> <p><strong>Material.io</strong></p> <p>重新设计的 material.io 网站把设计师、开发者和产品经理放在最优先和最中心的位置进行考虑。新网站有三个主要部分：设计、开发和工具。设计部分包括 Material Theming 的细节，数百个实用 Material 案例 (包括 Material 合作伙伴研究以及针对 Google Material Theme 的深度挖掘) 、评阅和注释，以及更新过的设计指南。开发部分提供了 Android、iOS、Flutter 和 Web 版本的开源组件，以及有关定制 Material 的文档。工具部分则内含 Material Theme Editor、Gallery、主题图标套件等内容。内置工具遍布全站各处，您不费吹灰之力即可找到调色板生成器以及用于挖掘设计细节的注释内容，这些内容从对齐规则到排版尺寸甚至十六进制色值都一应俱全。</p> <p>Material 还会不断发展，以解决产品团队面临的更多问题，简化设计师和开发者的工作流程，最终让大家可以更轻松地快速构建美观、实用的产品。正如我们所说的，<strong>设计永远没有最终完成的那天</strong>，即便只是目前的版本，Material 的完善工作也还会持续进行下去。我们希望全新的 Material 会帮助大家更轻松高效地完成自己的佳作。</p> <p> </p> <p>来自: <a href="/misc/goto?guid=4959013660980319111" id="link_source2">搜狐科技</a></p>