农企新闻网

如何疾速掌握正确的UI配色方案?6种技巧不容错过!

发布者:何熙明
导读用户体验设计触及很多流程,需求足够的沉思熟虑才干设计出契合用户需求的UI界面。虽然听起来不太复杂,但每个细节都需求设计师重复琢磨。用户界面创立进程中耗时最长的阶段便是颜色选择,设计师往往能够要花上几个小时才干挑选到适宜的颜色。在本文中,我们将引见六个适用的配色技巧,协助设计师为界面选择最合适的颜色,并使选择进程愈加轻松,更高效!技巧1:掌握60-30-10准绳这一准绳或许说技巧源于室内设计,因而常

如何快速掌握正确的UI配色方案?6种技巧不容错过!

用户体验设计触及很多流程,需求足够的沉思熟虑才干设计出契合用户需求的UI界面。虽然听起来不太复杂,但每个细节都需求设计师重复琢磨。

用户界面创立进程中耗时最长的阶段便是颜色选择,设计师往往能够要花上几个小时才干挑选到适宜的颜色。在本文中,我们将引见六个适用的配色技巧,协助设计师为界面选择最合适的颜色,并使选择进程愈加轻松,更高效!

技巧1:掌握60-30-10准绳

这一准绳或许说技巧源于室内设计,因而常常被用于装饰房屋。这个技巧很复杂:为了到达均衡的配色效果,所运用的颜色应以6:3:1的比例停止配色。占据最大比例的为主色,30%为辅佐色,10%为装饰色,协助进步全体亮度。

这样的配色比例被以为是令人愉悦的,从视觉感知下去讲,它带给用户一个温馨的颜色层次。掌握恰当的配色比例可以协助设计师成功地组合颜色,防止了将用户界面变得斑驳陆离。

如何快速掌握正确的UI配色方案?6种技巧不容错过!

技巧2:巧用颜色比照

颜色比照简直是一切视觉构图中的关键局部。它赋予了每个UI元素共同性,并使其有目共睹。需求留意的是:用户界面中来自相反色系的颜色比照度较低,无法到达吸援用户留意力的效果。此外,在这种用户界面上复制的文本内容识别度较低,这使得设置产品交互也非常困难。

设计师硬依据所要完成的目的来控制颜色比照度的上下。例如,假如你需求用户留意到某个特定的界面元素,则最好运用像蓝色和白色这样高度比照的颜色。CTA按钮设计就经常运用高比照度的颜色。

但是,将UI作为一个全体来说,高比照度的颜色能够并不总是见效。假如文本内容和背景颜色之间的差别太大,则很难读取或扫描文本。这就是为什么建议设计师采用平和的颜色比照,并只在某些特定元素上使用高比照度的颜色。经过在不同的设备上停止用户测试,可以协助设计人员确保其配色方案的无效性。

如何快速掌握正确的UI配色方案?6种技巧不容错过!

提示3:思索颜色的心思学

正如我们在前几篇文章中提到的,心思学是一种为设计任务流程的提供助力的研讨之一。其中,颜色心思学就属于这种心思学的一个分支,它次要研讨颜色对人类心情和行为的影响。研讨标明,我们的大脑会对不同的颜色做出多种反响,但我们通常都疏忽了这些感知。当人的眼睛感知到一种颜色时,我们的大脑会向内分泌零碎收回信号,释放出对应心情的荷尔蒙,从而让我们发生不同的心情和感受。

每种颜色对我们的感知都有其共同的影响力,理解用户关于颜色能够发生的反响可以协助设计师传递正确的信息,并引导用户做出预期的行为。以下是一个颜色含义的列表可供参考。

白色,它既意味着爱情,自信,热情,也意味着愤恨。

橙色,这是一种充溢生机和暖和的颜色,能带给人兴奋的觉得。

黄色,这是一种意味幸福,阳光,欢乐和暖和的颜色。

绿色,一种最接近大自然的颜色,给人宁静和清爽的觉得。

蓝色,它通常用于代表一些企业抽象,给人沉静,牢靠的觉得。

紫色,这是一种奥秘又高贵的颜色,不断与贵族和财富有着亲密联络。

黑色,它通常与喜剧和死亡联络在一同,意味着奥秘。它同时契合传统的和古代的审美。

白色,这种颜色意味着纯真和天真,也带给人地道和明晰的觉得。

另外,设计师需求记住,每团体的视觉感知都是共同的。除了年龄和性别等要素对颜色偏好有很大的影响,文明差别也是其中一个重要要素,因而理解受众的特征至关重要。

如何快速掌握正确的UI配色方案?6种技巧不容错过!

提示4:注重颜色的文明差别

总所周知,每种文明都有本人的传统和信仰,文明差别关于颜色的选择也有很大的影响。在不同国度关于同一种颜色能够有完全相反的含义。例如,在欧洲国度,白色意味纯真,常用于婚礼。而在许多亚洲国度,这种颜色意味着死亡和悲伤。因而,不正确的颜色选择能够会招致用户对产品发生致命的曲解。经过理解颜色不同的文明特点,设计师们可以大大降低产品被曲解的风险。

提示5:促使颜色协调

颜色协调是UI设计师努力的重要目的。为了让用户感到温馨和称心,设计师试图将均衡引入用户界面设计。颜色的协调是指设计中颜色的陈列,以最吸引人的、最无效的方式来吸援用户的觉得。协调的颜色有助于网站或使用顺序的良好的第一印象。

经过多年的探究,设计师们区分了一些根本的配色方案,使其颜色运用愈加无效。以下是一些根底的配色方案:

单色,单色配色是基于一种颜色,选择其不同的色彩停止颜色组合。

相似色,该配色方案使用于色轮上彼此相邻的颜色。

互补色,它是在色轮上彼此绝对放置的颜色组合方案,旨在发生颜色的高比照度。

拆分互补色, 这个配色方案的任务原理相似于互补色,但是不同的是采用了更多的颜色。例如,假如你选择了蓝色,配色则需求组合两个与其相反颜色(橙色)相邻的其他颜色(黄色和白色)。

三元色,它基于色轮上等距的三种不同的颜色。专业人士建议运用一种颜色作为主色彩,其他两种颜色用来提亮。

双色互补,这种配色方案采用了两对互补色组合。假如衔接这四种颜色在色轮上的地位,就会构成一个矩形。

如何快速掌握正确的UI配色方案?6种技巧不容错过!

提示6:从大自然中获取灵感

大自然是世界上最好的艺术家和设计师。我们在自然环境中看到的颜色组合总是接近完满的。人们喜欢看的日落和拂晓,秋天的森林和冬天的山脉,由于他们充溢了自然的颜色组合。

那么,你为什么不试图从中获取一些想法呢?去美丽的大自然里散漫步,你一定会找到灵感!

如何快速掌握正确的UI配色方案?6种技巧不容错过!

数码产品的成功在很大水平上取决于设计师为其用户界面所选择的颜色,正确的颜色给用户带来极大的温馨感。设计师经过运用适宜的配色方案,就能本着网络面前人人平等的原则,提倡所有人共同协作,编写一部完整而完善的百科全书,让知识在一定的技术规则和文化脉络下得以不断组合和拓展。 运用户迅速明白产品的设计思想,引导他们执行适当的操作。

学习工具,但不受限于某种工具。 Mockplus做原型,更快更复杂 ,如今 下载Mockplus ,收费体验痛快的原型设计之旅。

以上内容由 Mockplus 团队翻译整理,仅供学习交流。