位置:深圳UI设计培训学校 > 学校动态 > 如何创建更好用的UI调色板?
色彩无处不在。因此对于设计师来说,选择和使用合理的颜色来实现业务目标是一项挑战。
颜色的选择会影响产品的视觉样式,也会影响用户对产品的感觉。下面是创建一套UI配色方案的实用技巧,一起来看看吧~
01
定义基本的颜色
首先要定义基本色。理想情况下应该有1-3个基本色与产品相关联。
另外需要注意的是不要使用纯白或纯黑色。白色(#FFFFFF)的颜色亮度为,黑色(#000000)的亮度为0%,这种强烈的对比在阅读或操作时会使眼睛疲劳。
好的办法是确定灰度色,灰度色适用于大多数界面设计。由于灰色度的H值和S值没有变化,所以只要改变B的数值就能形成一套色板。
语义色是用来向用户传达成功、错误和警告信息的颜色。以下场景中可以考虑使用:• 突出显示重要的界面状态或信息
• 验证文本字段或控件,如切换、复选框
• 提供的视觉反馈,如新的应用消息
02
60-30-10配色规则
60%+30%+10%规则之所以有效是因为它带来了平衡感,引导用户的视线从一个CTA区域平滑移动到另一个区域。
配色规则非常简单,如下所示:• 60%的空间用于主色调• 30%是空间辅助/次要颜色
• 10%是强调色或指导色
03
了解受众
好的用户体验的关键是理解受众。颜色在这里起着重要的作用,因为颜色的选择会影响用户与产品交互时的感受和情绪。
因此选择颜色时,必须要问自己以下问题:• 谁是你的目标受众?• 他们的年龄?• 产品的专业化是什么?
• 你想让产品唤起什么样的情感?
这些问题应该会影响到颜色的选择,所以在选择UI调色板或与团队讨论选择时,请始终关注这些问题。
04
使用配色工具
有时候可能会苦于没有灵感,一个很棒的技巧是利用自然或建筑来激发独特的配色方案。
05
使用对比
如果你想把用户的注意力集中在特定的操作上,好使用强对比度的颜色来帮助用户找到焦点。
对比度帮助用户区分各种文本和非文本元素。更高的对比度使图像看起来更舒服,通过对比检查可以有效地评估颜色的搭配。
这里教大家一个检查颜色饱和度是否统一的方法:
画一个颜色为纯黑(#000000)的矩形,填充模式选择“饱和度”,覆盖在色板上,色板上的颜色会出现饱和度的变化,以此来检查配色的饱和度是否相同。
06
简单的命名方式
在系统中使用颜色时,请始终为每种颜色提供确切的名称。增加团队中的每个成员都能理解该名称,很容易就能引用特定的颜色。
好使用功能性词语来描述UI中的颜色,例如积极、警告、主动等。
总结
关于UI颜色的内容可以总结为三个原则:• 一致:在整个UI界面中颜色的应用应该一致,并与它所代表的品牌兼容• 对比:颜色应该在元素之间产生区别,有足够的对比
• 意识:色彩的运用应该有目的,以多种方式传达意义。
尊重原创文章,转载请注明出处与链接:http://www.peixun360.com/404/news/348126/违者必究! 以上就是深圳UI设计培训学校 小编为您整理 如何创建更好用的UI调色板?的全部内容。