色彩搭配——关于UI颜色选择的6个技巧

如题所述

第1个回答  2022-06-11
用户体验设计涉及许多流程,需要仔细深入地思考才能使界面满足目标受众的需求。即使看起来不太复杂,每一步都需要对细节的深入关注。

颜色选择是用户界面创建过程中一个耗时的重要阶段。设计师有时需要花几个小时选择正确的颜色。在本文中,我们将介绍六个有用的技巧,帮助设计师为UI选择强有力的颜色,并使此过程更轻松,更高效。

这种规则或技术来自室内设计,因此常用于房屋装饰。这个想法很简单。为了使构图达到平衡,颜色应该以60%-30%-10%的比例组合。最大的比重应该是主色调,次要颜色占三分之一,剩余10%的颜色用于帮助强调和点缀。

这样的比例被认为是可以令人眼感到愉悦的,因为它能够使用户逐渐感知所有的视觉元素。了解了适当的颜色比例,设计师可以成功地将颜色搭配起来,而不会产生使界面多彩混乱的风险。

色彩对比是任何视觉构图的关键部分。它为每个UI元素带来了独立性,并使所有这些元素都引人注目。仅明暗度不同的相同色系颜色的用户界面很难吸引用户的注意。而且,在这个UI中复制内容看起来难以辨认,这使得与产品的交互几乎不可能。

设计师根据它应该完成的目标来控制对比度的等级。例如,如果您需要用户特别注意特定的用户界面元素,最好使用两种高对比度的颜色,例如蓝色和红色。CTA按钮(Call to Action用户行为号召)设计通常使用高对比度的颜色设计。

但是,从UI的整体构成来说,高水平的色彩对比可能并不总是奏效。如果复制内容和背景颜色对比太强烈,则很难阅读或扫描文本。这就是为什么设计师被建议创造一个温和的对比度等级,并应用高对比度的颜色来突出显示元素。各种设备上的用户测试可帮助设计人员确保其解决方案的有效性。

正如我们在前文提到的,心理学是帮助设计工作流程的基础研究之一。有一种心理学分支表明颜色对人类情绪和行为的影响,称为色彩心理学。它表明我们的大脑对颜色有反应,而我们通常不会注意到它。当人眼看到一种颜色时,我们的大脑向内分泌系统发出信号,释放对心情和情感负责的激素。

每种颜色对我们的想法都有其自身的影响,并且可能的反应可以帮助设计师传递正确的信息并呼吁用户做出预期的行动。以下是颜色含义的简短列表。

它同时具有好与坏的象征,象征着爱情,自信,激情和愤怒等。

充满活力和温暖的色彩带来兴奋的感觉。

这是幸福,阳光,欢乐和温暖的颜色。

自然的色彩带来平静和焕然新生的感觉。

它通常代表一些企业形象,也可能与距离和悲伤有关。

长期与皇室和财富有关。这也是一种神秘和魔力的颜色。

它与悲剧和死亡联系在一起,意味着神秘。它可以同时是传统的和现代的。

颜色意味着纯洁无瑕,以及整体性和清晰度。

另外,设计师需要记住,视觉感受对每个人来说都是非常独特的。年龄和性别等因素对色彩偏好有很大影响,因此了解目标受众的特征至关重要。您可以在我们之前的文章中找到颜色含义和偏好的详细说明。

每种文化都有自己的传统和信仰,所以在选择颜色之前,你需要确保它们会被解读成你想表达的含义。事实是有时一种颜色在不同国家可能有完全相反的意思。例如,在欧洲国家,白色代表纯度,常用于婚礼,而在许多亚洲国家,这种颜色意味着死亡和悲伤。错误的使用可能会导致对产品可能致命的误解。通过承认文化色彩感知的特点,设计师可以减少被误解的风险。

和谐是UI设计努力的目标。为了让用户感到高兴和舒适,设计人员尝试将平衡带入用户界面设计。色彩和谐是关于设计中色彩以最有吸引力和最有效的方式用于用户感知的方式。和谐的颜色有助于网站或应用程序获得良好的第一印象。

经过多年的搜索,设计师们区分了有效运作的基本配色方案。让我们看看他们是什么。

色彩和谐基于一种颜色的各种色调和明暗关系。

该方案应用在色轮上彼此相邻的颜色。

它是在色轮上彼此相对放置的颜色混合,旨在产生高对比度。

这个方案与前一个方案类似,但是它采用了更多的颜色。例如,如果您选择蓝色,则需要取两个与其补色相邻的其他颜色,例如黄色和红色。

它基于色轮上等距的三种不同颜色。专业人士建议使用一种颜色作为主导色,其他作为点缀色。

四色配色方案采用了四种互补配对的色轮颜色。如果连接所选颜色的点,它们将形成矩形。

大自然母亲是世界上最好的艺术家和设计师。我们在自然环境中看到的色彩组合总是接近完美。人们喜欢看日落和黎明,秋天的森林和冬天的山脉,因为它们充满了自然的色彩组合。

那么,你为什么不尝试借用一些想法呢?去散散步或搜索美丽的大自然的照片,你一定会找到灵感。

数码产品的成功在很大程度上取决于用户界面的颜色。正确的颜色会使用户在产品的使用中感到舒适。仅仅通过使用适当的颜色,设计师可以将人们置于思维的框架中以驱使他们采取相应的行动。所以在设计中,请明智地做出你的选择。

我的设计作品(Dribbble): https://dribbble.com/exciting

本文翻译来自Medium感谢 Tubik Studio

原文链接
相似回答