设计

设计

客服

运营

摄影

搜索

新闻中心> 电商资讯> 淘宝> 电商Banner常见淘宝美工设计技巧,值得收藏!

电商Banner常见淘宝美工设计技巧,值得收藏!

作者: 小匠 来源: 2017-07-27 14:06
      Banner 3宝

      1、图案图形节奏感

      2、装饰碎屑气氛足

      3、分割背景更活跃


      一、图案图形节奏感

      图案指的什么?图案相比大家都知道,也或多或少用过。淘宝美工图案放大可以变得大气,缩小也可以很精致。

      而Banner中经常会出现的图案大都是几何形状的重复或旋转得到的图形,用来做为背景的纹理来丰富背景的细节感。有时候有人经常会说背景里少了点什么,下次你不妨尝试一下用用。不是一定要用,如果你需要可以试试效果呢。

      举个例子:

电商Banner常见淘宝美工设计技巧,值得收藏

电商Banner常见淘宝美工设计技巧,值得收藏


      采用一个几何形状通过平移重复得到的图案,在应用在纯色的背景上我把它称之为图案。案例中的背景采用了纯色背景搭配,没有过多的颜色。在这种情况下为了使背景避免过于简单,所以加上了菱形的美工兼职设计图案来丰富背景的细节和层次。

      图形指的什么?有人可能会问了,图案和图形的区别是什么呢。图案是通过复制平移得到的,而图形可以通过复制平移和循环放大某个形状得到的图形。图形比图案的节奏感往往会更强一些,图形需要手动去调整和复制,可以做更多的差异化重复。而图案则是规律性更好。

      再举个例子:

电商Banner常见淘宝美工设计技巧,值得收藏

      图1:案例中的图形是通过相同的圆角矩形,长度和宽度的变化来组合成了更强的节奏感。它可以是色彩变化多端,也可以是单色深浅变化。

      图2:案例用了三角形向上循环重复使用,并且通过改变颜色深浅增强了空间感。其实上面还加了一成三角线的图案,不知道小伙伴们你们看到没。

      看对比01-背景有图案和没有的区别:

电商Banner常见淘宝美工设计技巧,值得收藏

电商Banner常见淘宝美工设计技巧,值得收藏

      我就拿一个三角形图案Banner对比添加和不添加图案的感受,在没有添加图案的情况下虽然这个案例在其他方面我做了挺多视觉表现,但是没有图案还是会感觉少了一点节奏感和细节。当我们为背景层添加了图案之后,画面变得饱满、同时也增加了促销的感受。


      图案的应用
电商Banner常见淘宝美工设计技巧,值得收藏

      第一个案例中用到了3种图案,圆、星、竖条都是来烘托页面背景。其中竖条属于图形重复。
电商Banner常见淘宝美工设计技巧,值得收藏


      第二个案例用到了类似波浪线的图案,这些图案总是会给人与生俱来的节奏感。

      图形的应用
电商Banner常见淘宝美工设计技巧,值得收藏

      案例中是由多边星形由小发散的图形,是不是有很强的节奏感。图案不仅是平铺重复得到,它还可以由一个基本型放大-复制-放大这样循环得到的图形(也可以说是放射性构成)



      在这样一个背景纯白的视觉上面,大胆的使用单个倾斜长条复制得到的背景图形,与模特姿态和五彩缤纷的元素组合起来巧妙的产生了有节奏感。

      二、装饰碎屑气氛足

      Banner设计中经常用到会有彩礼飘带、矩形、三角形、红包外形、横条等装饰。
电商Banner常见淘宝美工设计技巧,值得收藏


      案例中都具备图案、图形,密集的点点图案使背景更有细节、圆形的多个复制的图案让画面更饱满,飘起来的装饰是不是也有大有小。

      三个需要注意的方面

      1)有大有小

      最基本的基础,因为大小产生空间感、节奏感。

      2)别克隆

      别克隆的意思就是不要所有元素都重复的使用,案例中的三角形有描边的、填充的、几何体,元素更丰富了,但适可而止。

      3)有深有浅

      案例中三角形的颜色有深浅看到了吧,这样做是让画面不会很平没有远近感觉。


      三、分割背景更活跃

      有人问我这个Banner用什么分割呢?圆形、矩形?当场我就愣住了,只想静静。这个你自己想用什么分割都可以呀,不同的分割给人不同的视觉感受。搞清楚你想要的就知道用什么了。

因为它在Banner设计中的确是很有效果的,所以我们不仅需要实践,还要进行对比分析,这一我们才会成长的更快嘛。

      一个案例来演示下,同一主题不同分割的应用。
电商Banner常见淘宝美工设计技巧,值得收藏


      矩形的分割应用



      △ 无分割



      △ 有分割

      在这里举例矩形的分割,倾斜的会更加利落一些。还有别的方式我就不一一举例了,大家多留意观察和收集

电商Banner常见淘宝美工设计技巧,值得收藏

      圆形、三角形的分割应用



      △ 圆形



      △ 三角形

      圆让人看起会有圆滑、包容的感受,而三角形是干净利落到底的感受。形状的大小、位置,在文案后面还是模特(商品)后面,都是可以变动的。不同的地方感觉会不一样。背景的分割会让你的画面变得有层次,多尝试就会有慢慢对分割有一定的认识和感受。


      Banner3宝回顾总结

      1、图案图形让画面变得节奏感

      2、背景分割没有特定的形状,而是看你需要什么形状

      3、配色切勿亮色配亮色、暗色配暗色

      优秀的设计案例还有很多这个需要大家平时的采集和观察,更多的思考你会发现更多的空间。

在线咨询:

售后咨询:

云匠网移动淘宝美工二维码