画面由一个紧张元素撑满,
主标题作为次要元素合营画面平衡
韩国是继中国、日本之后的亚太地区第三大电商市场,它拥有环球最快的互联网速率,电商覆盖率极高。

本文以韩国大型生活超市emart网站的电商设计为例进行剖析,文章紧张分为四大块:
· 构图剖析(总结出四大类型)
· 配色剖析(从配色根本事理出发剖析)
· 赞助元素运用(剖析其大规则)
· 实际运用(我们该怎么做?)
构图
构图一:中央集中式
画面由一个紧张元素撑满,主标题作为次要元素合营画面平衡,根据画面需求添加小标签装饰。整体视觉冲击力强、张力足,适用于单个产品以及细节较为丰富的产品。多个物体集中式构图和此方法同理,不再做单独剖析。
构图二:杠杆式构图
画面由主体物和次主体斜面对称而形成的杠杆关系,与主标题之间形成稳固的三角布局关系,此构图办法画面很饱满、稳固。适宜两种产品或一个产品两面展示时利用。
注:此构图名词参考张子建《气韵设计理论研究》,详细可拜会其详细。
构图三:顶视角分散式构图
顶视角度,以一个中央点向外发散,适用于产品展示比较多的情形。对付发散过程中的节奏以及气韵走向的把握很主要,画面出彩但比较难掌控,因此在广告的运用中不常用。
构图四:折线跳跃式
产品悬浮在画面中,高下可跨出画面,加以恰当的笔墨排版和赞助装饰,整体画面效果很生动,延展性很强,是一种能快速达到视觉表现的展现办法。此构图办法运用广泛。
配色
色彩理论根本
上图为参考示意色环。
我们常见的配色办法有同色系、相似色、互补色、比拟色搭配,这里在互补色里面划分出了补色分割(与互补色相邻的两边的颜色)以及单边补色分割,此配色办法的目的是为了让配色在形成光鲜比拟的情形下又能有较高的融入度,较互补色而言柔和很多,补色分割在emart广告里面用的很多。
而矩形分割、广场分割则是在多色搭配情形下涌现的配色办法,下面我们单独举例解释每个配色办法。
单色/同色系
同色系搭配比较适宜产品本身颜色比较统一的情形下,通过吸取产品较近的周边颜色而成,再通过添加得当的赞助元素使画面变得统一而丰富。
类似色
类似色相对付单色系可变革的范畴会大很多,但也是在主色调明确的情形下赞助添加类似色,这类配色办法在banner运用中还比较常见。是一种比较好掌控的配色办法。
补色系列
这里把互补色、单边补色分割、补色分割三种情形一同来说,由于三者在大范畴内高下浮动,效果也颇为相似,并无特殊明显的区分。
emart 在补色上的运用比较广泛和娴熟。紧张还是由于全体网站调性很活泼,加之产品都属于色彩明快的快消品类,色彩上的愉悦感更随意马虎激出发点击希望。
我们创造emart直接用互补色设计的案例并不多见,紧张还是在补色分割范围内的运用变革,这样既能达到很好的视觉比拟效果又能使画面领悟度较高。
这里挑选了几个补色系里面比较有代表性的搭配办法,全体画面视觉配色上相称生动,主产品很突出,是一种很赞的传达办法。
多色搭配系列
这里把比拟色、矩形分割、广场分隔多颜色的搭配归为一类来说。这三种跨度较大的配色办法,相对来说运用的比较少,不是很随意马虎掌控,一样平常比较适宜小面积的运用起到装饰平衡浸染。
纯度与明度的把握
纯度和明度的把握紧张还看我们希望传达出的整体视觉效果是若何的,根据产品调性、画面效果来实际匹配才好。
赞助元素
emart网站banner在赞助图形的运用上特殊广泛,一来增加画面丰富性一来强化产品特性。紧张是提取产品干系的元素进行图形化,有小面积的纯属强化功能或增加意见意义性的添加、也有大范围的对产品纹样或特性的延展。紧张还是在产品特点根本上进行提取。
在banner标签运用的样式上也很丰富,在类似样式下所衍生出的演化很多,根据banner特点进行不同配色、时而实底、时而镂空、或黑白搭配,演绎出很多可能性。
从上面三大块的剖析来看,emart在广告设计上紧张特点为
· 构图大胆、主体突出、画面延展性很强
· 配色活泼且有理有据
· 赞助元素点缀很到位、丰富而强化特点
关键点:开放、多元化、有自己的性情
我们该怎么做?
这是emart上涌现的大部分家电banner图,我们创造他们的颜色变革并不大,在蓝和暖灰两种之间用的比较多,一是由于产品本身以黑白色系为主,所能衍生出的颜色并不多,再者网站本身多颜色的产品和banner已经很多,穿插更为朴素的电器配色更随意马虎被识别出来,符合产品性情。
那我们在专门的自有商城网站上该如何把握配色呢?我认为是可以有所打破的。
我们的实际运用
大件冰箱、长方形造型,很难完全展示,为了突出质感选择了放大高下两个面同时展示,并且配上新鲜蔬果来强化产品特点且增加画面活力。
空气炸锅,由于自身小巧,且特性明显,决定用折线跳跃式的构图办法来增加画面生动度,而鸡翅炸物作为产品功能的强化进行点缀,背景配色和标签配色分别和产品及食品的颜色对应。
除螨仪banner配色上用到了蓝色的单边互补色黄色形成强比拟,而标签则选择了蓝色的互补色,螨虫的实物图并不好看以是这里选择了把它图形化来表示增加场景化代入感。
此图为常规摆放构图,两款产品,紧张把重心集中在好看的那款产品上,加相应颜色感比较强的食品赞助。
图二则是较为活泼的折线跳跃式构图,这类构图形式比较随意马虎出效果,但是对付元素的提取和摆放须要多多推敲下。
图三则是完全展示+局部放大的办法,实行步骤实在很大略,紧张看我们怎么去抓取他们的表现点,选到最适宜产品性情的表现办法。
总结
设计很难说有一个绝对的运用规范或原则,所有的设计都该当是开放的,但设计剖析让我们有了更明确的思路和方法论来完善设计实行,这里分享出来和大家一起学习。