UI设计师如何正确使用颜色

 

界面设计是应用程序是否成功的最关键因素之一。这是与用户接触的第一个点,它将决定他们是否继续使用您的产品。界面设计可以成就或破坏应用程序,因此从功能和美学的角度尽可能多地考虑其设计至关重要。

如果您想要一个突破市场的界面,那么需要考虑很多方面。设计应具有功能性和视觉吸引力。对这些方面进行适当考虑的用户界面将比没有这些方面的用户界面成功得多。

您的颜色选择如何最终成就或破坏您的产品

在设计领域,颜色可以决定用户界面的成败。它还可以帮助吸引人们使用您的产品。为您的作品选择正确的颜色是一种微妙的平衡。它需要实验和敏锐地理解颜色如何协同工作和相互对抗。

一个经验法则是确保您不会在一个屏幕上使用太多颜色——这会造成难看的视觉混乱,甚至可能会分散用户对页面上的主要号召性用语或消息的注意力。

下面是一个视觉混乱太多的例子。

由于颜色选择不当,视觉混乱的一个例子。https://www.art.yale.edu/

根据第一印象,问问自己:

  • 你对该网站的信任有多大?
  • 你有多大可能会再次使用Ta?

为您的 UI 设计选择正确的颜色是一个艰难的决定,但在一些指导下找到最适合您的品牌的颜色会容易得多。

为什么选择颜色这么难?

选择颜色对设计师来说是一项具有挑战性的任务,但对于没有接受过特定设计培训的人来说则更加困难。

有几个因素导致难以做出决定。

  • 那里有无数种颜色。
  • 在为您的设计选择完美的颜色时,没有通用的规则。
  • 设计师通常必须根据在不同的上下文和环境中最有效的方式做出决定。

设计师在选择颜色时最常犯的一些错误是什么?

颜色会影响我们的情绪和我们对事物的感受。因此,设计师通常会花费数小时来决定适合他们工作的调色板。

设计师在选择新调色板时会犯一些常见的错误,但重要的是要记住,设计师只有在忽略设计背景时才会犯这些错误。

  • 一个错误是设计师在选择颜色时没有考虑它们与其他色调的对比效果。因此,必须使用彼此形成鲜明对比的颜色。此外,选择正确的颜色将使用户能够快速识别不同的设计元素,并确保您的设计不会在视觉上变得过于嘈杂。
  • 设计师犯的另一个错误是在他们的界面中使用了太多颜色,这会导致用户在使用界面时产生一种“压倒性”的感觉。

如何为您的 UI 设计选择完美的颜色

由于我们知道许多人通过颜色以及他们对颜色的喜爱程度来判断一个网站,因此我们应该确保选择适合我们 UI 设计的颜色。

选择颜色时,必须考虑目标受众及其偏好。例如,如果您为儿童设计,您可能不想使用棕色或紫色等颜色,因为这些颜色更适合成人。

下面,我概述了三种简单的方法,您可以使用它们为您的 UI 创建引人注目的调色板。

方法 1:确定您的配色方案的心情

情绪板是一种很好的方式,可以帮助您直观地了解您希望网站的外观以及哪些颜色可以与您的品牌的其余部分完美搭配。设计师经常使用它们从各种来源收集灵感并创建有凝聚力的设计。

我们将特定的颜色与特定的情绪联系起来。对于大多数人来说,蓝色与信任、安全和可靠相对应。红色与速度、能量和紧迫感有关。橙色代表乐趣和行动,而黄色代表乐观和引人注目。黑色表示高科技、时尚的设计,而粉色则被认为是女性化的。不出所料,绿色象征着财富。

作为UI设计师的必备工具,情绪板使用图像、文本或其他图形对象的集合来代表人们想要唤起的特定感觉或情绪。

通过收集与 UI 品牌相关的图像来创建情绪板。因为这些图像应该具有一定程度的凝聚力,所以您将能够挑选出关键颜色来帮助创建您的调色板。

方法 2:60-30-10 规则

60%+30%+10%规则之所以有效是因为它带来了平衡感,引导用户的视线从一个CTA区域平滑移动到另一个区域。

配色规则非常简单,如下所示:

60%的空间用于主色调;
30%是空间辅助/次要颜色;
10%是强调色或指导色。

为了可视化表现,来看一个“60-30-10”示例:

CypherPoet在 Dribble 上使用 60-30-10 规则进行调色板原型设计

方法 3:使用配色工具

有些人可能会花时间和精力来设计自己的调色板,而另一些人则发现使用在线工具更方便。这些工具以许多不同的形状和形式存在,并且有多种选择可以满足每个人的需求。

一些在线工具提供了广泛的调色板供您选择,而另一些则为您提供了一个特定的调色板,您可以使用它来创建变化。假设您想在设计调色板之前了解颜色的外观。在这种情况下,coolors.co 等工具允许您上传图像或图片以生成相应的颜色。

 

来自colors.muz.li的流行调色板

结论

颜色是设计中最关键的元素之一。您可以使用它来唤起情绪反应、传达意义并为用户创造不同的情绪。此外,合理的调色板将改进 UI 设计、帮助品牌塑造、创造有凝聚力的体验,并帮助人们了解应用程序或网站中发生的事情。

必须选择令人赏心悦目的颜色并相互补充,同时保持合理的对比度。调色板还应确保不要使用太多颜色以避免混淆。

原文作者:Tarise Singletary

 

本页面最后更新于 2021年11月08日 10:45