UI颜色是产品品牌的重要组成部分。为徽标选择正确的配色方案非常重要,这将会是公司标识,企业UI色。为网站或应用程序配置正确的配色方案同样重要,AAA教育武老师为大家分享UI设计配色方案怎样不出错。
颜色可以吸引观众注意相关信息,影响整体体验,与用户建立情感联系,并提高品牌知名度。UI设计配色经验。
但是,从品牌书中选取相同的颜色并在网站上使用它们是很不合适的。对颜色的感知取决于涉及多个方面的许多因素:用户交互和行为,产品业务以及当前的设计趋势。没有一种特定的选择可用于所有目的。
选择调色板
每当您创建配色方案时,从目标受众及其需求开始就很重要。颜色本身并不是可以感知的,它需要一个可以感知颜色的上下文。
考虑一下您的潜在用户是谁,以及他们希望从您的产品中获得什么。目标受众的偏好始终是做出产品颜色决策的好关键。
找出您的产品对用户意味着什么。每个利基市场都有自己的特征,趋势和标准。借助某些颜色,您可以创建所需的心情。娱乐产品的配色方案大多明亮,大胆,并带有许多重点,而公司风格则更凉爽,中性和简单。
通过确定UI的主要目标,您可以轻松找到用于选择特定颜色的参数。例如,如果用户界面主要是文本,则浅色主题将在其中创建一个重点阅读的空间。照片编辑界面通常较暗,以使图像看起来更深。您需要这个UI设计配色攻略。
选择主要颜色
也许您的产品已经有一个品牌及其主要颜色。这是帮助您开始构建的良好起点。
如果要从头开始创建设计,但尚未准备好调色板,则可以从与产品关联的任何内容开始。这些应该是1-2种的显示颜色,在其他背景下立即可见,并突出显示重要的界面,例如按钮,链接和其他交互元素。
设置其他颜色
大多数人会很容易地以2–3种颜色组合来感知界面。太多的颜色模糊了设计中元素的层次结构,使您更难以专注于正确的事物。
在设计配色方案时,一个好的经验法则是不要使用超过3-4种原色。代替使用大量的颜色,最好使用它们的阴影和色调。
不要忘记辅助功能和黑暗主题
由于不易受黑色像素影响的OLED屏幕的普及以及Google和Apple的新操作系统的功能,当今的深色主题已不是增加设计可变性的简便方法,但已经成为接口的标准。因此,在创建配色方案时,需要记住如何使其适应暗模式。UI设计阴影是重要的。
设计师忘记的另一个重要方面是人们对某些颜色的个体感知。他们以完全不同的颜色看到您的设计,这些颜色可能具有不同的阴影或对比度。这种特殊的感觉破坏了设计人员想要的接口的所有可用性。设计方案很重要,以使它们的颜色在具有不同颜色感知的人使用时匹配。
请记住要在不同的设备和屏幕上以及不同的条件下测试颜色组合。测试甚至可以在用户看到产品之前就揭示出配色方案的优缺点。
技巧和窍门
旋转色轮
色轮是最简单但最重要的设计器工具。在色轮中的颜色中,有红色,绿色,蓝色三种原色,称为原色。通过混合这三种颜色可以创建所有其他颜色。UI设计配色误区也要注意避开。
通过根据一些规则组合这些颜色,可以创建适合您产品的多种配色方案。
例如,如果您在轮子上使用相反的颜色,则它们会形成互补的一对。此配色方案将提供最大的对比度,并用于设计重点。
如果您需要较少的对比方案,最好在色轮上使用彼此相邻的颜色。
当您想在对比度和舒适度之间取得平衡时,三合一配色方案是最佳选择。
整理颜色
为了使设计与颜色保持平衡,请按以下比例使用颜色:主阴影为60%,补充颜色的为30%,强调色为10%。这种色彩平衡将在您的设计中更容易维护,并且易于使用。另外,不要忘记在设计系统中添加颜色。
不要在界面上使用中性灰色(#CCCCCC或#DADADA),而是向其添加阴影。我们习惯的颜色总是带有某种温暖或冷色调的阴影。同样在自然界中,没有发现纯黑#000000。还应使用调色板中的颜色对其进行稀释。
不要为深色主题使用相同的颜色
通常,设计师会犯一个错误,就是简单地将颜色转换为深色主题。在深色背景上,较浅的颜色会出现。在浅色背景上,深色则脱颖而出。设计深色主题时,您实际上需要重新组合配色方案,这取决于在深色环境中与界面的交互。您将不得不将强调色略微调暗,将浅色背景更改为深色,然后降低文本的亮度。可以了解Google和Apple对深色主题的感觉。
照顾偶然性吗?
在选择调色板和颜色组合时,设计人员应考虑具有特殊需求或残障的不同年龄的用户。
具有挑战性的人群之一是色盲用户。超过8%的男性和大约0.5%的女性患有这种疾病。使用量身定制的调色板以适应多种色盲的情况非常重要。图形编辑工具或插件中用于检查对比度的相应模式将为您提供帮助。
用渐变
UI设计阴影和渐变是潮流,渐变是近年来的设计趋势。可以一次将几种颜色组合在一起,以增加对象的深度并强调其形状。也请尝试使用不同类型的渐变(径向或角度渐变,而不是通常的线性)和不同角度。组合相似的颜色:温暖与温暖,以及寒冷与寒冷。最佳渐变通常非常微妙,颜色之间没有太大差异。这些渐变更加自然,令人愉悦。
如今,有许多工具可以帮助大家匹配颜色或在不同条件下进行测试,十分方便,多用,积累UI设计的配色经验。拥有工具来帮助您更快,更轻松地完成工作始终是一件好事,让设计师可以解放一些时间。以上内容就是告诉大家UI设计配色方案怎样不出错,更多资料请关注AAA教育~
填写下面表单即可预约申请免费试听!怕钱不够?可先就业挣钱后再付学费! 怕学不会?助教全程陪读,随时解惑!担心就业?一地学习,可推荐就业!
©2007-2022/ www.aaa-cg.com.cn 北京漫动者数字科技有限公司 备案号: 京ICP备12034770号 监督电话:010-53672995 邮箱:bjaaa@aaaedu.cc