上一章 颜色角色

选择方案

UX百科编辑部2024-07-04 发布
448人在学·0条笔记
收藏

配色方案描述了产品的所有颜色、颜色角色以及明暗主题的颜色关系。

Material 中有两种配色方案:

  1. 静态
  2. 动态
了解何时以及如何使用不同的配色方案,包括静态基线、动态用户生成和基于内容的动态配色方案

静态颜色

使用静态颜色与您可能使用过的其他颜色工作流程最为相似。静态颜色不会根据用户输入或应用内内容而改变。

Material 提供了静态基线配色方案,包括默认颜色分配和映射。

颜色在基准配色方案中保持不变

你能得到什么:

✓ 可访问的颜色
✓ 预制的基准配色方案 ✓ 不会破坏 M2 应用程序的颜色
✓ 将来可以轻松更新为动态颜色

你不会得到什么:

✗ 个性化颜色
✗ 根据用户的壁纸或应用内内容变化的颜色
✗ 用户可设置对比度功能

如果使用静态(基准)颜色

  • 您尚未准备好实现动态颜色(尽管当您准备好时可以轻松切换)
  • 您的产品正在从 M2 迁移,并且您希望获得 M3 功能而不破坏您的应用
  • 您的产品面向企业用户,他们不会从个性化颜色或用户控制的对比度设置中受益
  • 您的产品是为 iOS 打造的

动态颜色

动态颜色将根据特定的源颜色自动创建可访问的配色方案。

由于 UI 最终可能会有任意数量的不同源颜色,因此最好先使用基线配色方案进行设计,这样您就可以确保将正确的颜色角色映射到产品中的正确组件。您将使用Material Theme Builder查看 UI 模拟在一系列源颜色下的外观,并根据需要进行调整。

虽然实际颜色可能会改变,但在动态配色方案中,颜色角色映射保持不变

你能得到什么:

✓ 可访问的颜色
✓ 根据用户的墙纸或应用内内容更改的个性化颜色
✓ 能够使用色度保真度等高级自定义功能来改变动态色彩输出
✓ 用户控制的对比度设置

你不会得到什么:

✗ 所有设备上的 UI 颜色完全相同

如果使用动态颜色

  • 您希望您的产品展现个性化
  • 您希望颜色根据用户的墙纸或应用内内容而改变
  • 您希望您的产品提供用户控制的对比度设置
  • 您不确定是否需要混合使用动态和静态颜色(您可以根据工作的进展自定义配色方案以包含静态颜色)
448人在学·0条笔记
收藏
已学会
1人已学会
下一篇静态方案
基准配色 基准方案是默认的静态配色方案。它使用易于理解的颜色搭配,并包含浅色和深色主题的颜色。 使用基线配色方案,最终用户可以看到 具有静态颜色的可访问用户界面 采用静态基准配色方案的音乐应用程序 使用静态基准配色方案的新闻应用程序 基线颜色 使用Material Theme Builder在 Fi...
本章笔记
仅看自己
logo