跳到主要内容

如何用颜色塑造UX

Use colour to shape UX
(形象信用:未来)

与观众产生共鸣的设计不仅仅是巧妙的复制和精心制作的摄影。一个直观的网站比深思熟虑的信息架构更深入,引导用户走向他们的目的地。剥去这些层会给你带来一个设计教育的核心原则:决定性的色彩选择。

色彩心理学的有效性色彩理论作为一种营销策略,是一个经常争论的话题,因为我们每个人都有不同的偏好。你最喜欢的颜色可能是蓝色。或者是橙色的。或者紫色。红色?你说对了。

但这个建议不也与任何设计方法有关吗?在设计网站时,你是试图为一个人设计它,还是试图与代表你理想客户的广泛受众联系?成功设计的基础要求你消除一个人的偏见,退一步看看它是如何影响更多观众的。

围绕观众期望设计

当涉及到为一个品牌选择“最佳”颜色时,研究发现,预测消费者对颜色和品牌的相关性的情绪比颜色选择本身更重要。

例如,在考虑健康的时候,许多人把它与绿色联系在一起。如果一项针对大型组织或食品的新健康倡议决定给自己打上鲜红色的烙印,那么这种选择会让人感到不快。我们可能并不总是有意识地意识到为什么会有这样的感觉,但在幕后,感觉是我们大脑过滤的方式,通过与过去的经验的学习或条件反射。这一点在颜色选择上更加明显。

就像在UX中一样,重要的是要考虑不符合用户期望的事情会有多不和谐。

2003年,乔·哈洛克写了一篇关于色彩作业的本科论文。他对232人进行了抽样调查,并能够按性别和年龄提取核心肤色关联。例如,他能够确定信任的情感共鸣主要与蓝色有关(占所有调查参与者的34%)。

Joe Hallock's research site

JoeHallock的研究是在一个网站上启动的

(图片来源:约书亚·加里蒂)

再说一次,你个人是否觉得蓝色最能代表信任并不是焦点。还有很多人觉得白色(21%)或绿色(11%)表达了信任。

在为更大的受众或市场细分设计时,我们希望评估理想的客户,而不是任何人的个人偏见。如果你是微软,你想在市场上定位Bing来暗示信任,你就把它看作一个数字游戏。InternetLiveStats显示,谷歌每天的搜索量超过35亿次;市场占有率约占所有搜索量的93%..如果微软想获得更多的市场份额,重点可能是通过设计和品牌建立信任。

根据a最近的调查65%的参与者表示,信任对他们支持品牌的决策有很大或很大的影响。如果蓝色代表了34%(11.9亿)观众的信任度,那就有很大一部分人是白人(7.35亿)或绿色(3.85亿)。

图表上的百分比可能会产生误导,直到您应用它们真正代表的内容为止。使用蓝色颜色建立信任通常用于使用个人或金融信息进行交易的企业。这就是为什么你看到银行和社交媒体在他们的品牌中以蓝色为主要颜色的原因。利用小的潜意识触发器,如在品牌中使用蓝色,可以帮助新客户快速联系。

这不是魔术,但满足观众的期望会阻止他们的大脑发出警告信号,表明有些事情不太对劲。多花几秒钟来巩固对你品牌的信心是非常有价值的。

了解单一颜色的财力

冰的三种颜色是白色、灰色和蓝色。前两位是中性的,这意味着任何蓝色的东西都会吸引用户的主要注意力。

(图片来源:约书亚·加里蒂)

你知道84.7%的客户购买决定受颜色使用的影响吗?选择合适的颜色会对收入和转换产生很大的影响。

当微软设计最终将成为必应的产品时,它的设计团队探索了各种颜色的变化来表示链接。2010年,必应的用户体验经理保罗·雷(PaulRay)在一个早已过时的微软大会MIX 10上做了一个演讲。他讨论了对颜色和排版等因素所做的多变量测试的水平,以及它们对收入、回报率、第一次点击时间等的影响。

微软的测试是如此粒状,包括多种颜色的蓝色链接颜色。调查发现,一种特定颜色的蓝色(#0044 CC)比最初使用的淡蓝色每年高出约8000万美元至1亿美元。

这种蓝色很特别。它超越了颜色心理学101理解蓝色是信任的表现。有趣的是,这种特殊的蓝色颜色使用的是黄金比例从数学上讲。

Bing search page

微软的必应测试是色彩心理学的大师。

(图片来源:约书亚·加里蒂)

与斐波纳契序列紧密相连的黄金比率,最著名的是三分之一的法则。在摄影中,它通过将图像分割成三个相等的垂直矩形和三个相等的水平矩形来构成构图。这是设计师与生俱来的行为,因为我们的大脑习惯于感知与这个比例相一致的构图中的价值。

那么,这个占三分之一的黄金法则是如何成为Bing蓝色网站的十六进制代码的呢?等一等。我们快到了。

十六进制代码表示像素的红色、绿色和蓝色标记。十六进制代码的前两个数字决定了红色的值,第二个是绿色的,最后两个是蓝色的。冰的蓝色是#0044 CC。将其转换为标准的RGB色谱,结果为:红色:0,绿色:68,蓝色:204。还和我在一起吗?

当你把蓝色值除以绿色时,你得到了什么?整整三个。保罗·雷的演讲将宾的蓝色定义为一种完美的数学蓝色。

记住您的设计上下文

重要的是要注意的是,完美的蓝色本身不会增加转换,很大程度上是因为有一个红色按钮不会神奇地产生更多的销售额。为设计中的某一元素选择单一颜色是集体设计心理的一部分。与用户体验一样,色彩理论最好是在上下文中理解。

必应的蓝色脱颖而出,因为它与很大比例的中性颜色成对。根据UX触发器(UXT)的一项研究,必应搜索结果中有86%的搜索结果是中性的。

UXT是一种颜色心理学分析工具,它分解图像的每个像素,以确定相对于其他颜色使用颜色的百分比,以及这种背景在信任和质量等因素方面如何影响不同性别和年龄组的感知。

UX triggers net

使用像ux触发器这样的工具可以帮助您分解产品的颜色心理。

(图片来源:约书亚·加里蒂)

研究,中性颜色(主要是白色和67%的图像)加强了对次要非中性颜色的关注。在这种情况下,蓝色是最普遍使用的颜色,占屏幕的5%。整体设计主要集中在冷色(91%)。凉爽的颜色往往会让人产生一种更平静或平静的情绪。在查看设计本身的上下文时,这一点很重要。

搜索结果页面包含大量信息。每个页面只有10个结果,但包含了数百个描述每个页面、网站URL、页面标题和可能与用户相关的附加侧边栏标注信息的单词。当大多数用户只在搜索引擎的第一页上花费4.39s到8.64s。

这就是为什么颜色选择在用户体验和总体设计中扮演着如此重要的角色。它与蓝色或红色无关:它实际上是关于它周围的所有颜色。

必应的三种顶级颜色分别是白色(67%)、灰色(19%)和蓝色(5%)。正如已经讨论过的,前两名是中立的。正因为如此,任何蓝色的东西都会吸引用户的主要注意力。如果考虑到蓝色文本链接也大于次要描述文本(放大链接为20 Px,主体副本为13 Px),则会创建隧道视觉,并使用户能够专注于页面标题,这在页面上提供了最大的价值。

我们的大脑下意识地量化了我们认为理想的东西。

所有其他内容因设计而成为次要内容。哦,你猜怎么着:放大的蓝色链接文本(20 Px)的大小与正文文本(13 Px)相比,在数学上是完美的。蓝色文本的大小相当于人体复制品的65%-距离完美的黄金比例只差1%。

这并不是说设计师故意创造数学分数或方程式来驱动他们的设计。由此得出的结论是,我们的大脑下意识地量化了我们认为理想的东西。只是碰巧我们可以用事实之后的一些数学来定义它。

就像设计科学。仅仅因为我们可以用数学来增加对事物的理解,并不意味着它的存在纯粹是因为有人用数学来实现它。数学是一种语言,在设计或色彩理论中常常被忽视,因为有些设计师天生就能建立起这种联系。

用颜色和质地影响客户

在做任何实际的设计工作之前,了解设计的目的是很重要的。奇怪,对吧?您需要问这样的问题:它与业务目标有什么关系?它与客户的期望有什么关系?

从网站的角度来看,颜色选择并不一定会减慢访问者的速度,并鼓励他们花更多的时间在页面上。这是一个更多的用户体验,产品价值和市场信息的主题。颜色可以帮助你建立你在生态系统中的位置。

去年,斯拉克重新设计了它的网站,并提供了精美的纹理插图和深思熟虑的色彩使用。它帮助它在过于企业化的SaaS网站争相吸引关注的海洋中脱颖而出。其结果是专业而又好玩,这与其核心市场相呼应。

Slack website

当斯莱克彻底改变其品牌形象时,它做得非常好,以至于其他公司很快就模仿了它的外观。

(图片来源:约书亚·加里蒂)

但后来每个人都复制了它。同样的字体样式。同样的插图风格。同样的配色方案。SLACK的品牌风格成为其他人的模板。再也没有人出类拔萃了。不是因为产品是一样的,而是因为总体的集体设计经验是一样的。这对于那些想要建立自己地位的组织来说效果很好,但对行业领导者来说却适得其反,因为这是两个不同的业务模型,有两个不同的用例。

您可能会问:业务目标与颜色使用和设计决策有什么关系?你知道吗?快餐店的餐厅传统上是用鲜艳的颜色,如红色和黄色,因为它会给顾客带来一种行动感或不安感吗?

快餐因快捷方便而产生收入。如果顾客在吃饭的时候花点时间,这会阻碍餐桌的周转,降低餐厅一天内的销售量。他们关注的是潜在的收入,而不是客户体验。

这一趋势在过去几年开始发生变化。他们已经开始使用中性的颜色,自然的设计元素,如木材和柔和的照明。它不那么粗糙,更令人安慰。市场预期表明,家庭想要坐下来享用一顿饭,即使是在预算和相对较快的时间内也是如此。与客户合作是长期成功的必要条件。

对行为施加影响时,应保持克制和谨慎。这并不总是让顾客进入销售漏斗。有时,最积极的设计决策就是放慢速度。

本文最初发表于,世界上最畅销的网页设计师和开发者杂志。你可以的在这里订阅网络

相关文章:



翻译字数超限