2021—2022 设计流行趋势【色彩篇】

Homepage recommendation
深圳/UX设计师/3年前/38507浏览
2021—2022 设计流行趋势【色彩篇】Homepage recommendation

本文对2021-2022的色彩流行趋势做了浅显的总结和大胆的预测,欢迎一起交流与探讨!文章中的案例和链接来自于网络,侵权必删

前言

2021,疫情还在蔓延,人类的持久战还在继续,而设计也随着疫情时代的影响从混乱而振奋的趋势下来到2022。在后疫情时代的影响下,除了人们习惯的改变外,95后和00后也成为了新生代的主力军。我们说,设计与时代背景是密不可分的,它是突变,也是渐变的。那在疫情蔓延的影响下,除了给流行风格带来新语言篇章的主力军外,“柔和”、“舒适”、“轻量”也成为了新一年的心灵补给站,给疫情时代人们躁动不安,紧张的情绪带来舒缓和安慰;同时“未来”,“希望”也成为了2022人类所期盼的关键词。跟随人类情感需求的色彩情绪以及新生代的流行风格,我们不妨想象一下2022年关于“色彩”趋势的美学主题。本文将提出4个色彩趋势:酸性美学未来色、流体渐变、弥散柔光、高饱和渐变大胆预测未来色彩领域的美感碰撞,激发美学光谱的灵感。

A-01. 酸性美学未来色

流行指数:🌟🌟🌟🌟🌟

酸性美学是源于迷幻艺术的新兴视觉。它有着反对刻板的特点,挑战传统美感定义的核心。色彩上多用强烈的反差对比,形成视觉冲击,依附3D金属载体而成,这使得它在近两年设计圈大放异彩。用反秩序的七彩搭配金属色泽衍生出“未来色”,打破现实和虚拟的桎梏,用叠翠流金交融的琉璃艺术,将七彩流光,液态流体,材质色感(金属、铝箔、玻璃、塑料、石膏等)结合,塑造未来的可能性。

关键词:高饱和 金属感 材质色 反差对比/霓虹/色渐变 明暗对比 透明感 流体 扭曲 3D



A-02. 酸性美学未来色的亮点

用户第一次见到酸性美学未来色时,也许会觉得古怪,因为特立独行的反叛、繁多不尽的材质色就是它的标签,设计师可通过材质色渲染几何图形、或不规则图形当做背景(也不乏一些纯线性背景),结合高饱和度色彩的超现实主义让主体视觉凸显有致,瞬间吸睛,突出未来和希望感。近两年它的在各个领域出色证明了自己的不拘一格,包括商业海报、潮玩手办、影视综艺等,都不乏它的身影

【Demo】海报:Adobe设计师 Vasjen Katro创作的关于未来主题的海报中采用酸性美学未来色

A-03. 酸性美学未来色的商业应用

【Demo】芒果Tv· IP形象:《青春芒果夜》海报宣传上采用了IP形象“芒果崽”,设计师用具有未来材质感的玻璃作为形象身体,透明的材质可承载多种高饱和颜色,通过特效感的粉、橙、蓝等颜色突出画面的科技迷幻感,使得芒果崽形象十分突出,给整个视觉增添一份未来感。

【Demo】综艺节目 # 潮流合伙人:作为主打潮流卖点的综艺《潮流合伙人》,也不乏未来色的身影,其宣传海报以明星本人为主体,用镭射的金属质地的银色渐变充斥铝箔画面,通过主体对比刻画光影,让海报充满人间烟火的巴适潮流


【Demo】潮玩:较简洁的矩阵型背景构图,让潮玩主体的色彩更加突出,用拟材质的纯粹金、银色装点,高反光打磨,金属感MAX,甚至有一种星球大战的既视感

【Demo】adidas商品宣传:材质色感也是未来色的表达之一,主体鞋子、装饰泡沫的塑材材质加以机械工厂的金属质感场景,也在从另一个角度诠释这种新兴色彩

【Demo】APP:以暗黑背景作为烘托,液态金属为主打。在暗色背景下穿插银色的金属流动,让明暗的强对比突出页面“商品”这个关键元素,在APP的商品详情页中如此应用未来色,无疑显得更有层次感

【Demo】海报:重复式构图+酸性材质感的主体,毫无疑问是未来色的典型运用,往往不需要高饱和的冲击色,用3D金属为载体,流光的色彩打造科技迷幻感,透明感、未来感十足

【Demo】光子设计中心2021年度 SHOWREEL:https://mp.weixin.qq.com/s/2BuALGxofdi3n-gh4fqiYg 腾讯的光子工作室在年度设计作品中的视频封面也采用了酸性美学(弱酸)的风格,结合3D金属和反秩序的七彩搭配衍生出“未来色”。(点击链接可查看视频)

A-04. 小结

尽管人们对酸性美学的褒贬不一,在美学上有着千奇百怪的理解,但不妨碍它在色彩领域的大放异彩。通过线性、几何、材质色渲染的不规则式图形当背景,用高饱和度鲜明的主体或超现实主义加以七彩流光、金属塑材等材质渲染,让它有了特立独行的科幻感,如今设计领域的弄潮儿也对它有了新的诠释,那就是“未来色”。

B-01. 流体渐变

流行指数:🌟🌟🌟🌟🌟

流体渐变源于酸性美学和传统渐变,却又区别于两者的衍生物,它更像是酸性美学的七彩流光或材质色的新拟态出的抽象渐变,如果说酸性美学是更倾向于实物化,那么流体渐变就是拟态主义。流体意味着视觉上更具“动态张力”,在设计视觉上能给人更强烈的感官刺激,它包含着:低饱和轻量、高饱和反差、材质色拟态 3种色彩结合手法。线性流体、面性流体,抽象拟流态(极光态,扭曲态,拟流态),颜料类流态4种表现形态。液体是没有边界和尽头的,从点、线条、画面甚至画面之外延伸,它可以是任何形状,任何颜色,组合出无限可能,也意味着它的应用趋势无处不在。

流体渐变3种色彩结合手法:

低饱和轻量特点:色彩的运用上采用低饱和渐变,幅度轻柔,缓慢,宁静、治愈的感受氛围

高饱和反差特点:色彩采用高饱和反差颜色进行碰撞,渐变幅度大,让画面瞬间吸睛

材质色拟态特点:多以金属、玻璃、塑料、液态等天然色拟出的渐变色彩,可写实可虚拟

流体渐变4种表现形态:

线性流体特点:用材质纹路、线条等绘制出来的拟态流体,更具空间延展性

面性流体特点:用气泡、晶体、液体等绘制出的动态扭曲的面性形状。极大的增强有机拟态视觉效果

抽象拟流态特点:多用拟极光态,扭曲态等抽象化流体的语言来表达画面

颜料类流态特点:用各类颜料类笔刷渲染画面,颜料色流动的感官冲击会让画面更具质感

B-02. 流体渐变的亮点

普通扁平化设计缺少刺激感官的设计元素,而加上动态的流体手法能够帮助用户更好地感知和理解设计为画面创造深度与广度。流体渐变的应用场景广泛,不管是字体还是背景,都能承载,给用户营造视觉焦点,并通过渐变色彩的强弱来引导用户视线。而流体同时带有动感与节奏,是一种简约且高度可用的元素,塑造不间断的视觉冲击,但又不会出现信息量过载的情况。这使得流体渐变成为一种富有感染力又应用广泛的设计弹药库。

【Demo】海报:将颜料类流态附着在人物形象上形成超现实主义,吸引用户视线

B-03. 流体渐变的商业应用

【Demo】品牌宣传:颜料类流态在商业品牌商应用日渐广泛,如以logo为载体,可让耐克品牌的简约logo,具备了深广度,丰富度,也迎合了运动品牌用户的年轻时尚风

【Demo】Web:对于没有单一主体的banner、web上用材质色拟态不失为设计方向的绝佳选择

【Demo】海报:如果你想让海报简约的同时又具备丰富多样色彩和延展空间时,用抽象拟流体的手法一定可以帮到你,各种颜色能相互交融却又不会突兀

【Demo】App:3D化面性流体的手法作为APP的背景使用时,可以不断塑造动感的视觉冲击力

【Demo】包装:在商品包装上,透过流体渐变的多色彩包容性,能让简约风的高级感发挥的淋漓尽致

【Demo】VI:用抽象拟流体的手法凸显此类名片的核心要素,在这个简单的卡片上,更能突出重点、标志性与视觉感染力


B-04. 小结

流体渐变得益于轻量、视觉张力、包容性强、自然普遍的特点,应用场景十分广泛,它能承载的形状和颜色包罗万象,是可用性极高的设计色彩形式,既可以塑造高视觉张力的画面,又能保障用户轻量化阅读,更自然的渐变构建独特的主视觉,在应用过程中,还能和更多载体创造可能性,延伸出全新的、惊艳的视觉体验,是未来几年将富有更多可能性的设计解决方案。

C-01.弥散柔光

流行指数:🌟🌟🌟🌟🌟

弥散柔光是一种轻量舒缓的设计色彩,它的色彩渐变手法让光晕缓慢过度直至贯穿整个画面。它包含着:同色相弥散、类似色弥散、差异色弥散 3种色彩运用。线性弥散、径向弥散,网格弥散3种表现手法。在设计场景中通常以圆形、矩形的手法出现,整体视觉感知柔和、轻松,舒缓,治愈。是当下十分干净清爽的新设计方向。

弥散柔光的3种色彩特征:

同色相色彩特征:同色相不同饱和度的渐变,从高饱和到低饱和的过渡,多以白色近光感结尾

类似色色彩特征:多以30°左右的类似色过渡到基色再到低饱和的类白色光感结尾

差异色色彩特征:多以60°,90°,120°,180°左右的差异色彩结合白色光感进行弥散

弥散柔光的3种弥撒手法:

线性弥散手法:由指定的垂直方向递进弥散,逐渐模糊虚化至光感,延续空间性

径向弥散手法:以圆的中心点向外弥散,内发光或外发光,多通过圆形圆周化的表现光斑的运动性

网格弥散手法:通过网格锚点,将不同的颜色散布在“网格”中,叠加得更有层次感

C-02.弥散柔光的亮点

干净舒缓的弥散柔光具备着“柔和”、“舒适”、“轻量”、“治愈”的亮点,让人审视色彩的同时,不觉疲劳,感受光感的普照,可以用类图形、线条等载体结合弥散柔光进行视觉表达。在如今的疫情时代,更可以用这种柔光的语言表达,给以人们躁动不安,紧张的情绪带来希望的慰藉,打败阴霾。

【Demo】海报:轻柔的径向弥散手法案例,页面干净整洁、简约清爽,信息明确

C-03.弥散柔光的商业应用

【Demo】Web & App:典型同色相弥散的运用,不寻常的是,加上了模糊和噪点的手法,使得即使颜色抢眼鲜艳,也不会喧宾夺主,页面主体突出

【Demo】海报:不拘泥圆形的弥散,矩形、波纹形的弥散手法,色彩和图形有方向的运动叠加,很好的呈现了组合的画面,如海平线日出的画面,很有日式风格

【Demo】VI:各类弥散柔光,想法和运用胆大心细,很简单的排版设计都可以呈现的虚实有度

C-04. 小结

作为一种轻量化的柔和设计色彩,也许它没有强烈的视觉冲击,也没有瑰丽的浓墨重彩,但却有着自己的自成一派,通过弥散柔光的运用,让页面呈现出柔和的细腻感,它可以大胆的颜色碰撞,却又小心翼翼,尽管它总以颜色到透明、白色的“结尾”,但从不是简单一个渐变,它的光是照射进生活色彩的柔美

D-01.高饱和渐变

流行指数:🌟🌟🌟🌟

如果说前三种色彩是当下或未来一年的流行趋势,那么高饱和渐变就是耐克店里的AJ1,永远的经典款。自带吸睛体质的高饱和色彩总能在第一时间抓住用户的眼球,既可以用霓虹色渐变、对比色渐变的运用hold住用户视觉落点,又可以用中差色渐变、邻近色渐变叠加出天马行空的视觉盛宴

高饱和渐变的4种色彩流行组合:

霓虹色渐变特征:以蓝紫红为大面积占比的主色彩渐变,有时也包含小占比的其他色(分应用场景)

互补/对比色渐变特征:用两个或两个以上距离180°左右的色彩相撞,产生最强烈的对比

中差色渐变特征:用取值范围相差90°左右的中差色叠加

临近色渐变特征:高饱和度的临近色彩为基调,相较同色相渐变颜色更加个性,丰满却不凌乱

D-02.高饱和渐变的亮点

如果你以为高饱和渐变就意味着大红大紫,那就误会了,它是前卫的,弄潮的、骚气的、活跃的,任何高饱和的色彩都是它的武器。高饱和渐变能够刺激人的感官,激发兴奋、冲动、购物欲,形成难忘的色彩搭配,所以在很多电商大促、品牌专柜中不乏它的身影。同样也注定了它是把双刃剑,如果无节制的过度使用,反而会带来视觉上的疲劳。

【Demo】海报:在此类线框海报中,使用高饱和渐变,可以快速在文字中形成焦点,纯黑的空洞背景也因此有了高级感、可读性,打造出厂牌形象标

D-03.高饱和渐变的商业应用

【Demo】霓虹色渐变的应用:在游戏场景、海报宣传、门票设计、舞美上都能广泛应用,高饱和的红蓝紫等色彩塑造霓虹光感,使得整个画面具备前卫的感染力和年轻化的活力

【Demo】互补/对比色渐变的应用:在商标、商品上运用2种或2种以上的对比色渐变,形成有力的视觉冲击,刻画品牌形象在视觉记忆中,强化了品牌识别度

【Demo】中差色渐变的应用:在运动品牌海报上,构建鲜明人物主视觉,画面充满张力、活力

【Demo】临近色渐变的应用:通过邻近色的渐变,赋予画面设计个性的同时又不会造成视觉负担,让平常的办公用品也可以更出彩且高级潮流

D-04. 小结

高饱和渐变有着前卫时尚的画面效果,作为一种高度可复用的色彩,它可以打造一眼难忘的视觉冲击,也可以塑造强烈风格化的骚气,这也是高饱和渐变多年来成为“经典款”,被广泛应用的原因。如果按人的动物性格代入,那么高饱和渐变一定是孔雀型人格了。也相信高饱和渐变在未来的流行趋势中也会继续大放异彩,始终经典~

👍【推荐】25款精选配色工具:https://www.uisdc.com/25-color-matching-tools(链接内容来源于网络编辑者)

1044
Report
|
2019
Share
相关推荐
机·智——第十八届上海青年美术大展
Homepage recommendation
内容含视频
Typeface Collection ①
Homepage recommendation
假面绮宴 | 心动的王者系列视觉
Homepage recommendation
内容含视频
得物野人30项 | 带上顶配,玩点野的
Homepage recommendation
内容含视频
教程
教程
教程
教程
精选收藏夹
作品收藏夹
手写logo字体设计209辑
Homepage recommendation
评论
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
You may like
8月的“话”
Homepage recommendation
相关收藏夹
教程
教程
教程
教程
精选收藏夹
作品收藏夹
教程
教程
教程
教程
作品收藏夹
教程
4722
设计不設計
设计不設計
设计不設計
设计不設計
作品收藏夹
设计思路
设计思路
设计思路
设计思路
作品收藏夹
文章
文章
文章
文章
作品收藏夹
设计
设计
设计
设计
作品收藏夹
大家都在看
Log in