作者都是各自领域经过审查的专家,并撰写他们有经验的主题. 我们所有的内容都经过同行评审,并由同一领域的Toptal专家验证.
卡梅伦查普曼

卡梅伦查普曼

设计博客编辑

卡梅隆有设计背景,是两本网页设计书籍的作者:《欧博体育app下载》和《欧博体育app下载》.

专业知识

分享

5年多前推出的谷歌 材料设计 指南已经成为他们网站和基于应用程序的服务的标志性外观. 人们一眼就能认出它们是谷歌的附属产品,这对谷歌的品牌推广是一个福音.

材料设计也被更广泛的设计社区所采用,现在可以在谷歌原生平台之外的网站和应用程序上找到(甚至在竞争平台上)。. 它, 例如, 在桌面和移动平台的应用程序中使用材料设计美学. 这只是一个例子,为什么材料设计是一个很好的选择 设计的多样性 实现.

为什么要使用材料设计

什么是材料设计?

材料设计是由Google在2014年创建的,部分是基于基于卡片的布局 谷歌现在. 对纸质设计风格的认可将其与当时广泛使用的平面设计风格区分开来.

像大多数设计系统一样, UI的材料设计是为了在不同的设备上带来统一的用户体验而创建的, 平台, 输入法. 类似于苹果将扁平化设计原则作为他们的标准, 谷歌使用材质设计来确保这一点, 不管用户如何访问他们的产品, 他们将拥有一致的用户体验.

材料设计规范包括所有方面的指导方针:排版, 网格, 空间, 规模, color, 和图像. 但材料设计不仅仅是告诉设计师如何让东西看起来. 它使 设计师 创建具有层次、意义和最终结果重点的有意设计.

什么是材料设计

为什么使用材料设计?

与任何完善的设计系统一样, 使用材料设计系统有一些主要的优点 设计师 应该考虑.

Google的材料设计实际上是一个完整的设计生态系统, 而不仅仅是一套风格指南. 如果存在潜在的设计情况, 材料设计可能有一套全面的规则来处理它. 这包括那些经常被不太全面的人忽视的复杂用例 设计系统. 对于想要这种结构的设计师来说,这是非常令人欣慰的.

Google维护材料设计,并保留了大量关于如何使用和实现它的文档. 许多现代设计系统可能缺乏这种支持和文档.

材料设计框架

尽管有这么多的综合性和文档, 材料设计仍然是一个相当灵活的设计库. 在指导方针内, 如何执行设计的许多细节完全取决于设计师.

材料设计的更多颗粒优势包括微妙的拟物化, 是什么让它从平面设计中脱颖而出,对许多用户来说更直观. 另一个用户友好的特点是用户反馈的形式 触觉反馈,微妙的动画,以及类似的东西都被内置到指南中. 它也具有非常简单的物理感,这使得交互更加直观.

招聘美国全职自由UI设计师

材料设计基于移动优先的理念, 考虑到它最初的目的是设计安卓应用程序,这就说得通了. 它还促进了设计中的动画, 既是为了用户反馈,也是为了暗示不同功能的功能.

最后, 黑暗的主题 选项已经提供,为设计师增加了更多的视觉灵活性. 最初, 材料设计非常轻盈明亮, 这与一些品牌的美学效果不太相符. 添加一个暗主题指南修复了这个问题.

Google素材设计模式

使用材料设计的缺点

而材料设计有非常明显的优点, 这并不意味着使用它就没有坏处.

首先, 材料设计是立即识别,并与谷歌和, 具体地说, 安卓. 虽然这并不一定对每个人都是坏事,但对某些人来说可能是负面的.

它可能是负面的一个重要原因是,它限制了使用谷歌设计系统的其他品牌的有效性. 是的, 设计师可以将logo融入其中, 调色板(在材料设计指南范围内), 以及其他差异化因素来支持品牌识别, 但遵循材料设计规范的产品几乎总是会 与谷歌有关联.

因为运动和动画是在材料设计指南中推广的, 如果网站或应用程序没有整合这一功能,用户可能会觉得他们遗漏了什么. 人们将材料设计的运动特性与视觉特性联系在一起, 哪一个能让设计没有动感.

当然,一个解决方案是在遵循材料设计规范的设计中始终包含运动. 但是在移动设备上,大量的动画会占用大量的资源, 导致更高的数据使用量和更快的电池消耗. 这是设计师在材料设计指导方针下必须考虑的平衡行为.

初学者可能会发现,与平面设计等其他风格相比,材料设计规范更复杂,更难实现. 因为材料设计系统是如此的全面, 要考虑和坚持的东西比许多新的东西要多得多 设计师 可能对…感到舒服.

Google素材设计组件

它的全面性也会导致一些设计师感到受约束,无法充分实现自己的创意. 它还会扼杀创新, 因为几乎所有的设计挑战都已经计划好并提供了解决方案. 虽然在很多情况下是有帮助的, 这可能会阻止设计师采用新的方法来解决问题, 同时也限制了新想法出现的数量.

在网站和应用程序的材料设计中也存在一些可用性问题,这可能会使它们非常人性化un友好的. 最大的问题之一是所谓的“合成肉在许多手机设计应用中遇到的导航. 图标通常用来代替文本, 虽然有时图标是立即识别和相当可用的, 其他时候则不然.

一个表示“Home”的圆圈比之前在大多数安卓界面上使用的house图标更难识别. 这是将形式置于功能之上的一个主要例子,这是材料设计的延续 扁平化设计根源.

它不只是在下方的导航栏. 材料设计对圆形浮动操作按钮的偏好也是一个可用性问题. 这些圆形按钮只包含图标的空间,不包含辅助文本. 因为图标可以如此开放的解释, 在很多情况下, 用户会质疑这些按钮到底是做什么的.

Google素材设计元素

结论

如果一款应用主要面向安卓平台开发, 那么使用材料设计是一个简单的选择. 因为谷歌的广泛采用, 任何基于材质设计原则的应用都会让人感觉像是原生应用.

也就是说, 在安卓平台之外还有很多其他用例,其中材质设计是一个可靠的选择. 随着设计系统的进一步成熟,这些情况必然会增加. 设计师 应该, 至少, 熟悉指导方针,以便他们可以自己决定何时适合使用材料设计, 当其他系统可能更适合的时候.

了解基本知识

  • 为什么材料设计很重要?

    作为Google使用的签名设计框架, 材料设计框架已成为立即识别与品牌相关. 但设计师应该考虑使用Google生态系统之外的材料设计指南,因为它的使用案例非常全面和多样.

  • 材料设计的用途是什么?

    材料设计框架最初是作为Google网站和应用程序(包括安卓应用程序)的官方风格开发的。. 从那以后,它被用于谷歌平台之外的各种品牌的网站和应用程序.

  • 材料设计与平面设计的区别是什么?

    材料设计来源于平面设计,但更多的是拟物化和物理结合, 使其更加用户友好,并改善整体用户体验. 这就是为什么许多设计师现在使用材料设计框架的原因.

  • 材料设计是一个框架吗?

    材料设计是一套全面的设计指南,超越了一个简单的框架. Google的材料设计 patterns可以看作是一个设计库,而不是一个框架. 它是目前可用的最全面的开源库之一.

聘请Toptal这方面的专家.
现在雇佣

世界级的文章,每周发一次.

订阅意味着同意我们的 隐私政策

世界级的文章,每周发一次.

订阅意味着同意我们的 隐私政策

Toptal设计师

加入总冠军® 社区.