想要用色彩“诱惑”用户,这些色彩知识设计师一定要懂!

北京/设计爱好者/4年前/106浏览
想要用色彩“诱惑”用户,这些色彩知识设计师一定要懂!
数艺设

设计师必学的色彩知识

对于一位设计师来讲,感知色彩是必备的技能之一。对于我们的产品而言,虽然大部分用户都没有系统地学习过色彩知识,但是他们仍然可以很直接地判断出配色的好坏。


undefined



用色彩判断天气


这就好比我们去快餐店,店内配色一般选用暖色调,这就容易激发食客的食欲,并让食客有快速吃完马上离开的欲望;而咖啡厅一般会选用比较暗的色系,这样能够让喝咖啡的人感觉比较沉静,所以,如果要洽谈业务的话,一定不要选择去大片暖色调的场所。


下面我们就来看一下,不同颜色给我们带来的感知是什么样的,从而方便我们去给产品选择合适的颜色取向。


红色


象征着激情和理想。


正能量:吉祥、喜庆、爱情、热烈、奔放、激情、斗志。

负能量:危险、流血、暴力。

作用:强调警示或提示引导。


红色经常运用在一些活动页面中,可以在很大程度上烘托氛围、提高用户点击欲望,如图所示。


undefined




红色的运用


由于红色的饱和度非常高,所以其提示性非常强,在设计时,我们常常会将按钮设计成红色,以突出需要表现的信息,如图所示。


用红色突出信息


橙色


象征着温暖,是与能量有关的颜色,能促进食欲,同时还能强化视觉感受。


正能量:积极、活跃、温暖、欢乐、明朗、成熟。

负能量:焦躁、喧嚣。

作用:增强食欲,提高动力。


因为橙色具有促进食欲的特性,所以大多运用在美食类和消费类的APP中,例如大众点评、淘宝、美团的设计都用到了橙色,如图所示。



undefined



橙色的运用


黄色


象征着活力,比纯白的明度还要高,非常醒目,但容易产生视觉疲劳。


正能量:希望、光明、乐观、聪明。

负能量:警告。

作用:提高用户的认知性。


黄色也具有增强食欲感的作用,但相比于橙色而言,黄色更时尚更轻快。由于黄色是明度最高的颜色,所以在设计过程中需要注意明暗的平衡,选用一些比较深的颜色来压住画面,从而减轻视觉疲劳,如图所示。



undefined



黄色的运用


绿色


象征着自然的一种颜色。


正能量:清新、希望、安全、和平、舒适、生命。

负能量:疲劳、下降。

作用:阅读感很舒服,安全可靠。


很多安全检测类的软件在设计时会使用到绿色,还有一些旅游类的APP也会用到绿色,但是要特别注意一点,在国内绿色还代表了“下跌”的意思,所以不要把绿色用在理财产品中,如图所示。


undefined




绿色的运用


蓝色


象征着智力和理性,是最安静的颜色。


正能量:沉着、智慧、理智、理性、永恒、信赖、凉爽。

负能量:寒冷、冷漠、抑郁、消沉。

作用:有安定的作用,让用户沉浸在内容中,从而提高效率。


蓝色是最安静的颜色,通常偏工具型的软件会用蓝色作为主题色,目的是让用户在安静的环境下阅读产品内的文章和相关信息,如图所示。


蓝色的运用


粉色


象征着可爱、童真和甜蜜,经常用在与少女有关的产品上。


正能量:纯真、甜蜜、温馨、萌、可爱、放松、温柔。

负能量:软化、娇气。

作用:温暖人心,丰富画面。


粉色经常出现在女性类的产品中,例如“美颜相机”等一些女性喜欢的软件,可以很好地体现女性的特点,是女性的专属颜色,如图所示。


粉色的运用


黑色


象征着个性,是一种富有时尚品位的颜色。


正能量:品位、潮流、时尚、格调、认真。

负能量:孤独、黑暗、恐怖。

作用:提高品位,加强对比节奏感。


时尚离不开黑色,所以黑色经常用在服装和奢侈品等 APP设计中,如图所示。黑色给人时髦的感觉,在服装界被无数人奉为经典色。



undefined



黑色的运用


色不过三


配色不要超过3种颜色,所谓“色不过三”就是这个意思。


无论是平面设计、网页设计,还是APP设计,都需要遵循这个原则。那么何种搭配才算是不超过3种颜色的搭配呢?


可能很多人认为是不超过3种颜色值的搭配就是色不过三。其实不然,不超过3种颜色的搭配,是指不超过3种色相的搭配。在单个色相中可以运用颜色明度或饱和度来丰富色彩,但是整体色相不要超过3种。


案例分析:

如果设计的界面颜色太多,会是一种什么样的效果?下面我们来看一个招聘网页。


作为一位求职者而言,只是单纯地想找到一份合适的工作,但是一进入主页,各种各样的小广告扑面而来,而且颜色真的是“绚丽多彩”,单从视觉上来看,大部分人是很难接受这种形式的,如图所示。


用色太多的界面


有一种设计叫作“别人的设计”。例如,绿色永远是品牌色,红色就是网站的装点色(点睛色),这是一种传承,是一种经验积累,我们要学会站在别人的肩膀上去设计。


下面来看一下图中的界面设计,统一的主色能加强用户对产品的记忆程度,也让产品的体验感变得更加舒适和自然。


从LOGO的颜色到图标、按钮和风格线的颜色都使用了绿色,绿色(品牌色)在整个网站中被重复使用,从而统一了整体的风格基调。这样的设计让用户使用起来比较舒服,并且记忆尤深。


用统一的主色加强用户的记忆程度


下图中的设计用到了两种颜色,设计师选用了红色和蓝色的冷暖搭配。在这两种颜色中,由于红色更为醒目,所以用在屋顶的360字体上,从而很好地凸显出了品牌;为了平衡颜色的冷暖,将蓝色用在了大头针和水池等场景中。蓝色在整个画面中的使用面积比较小,主要起点缀的作用,但是却很容易被看到。


这个设计体现出了“360防丢卫士”寻找文件的方便性。所以好的颜色搭配能更好地体现产品的特点和功能卖点。

红色和蓝色的冷暖搭配设计


那是不是界面颜色越简洁越好呢?如下图中的两幅设计作品,左图是单一的颜色搭配,设计更为统一,画面更为和谐;右图是多种色相颜色的搭配,界面的功能模块划分得更为明确,区分性更强。


undefined



单色与多色设计


所以,在使用多种颜色进行设计时,还需要考虑产品的内容与核心。三色搭配,只要控制在不超过3种色相的范围内即可。


在界面设计中,色彩对于是否能正确和完整地表现出产品的气质至关重要。这里我要强调一句话:“做精致的颜色,提炼格调”。单一的色相,丰富的明度和饱和度可以让界面看起来更有层次感,处理起来也更容易统一和把控。在用色时,颜色越少越好,但要保证可以正确地传达需要表现的功能和元素。


在每添加一种颜色的时候都需要好好考虑一下,是否有必要加上这种颜色,因为再复杂的设计,色彩倾向也不会超过3种。


来看看下图中的两个设计,左图为了区分内容区域,用了3种颜色,但是整个页面的分割非常凌乱,红色在页面中就是多余的,且功能分割相对来说也是多余的;


右图的设计相对来说要更简洁一些,虽然只用到了两种颜色,但是并不影响功能的分割,反而让作品显得更为成熟。


undefined


用颜色区分内容区域时要谨慎


这里给大家提醒一点,在桌面图标设计中,常常会用到两色和三色的搭配形式,这样的配色可以让图标显得简约而不乏味。


0
阅读原文
|
Report
|
收藏
Share
相关推荐
评论
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
You may like
相关收藏夹
IP形象——动物类
IP形象——动物类
IP形象——动物类
IP形象——动物类
精选收藏夹
作品收藏夹
企业展厅
企业展厅
企业展厅
企业展厅
精选收藏夹
作品收藏夹
ip形象设计+表情包
ip形象设计+表情包
ip形象设计+表情包
ip形象设计+表情包
精选收藏夹
作品收藏夹
企业展厅/文化墙 参考
企业展厅/文化墙 参考
企业展厅/文化墙 参考
企业展厅/文化墙 参考
精选收藏夹
作品收藏夹
小家电
小家电
小家电
小家电
精选收藏夹
作品收藏夹
IP形象及IP内容
IP形象及IP内容
IP形象及IP内容
IP形象及IP内容
精选收藏夹
作品收藏夹
大家都在看
Log in