网站设计案例分析：看看韩国线上商店banner设计值得借鉴的地方

在这个「颜值即王道」的时代，不管什麽东西，只要足够好看就能吸引更多目光，线上商城设计也不一样。韩国线上商店设计久负盛名，今天Inspirr将从构图、配色、辅助元素这三方面，对韩国大型生活超市Emart网站的banner设计为例进行分析，希望大家能从中获得更多灵感。

网站设计案例分析：看看韩国线上商店banner设计有什麽值得借鉴的地方

网站设计案例分析一：四大构图类型

在UI设计中，图形设计、交互设计、色彩搭配，乃至图标设计等等都离不开沟通技巧，因此掌握构图技巧对加强界面的层级关系非常重要。下面，就让Inspirr为大家说说Emart网站banner设计使用了哪四种构图类型：

构图类型①：中心集中式

网站设计案例分析

Banner以图片作为主元素撑满整个画面，而主标题则作为次要元素平衡画面，再根据界面主题需求添加合适的装饰元素，加强整体视觉冲击力。

构图类型②：三角式构图

网站设计案例分析

Banner中的主物体、次物体和主标题形成稳定的三角形构造关系，使整体画面显得非常饱满、稳定。

构图类型③：顶视角分散式构图

网站设计案例分析

顶视角分散式构图，适用於需展示较多产品的情况，虽然能让画面非常出彩，但对於产品发散过程的节奏和走向较难掌控。

构图类型④：折线跳跃式

网站设计案例分析

产品悬浮於画面中并仅展示部分，配以适当文字排版和装饰元素，使整体画面效果变得更加活跃，也加强了画面的延展性。

Emart网站设计案例分析二：配色

● 色彩理论基础

配色方案的运用吸引用户注意力的常见手段，更是向用户传达情绪的有效手段。想要恰到好处地运用色彩，设计出令人赏心悦目的作品，就必须掌握基本的色彩理论。下面，就让Inspirr为大家说说Emart网站banner设计运用了哪些色彩理论基础知识：

色彩理论基础知识①：单色/同色系

网站设计案例分析

同色系搭配适合产品本身颜色比较统一的情况，通过运用与产品较接近的周边颜色，再搭配合适的辅助元素，就能让画面变得统一而丰富。

色彩理论基础知识②：类似色

网站设计案例分析

类似色的可变化范畴会相对比同色系要多，在主色调明确情况下添加类似色作为辅助色，使画面形成明暗层次，给人一种简洁而单纯之美。

色彩理论基础知识③：补色系列

Emart 网站在补色上的应用比较广泛，这主要是因为这个网站的调性很活泼，同时产品属於色彩明快的快消品类。画面使用补色配色方案，既能很好地达到视觉对比效果，同时又能提高画面融合度，增加用户的愉悦度，更容易地激起他们点击慾望。

色彩理论基础知识④：多色搭配

网站设计案例分析

当设计需要更多颜色时，可以尝试三色或四色方案，但由於这类配色方案掌控难度较高，因此在Emart 网站的应用上较少。为了达到画面平衡，建议使用一种颜色作为主色调，一种作为辅助色调，其余一种或两种作为点缀色。

Emart网站设计案例分析三：辅助元素

辅助元素在Emart网站banner设计的应用上非常广泛，一来可以增加画面的丰富性;二来可以强化产品的特性。

网站设计案例分析

辅助元素主要以产品相关元素进行图形化，能有效强化功能特性，增加画面趣味性，以及对产品纹样或特性进行延展……

此外，辅助元素在icon样式上的应用也非常多样，可根据画面的特点延伸出不同类型、不同样式。

【总结】

从上述内容的分析，可以看出Emart在网站设计上的主要特点主要有三，分别是：

▪ 构图大胆、主体突出、画面延展性强

▪ 配色活泼且有理有据

▪ 辅助元素点缀很到位，能强化功能特点

文中所针对的banner设计主要作为日常宣传形式上展现，但大促及大型活动时的设计不能过多参考上述案例，而是针对活动的主题制定一个更明确的思路和方法完善整个网站设计的视觉效果。