*图片来自网络
我们在设计品牌色彩结构的时候,需要遵循一些规则,以确保品牌的视觉识别性和一致性。以下是我梳理的一些主要规则:
1.一致性
一致性主要是在应用上,也就是说,如果我们设定了一整套色彩系统或者色彩结构,我们需要保证品牌色彩在任何的场景下或者媒介下都是具有一致性。
比如谷歌的品牌系统色调的延伸设计(如下图):
2.目标受众
需要考虑用户对品牌色的接受程度,尽可能选择用户喜欢或者常见的色调来做品牌主色调,并且基于这个方向,设计出更高级的色彩质感。
*图片来自网络
3.品牌价值观
色彩是品牌传递的一个比较直观的工具,如我们上面写到的,不同颜色代表不同的情绪、情感,因此我们在设定品牌色彩的时候也需要结合色彩情绪来取定义。
*图片来自网络
4.竞争对手差异化(可识别性)
品牌色差异化,是品牌设计师最基本的思考概念,避免与竞争对手产生重叠,确保自己的品牌色与竞争对手有足够大的差异化,才能产生独特点,从而让用户或者消费者可以记住品牌特点,从而提升自身品牌的可识别性,使消费者在看到品牌色时能够迅速联想到自家的产品。比如瑞幸和星巴克的差异化
*图片来自网络
5.灵活性
色彩的设定不应该是一成不变的,结合品牌宣传的需要或者产品的需要,需要设计出一定的色彩容错率或冗余。或者在设计之初提前对于多场景的应用进行考虑,保证品牌在不同的时间段、不同的场景下都具有较高的灵活性。比如Apple的品牌特性,每一年的品牌大会,品牌logo的设计都会变,随之品牌色调也会有特定的设计。
*图片来自网络
六、颜色的行业应用差异行业与行业直接的使用色彩是有一定的认知壁垒在里面的,当然这个认知不是本来就有,而是长久以往被大环境的影响产生的,比如一个卖金的商家或者餐饮的商家,不太可能把品牌色设定为冷色系,科技化的公司也比较少把品牌色设定为大红色。
色彩的认知是会直接烙印在人的大脑的,行业的色彩壁垒也是如此,这个壁垒收到基层逻辑影响,比如长久以往的所看到的影响或人类作为生物天生的认知,都会导致不同行业之间的色彩的差异壁垒。
不同行业通常会有特定的配色方向,以体现品牌的特性、业务性质,但这不是唯一的选项,只是设计行业发展多年的一份趋势,设计师可以依据一些趋势去大胆的提出自己的想法,帮助品牌主在行业红海中突出自己的品牌调性。
1.科技行业:
科技行业大多以蓝色主要主要色调,蓝色通常可以代表创新、信任、可靠性和平和,也有少部分使用绿色或者红色。
*图片来自网络
2.金融行业:
蓝色、金色通常是金融行业比较常见的色彩,蓝色可以表达出一种商务化氛围,选择较深一些的蓝色则会更透出一丝的沉稳的气质,而金属通常作为辅助色彩,使用在一些产品宣传物料上,金色给人一种自然的尊贵感,前面也提到,金属很具有VIP的情绪氛围。
*图片来自网络
3.医疗行业:
医疗行业给人最大的色彩认知就是蓝色、绿色、白色,整体给人一种冷静、清洁、安全的感受,白色和灰色用于提供专业性,而绿色和蓝色用于传递健康和舒适感。
*图片来自网络
4.食品和餐饮行业:
特性颜色:红色、橙色和黄色在食品和餐饮中很常见,因为它们能够激发食欲和活力。
中性颜色:常常使用中性的棕色、米色或黑色(日料店很喜欢使用黑色作为主品牌色),以与食品本身形成对比。
*图片来自网络
5.时尚行业:
时尚行业比较常看到的色彩是黑白灰,但是时尚行业比较受消费程度和季节性趋势影响,越高级的品牌设计越简约,这也导致了品牌色调的简洁化,比如GUCCI、LV等大牌的品牌色都是黑色主调,但这不影响他们在产品设计中去使用别的颜色,这就是品牌色彩的“灵活性”最好的体现
*图片来自网络
6.艺术与文化行业:
艺术行业来说比较少有特定的颜色,因为整体行业跨度比较大,大家对于艺术的认知比较少有固定的认知。
*图片来自网络
男、女及儿童的色彩设计差异:
男性与女性乃至儿童的色彩设计也是具有一定的差异性的,男女性的色彩差异比较好划分,从男女的心理上来说,男性比较偏理想,女性比较偏感性,因此就造成的在这2个方向下的色调差异,儿童的话则是另一个范畴,从非严格的意义上来讲,任何的颜色都适合儿童。
男性行业的颜色比较偏冷色系,比如蓝色、绿色或者黑白灰等,而女性行业的颜色则会偏暖色系,比如粉色、紫色、红色、黄色、金色…等。但儿童行业的颜色通常会使用明亮、活泼、多彩的色彩,以吸引儿童的注意力,传达欢乐、友好和有趣的感觉。
*图片来自网络
七、背景色对设计的影响背景色是我们在设计时候比较重要的一个因素,控制好背景色与前景的关系,可以大大提升设计的质感,相反,如果背景色过于抢眼则会导致主题弱化,变得喧宾夺主。
我们在设计背景色的时候主要从几个维度来进行考虑:
1. 保持一致性
保持与前景颜色的一致性,这样的背景色可以达到一种协调统一的美,比如前景是一种暖色调,我们在设计背景色时只需要考虑把前景物体颜色进行降饱和或者降亮度的方法来处理即可。
*图片来自网络
2. 对比突出
对比突出是一种比较大胆的设计方法,采用与前景互补的颜色来进行设计,可以大大提升画面的跳脱感,提升一些活跃的程度。
*图片来自网络
3. 使用中性色
如果你对背景使用什么样的颜色没有注意,那么可以考虑使用一些比较中性的颜色,比如黑白灰,或者一些比较低饱和的混合色,比如绿色
*图片来自网络
4. 使用最靠近背景物件的色彩
如果前景具有一定的空间感,我们可以考虑使用最靠后的物体的颜色来作为背景色。来达到空间的延伸。
*图片来自网络
5. 使用品牌主色调或者辅助色
比如discord或者Apple的设计,就比较常直接使用品牌色或者辅助颜色作为网站设计的背景色,这样可以直接在视觉上给人直观的色彩调性。
*图片来自网络
八、潘通色PantoneMatching System(PMS)是一种广泛用于颜色标准化的色彩匹配系统。它是由美国公司Pantone LLC开发的,旨在提供一种标准的、精确的方法,以确保在不同的媒体和设备上能够精准地再现相同的颜色。
潘通基于不同的场景开发了2种场景使用的颜色系统,一种是平面设计上使用的,编号为“PMS”开头;另一种是家居 室内装潢应用的,分别是“TCX”指的是纺织品,“TPG”指的是颜料及图层。
潘通目前已经研究了15000多种颜色,目前设计软件主要是和Adobe合作,也有提供独立的APP供用户进行使用。
我们可以再潘通的官网了解到很多关于色彩趋势的文章,相信对喜欢色彩设计的你来说会很有帮助,网址:https://www.pantone.com/hk/tc/articles/colors
潘通过去这些年发布了很多的年度主题色,我们可以来看看每一年的色彩。详细可以进入网站查看:https://www.pantone.com/hk/tc/articles/color-of-the-year
九、取色工具分享我们在设计的时候,大多使用软件来吸取颜色,对于设计师来说这无疑是最方便的工具,但是如果你不是设计师或者你懒得打开设计软件的话,那么这些取色工具对你将非常有用。
1. Adobe Color Wheel
Adobe Color Wheel是Adobe提供的在线配色工具,可以帮助用户选择、调整和预览颜色方案。
链接:https://color.adobe.com/zh/create/color-wheel
2. Color Hunt
Color Hunt提供了各种由设计师创建的精选颜色方案,用户可以浏览、筛选和获取相应的颜色值。
链接:https://colorhunt.co/
3. Paletton
Paletton是一个在线色彩方案设计工具,用户可以通过选择基础颜色来生成单色、对比色、三角形配色等方案。
链接:https://paletton.com/#uid=13h0u0kleqtbzEKgVuIpcmGtdhZ
4. WebGradients
WebGradients是一个在线工具,提供了丰富的渐变颜色方案,用户可以预览渐变效果并获取相应的颜色代码。
链接:https://webgradients.com/
5. Image Color Picker
Image Color Picker是一个在线取色器,用户可以上传图片或提供图片链接,然后点击图片获取所选位置的颜色信息。
链接:https://imagecolorpicker.com/
6. HTML Color Codes
HTML Color Codes是一个简单的在线工具,用户可以通过选择颜色或输入颜色代码来获取颜色信息。
链接:https://htmlcolorcodes.com/color-picker/
7. ColorHexa
ColorHexa是一个强大的在线色彩工具,提供了对颜色的详细解析,包括颜色的多种表示方式、调色板和相关信息。
链接:https://www.colorhexa.com/926471
8. Coolors
Coolors是一个在线配色工具,提供了创建、调整和探索颜色配色方案的功能。用户可以使用该工具生成随机颜色方案,并获取对应的Hex和RGB值。
链接:https://coolors.co/
9. CSS Gradient Generator
CSS Gradient Generator是一个在线渐变生成器,用户可以选择颜色和渐变类型,然后获取对应的CSS代码。
链接:https://cssgradient.io/
十、使用灰度鉴别色彩合理性如果我们在设计的时候,不知道使用的颜色是否过于泛滥,那么可以通过“灰度”的方法来进行测试,灰度的是一种常见的设计技巧,通过黑白灰的模式,来去看整体设计的色彩状态、色彩平衡感,以及饱和度情况。
我们在日常的设计中,在大部分的场景下都需要使用到,比如摄影、KV头图的设计、插画设计、品牌色应用、图标设计等等。
测试灰度的方法也比较简单,我们可以通过软件的去色功能或者把饱和度调到最低的方法来进行测试,去色之后,我们就可以通过色阶来查看色彩黑白灰的情况。
案例一:摄影图片
如下面2个图,图一:黑白灰的分布均有所保留,深色和灰色相对较多;图二:没有深色调,整体图片灰色调更多一些。
案例二:海报图
如下面2个图,图一:黑白灰色调均衡;图二:缺乏深色调,整体色彩比较偏浅。
总结
今天分享的的内容属于色彩设计中中的一些基础内容,更多的色彩设计还需要结合实际的产品、内容、场景来进行发散和重新定义,这样设计出来的内容才会更加具有支撑点,也会更加具有落地意义。
本文由 @DD的设计站 原创发布于人人都是产品经理。未经作者许可,禁止转载。
题图来自Unsplash,基于CC0协议。
该文观点仅代表作者本人,人人都是产品经理平台仅提供信息存储空间服务。
,