
1.1 认识网店美工
网店美工是网店运营过程中一个非常重要的职位,主要负责图像的美化、店铺的装修及页面的设计等工作。网店美工不但可让拍摄效果不够美观的商品图像恢复原来的色彩,还能让店铺更加美观、更能吸引顾客的驻留。下面将对网店美工的基础知识进行讲解。
1.1.1 网店美工的工作范畴
与常见的美术工作者不同,网店美工主要负责网店的店面装修,以及商品图像的创意处理。与普通的美工相比,他们对平面设计与软件的要求更高,需要掌握更多的知识。下面对网店美工的工作范畴进行介绍。
● 店铺特色的创造:优秀的网店能给人留下良好的第一印象。目前网店中同类型的店铺繁多,若想在众多的店铺中脱颖而出,特色就变得十分重要。只有展示出属于自己的店铺特点,才能够吸引更多的顾客驻足并选取商品,从而增加交易。所以网店美工在美化商品时,创造出属于自己的店铺特色是成功的第一步。
● 商品的美化:使用相机拍摄出的商品照片是不能够直接上架的,为了体现商品的特色,对商品进行美化和修饰必不可少。但是需要谨记,网店美工不是单纯的艺术家,让顾客接受你的作品才是最重要的。
● 店铺的装修与设计:网店美工不单单是将图像处理出来再按照淘宝中自带的模块进行添加,一个好的网店美工不但需要掌握基本的技术方法,还要将所掌握的技术方法运用到店铺的装修中,抓住卖点促进顾客继续看下去,并通过与代码的结合使用,让顾客花最少的时间达到最好的效果。
● 活动页面的设计:网店平台会不定期举行各种促销活动。为了达到与众不同的效果,从竞争激烈的店铺页面中脱颖而出得到顾客的亲睐,活动策划十分重要。这时,优秀的网店美工更需要透彻理解活动,通过设计与装修店铺页面将活动意图传达给顾客,让顾客了解活动的内容、促销的力度,从而促进销量的提升。网店美工在设计时要保证契合活动主题、页面美观,拥有自己独特的亮点,可以让活动更加直观。
● 推广的了解与运用:推广就是将自己的商品、服务和技术等内容通过各种媒体让更多的顾客了解、接受,从而达到宣传与普及的目的。对网店美工来说,推广主要是通过图像将网店的商品、品牌和服务等传达给顾客,加深店铺在他们心中的印象,获得认同感。而网店推广因为推广活动与手段的不同,规格大小不一,文件大小有时也有很多限制,这就给网店美工人员提出了更多的要求。他们不仅需要在现有的标准下及时并有效地向顾客表达出设计的意图,还要体现商品的价值。同时,文案的编写也需要言之有据,让顾客能够快速理解,并对其产生深刻的印象。
1.1.2 网店美工的技术要求
要成为一名合格的网店美工,首先需要有扎实的美术功底和良好的创造力,对美好的事物有一定的鉴赏能力;掌握最基本的图像处理与设计能力,能够熟练使用Photoshop、Dreamweaver等设计软件制作网店需要的内容。
其次,由于网店注重“商品”和“用户体验”,这就要求美工人员能够通过图像准确地向顾客表达出商品的特点并挖掘潜在顾客的需求,例如,如何通过图像、文字和色彩搭配表现出商品的独特性,让顾客感觉商品的与众不同;怎样从顾客的分析角度去思考;怎么提升图像的点击率和转化率,实现跨越技术层面来追求更高的转化率,引起顾客的购买欲望。这才是一个合格的网店美工应具备的所有技能。
1.1.3 网店美工需注意的问题
网店美工除了掌握基本的软件操作外,还需要知道商品的信息、注意事项、卖点、劣势及让劣势变成优势的技巧等。能做到突出卖点,扬长避短,是成为一个合格网店美工的基本要求。下面对网店美工需注意的问题进行介绍。
● 保持思路清晰:在装修店铺和处理图像前,需要有一个明确的思路,即确定一个大框架,在该框架中标明店铺主要卖什么,商品有什么特点,可以选择哪些元素进行装修,让其不但可以吸引顾客的眼球,还能让商品真实地展现在顾客的面前。
● 掌握装修时机:在装修网店的过程中,网店美工还要抓住一定的时机(如“双11”促销、元旦促销等)对店铺进行装修,达到时机与装修相配合,从而促进商品的销售。
● 统一风格与形式:店铺装修不但要进行合理的色彩搭配,还要统一店铺和详情页的风格和形式,因此装修分类栏、店铺公告和背景音乐等项目时,统一风格和形式变得尤为重要。
● 做好前期准备:在淘宝网中,不是申请了某个活动后才开始进行商品的制作。一个活动往往需要提前1~2个月进行准备。因此活动前期应抓住时机,对活动的文字、图像进行制作,在活动来临前完成促销信息的整理。
● 突出主次:工作过程中,网店美工切记不要为了追求漂亮、美观的效果,而对网店进行过度的美化,无法突出商品图像,掩盖店铺的风格和商品的卖点,导致展现的效果适得其反。
1.1.4 网店美工应掌握的设计要点
了解了岗位需求和技能后,网店美工还需要掌握设计要点,这样设计出的效果才能更加出彩。网店美工必须掌握的设计要点主要有色彩搭配,点、线、面三大基本设计元素和文字的编写3个方面,下面分别进行介绍。
1.色彩搭配
店铺的色彩与风格是浏览者进入店铺首先感受到的东西,因此色彩是做好店铺视觉营销的基础。很多卖家在装修店铺的时候,喜欢将一些酷炫的色块随意地堆砌到店铺里,让整个页面的色彩杂乱无比,给浏览者造成视觉疲劳。而好的色彩搭配不但能够让页面更具亲和力和感染力,而且还能提升浏览量。因此,在店铺装修时,色彩搭配尤为重要。
(1)色彩的属性与对比
色彩由色相、明度及纯度3种属性构成。色相即各类色彩的视觉感受,如红、黄、绿、蓝等各种颜色;明度是眼睛对光源和物体表面明暗程度的感受,它取决于光线的强弱;纯度也称饱和度,是指色彩鲜艳度与浑浊度的感受。在搭配色彩时,经常需要用到一些色彩的对比,下面对常用的色彩对比分别进行介绍。
● 明度对比:利用色彩的明暗程度进行对比。恰当的明度对比可以产生光感、明快感和清晰感。通常情况下,明暗对比较强时,可以使页面清晰、锐利,不容易出现误差;而当明度对比较弱时,配色效果往往不佳,页面会显得柔和单薄、形象不够明朗。图1-1所示为不同明度对比的页面。

图1-1 不同明度对比效果
● 纯度对比:利用纯度的强弱形成对比。纯度较弱的对比画面视觉效果也较弱,适合长时间查看;纯度适中的对比画面视觉效果和谐、丰富,可以突显画面的主次;纯度较强的对比画面视觉效果鲜艳明朗、富有生机。图1-2所示为不同纯度对比的页面。

图1-2 不同纯度对比效果
● 色相对比:利用色相之间的差别形成对比。进行色相对比时需要考虑其他色相与主色相之间的关系,如原色对比、间色对比、补色对比和邻近色对比,以及最后需要表现的效果。其中,原色对比一般指红色、黄色和蓝色的对比;间色对比是指两种原色调配而成的颜色的对比,如红+黄=橙、红+蓝=紫等;补色对比是指色相环中的一个颜色与180°对角的颜色的对比;邻近色对比是指色相环上的色相在15°以内的颜色的对比。
● 冷暖色对比:从颜色给人带来的感官刺激考量,黄、橙和红等颜色给人带来温暖、热情及奔放的感觉,属于暖色调;蓝、蓝绿和紫给人带来凉爽、寒冷及低调的感觉,属于冷色调。图1-3所示为冷色调和暖色调页面的对比效果。

图1-3 冷色调和暖色调的对比效果
● 色彩面积对比:各种色彩在画面中所占面积的大小不同,所呈现出来的对比效果也就不同。图1-4所示为在使用了大面积红色色调的页面中加入适当的蓝色,可以起到协调和平衡视觉的作用,使用小面积的蓝色还能起到强调促销文字、突出视觉中心的作用。

图1-4 色彩面积对比效果
(2)主色、辅助色与点缀色
网店美工在搭配店铺的页面色彩时并不是随心所欲的,而是需要遵循一定的比例与程序。网店装修配色的黄金比例为70:25:5,其中,主色色域占总版面的70%,辅助颜色占25%,而其他点缀性的颜色占5%。网店装修的配色程序为:首先根据店铺类目选择占用大面积的主色调,然后根据主色调合理搭配辅色与点缀色,用于突出页面的重点、平衡视觉效果。图1-5所示为主色、辅助色与点缀色的应用案例。

图1-5 主色、辅助色与点缀色
在色彩搭配中,主色、辅助色与点缀色是3种不同功能的色彩,分别介绍如下。
● 主色:主色是页面中占用面积最大也是最受瞩目的色彩,它决定了整个店铺的风格。主色不宜过多,一般控制在1~3种,过多容易造成视觉疲劳。主色不是随意选择的,而是需要系统分析自己品牌受众人群的心理特征,找到受众群体中易于接受的色彩,如童装适合选择黄色、粉色和橙色等暖色调作为主色。
● 辅助色:辅助色占用面积略小于主色,用于烘托主色。合理应用辅助色,能丰富页面的色彩,使页面显示更加完整、美观。
● 点缀色:点缀色是指页面中面积小、色彩比较醒目的一种或多种颜色。合理应用点缀色,可以起到画龙点睛的作用,使页面主次更加分明、富有变化。
2.点、线、面三大基本设计元素
在网页中,合理利用图形元素,既丰富了网页的视觉效果,又生动地表现出了商品的信息,同时消除了纯粹的文字页面给人带来的呆板视觉感受。点、线、面是图形中最基本的三大要素。这三大要素的结合使用,能够构成丰富的视觉效果。
● 点:点是可见的最小的形式单元,具有凝聚视觉的作用,可以使画面布局显得合理舒适、灵动且富有冲击力。点的表现形式丰富多样,既包含圆点、方点和三角点等规则的点,又包含锯齿点、雨点、泥点及墨点等不规则的点。图1-6的左图为点的表现之一,右图为文字周围的点元素,用于丰富画面,突出主题。

图1-6 点
● 线:线在视觉形态中可以表现长度、宽度、位置、方向和性格,具有刚柔并济、优美和简洁的特点,经常用于渲染画面,引导、串联或分割画面元素。线分为水平线、垂直线、曲线和斜线。不同线的形态所表达的情感不同,水平线和垂直线单纯、大气、明确、庄严;曲线柔和流畅、优雅灵动;斜线具有很强的视觉冲击,可以展现活力四射。图1-7所示为斜线素材及直线在文本串联方面的应用。

图1-7 线
● 面:点的放大即为面,线的分割产生各种比例的空间也可以称为面。面有长度、宽度、方向、位置和摆放角度等特性。在版面中,面具有组合信息、分割画面、平衡和丰富空间层次、烘托与深化主题的作用。利用面来设计美化时需要注意:面与面之间要通过不同的排列来进行灵活对比。图1-8所示为使用面元素(如云朵、圆形和矩形等)来装饰画面的效果。

图1-8 面
3.文字的编写
可读性强、突出主题的文字能直观地向顾客介绍商品的详细信息,引导顾客完成商品的浏览与购买。在设计网店图像时,文字内容的设计及字体的选择都是有讲究的。文字内容要精练,充分体现表达的主题。有了文字内容之后,相应的字体选择也不能马虎。
(1)字体的性格特征
不同的字体具有不同的性格特征,网店美工需要根据商品的特征来选择对应的字体。下面对淘宝网店铺常用字体的性格特征进行介绍。
● 宋体:宋体是店铺应用最广泛的字体,其笔画横细竖粗,起点与结束点有额外的装饰,其外形端庄秀美,具有浓厚的文艺气息,适合用于标题设计。系统默认的宋体纤细端美,但作为标题分量不足,而方正大标宋不仅具有宋体的秀美,还具备醒目性,因此经常被用于女性产品宣传图的设计。此外,书宋、大宋、中宋、仿宋和细仿宋等也属于常用的宋体。图1-9所示为宋体在女性护肤品海报中的应用效果。

图1-9 宋体
经验之谈
在鲜花、珠宝配饰、女性用品、护肤品和化妆品等以女性消费者为主体的产品宣传图设计中,一般采用纤细秀美、时尚、线条流畅并且字形有粗细变化的字体,如宋体、方正中倩简体、方正纤黑简体、张海山悦线简体及方正兰亭黑简体等。
● 黑体:黑体笔画粗细一致,粗壮有力、突出醒目,具有强调的视觉感,宣传性强,常用于促销广告、导航条,或车、剃须刀、重金属、摇滚、竞技游戏及足球等男性消费者占主导地位的产品宣传图的设计。常见的黑体样式包括粗黑、大黑、中黑和雅黑等,如图1-10所示。

图1-10 黑体
● 书法体:书法体包括楷体、叶根友毛笔行书、篆书体、隶书体、行书体和燕书体等。书法体具有古朴秀美、历史悠久的特征,常用于古玉、茶叶、笔墨和书籍等古典气息浓厚的店铺宣传,如图1-11所示。

图1-11 书法体
● 美术体:店铺设计中还经常使用美术体,如汉仪娃娃篆简、方正胖娃简体、方正少儿简体和滕祥孔淼卡通简体等字体。这类字体具有活泼、可爱、肥圆、调皮的艺术特征,多用于零食、玩具、童装、点读机及卡通漫画等以儿童消费者为主体的产品宣传图设计中。此外,美术体还指将文本的笔画涂抹变形,或用花瓣、树枝等拼凑成各种图形化的字体,其装饰作用强,主要用于海报的设计,可有效提升店铺的艺术品位,如图1-12所示。

图1-12 美术体
(2)文字的布局技巧
在店铺页面的设计中,文字除了传达营销信息外,还是一种重要的视觉材料。文字的布局在画面空间、结构和韵律上都是很重要的因素。下面对常用的文字布局技巧进行介绍。
● 字体的选用与变化:网店广告文案排版时,2~3种匹配度高的字体是最佳的视觉效果。字体过多会产生零乱而缺乏整体的感觉,容易分散顾客的注意力,使顾客产生视觉疲劳。在选择字体时,可考虑通过加粗、变细、拉长、压扁或调整行间距等操作来变化字体,产生丰富多彩的视觉效果。
● 文字格式的统一:在进行文字的编排时,需要统一文字格式,即文字的字体、粗细、大小和颜色在搭配组合上让顾客有一种关联的感觉,这样文字组合才不会显得松散杂乱。
● 文字的层次布局:在网店视觉营销设计中,文案的显示并非是简单的堆砌,而是有层次的,通常是按重要程度设置文本的显示级别,引导顾客浏览文案的顺序,此情况下首先展示的是该作品强调的重点。在进行文字的编排时,可利用字体、粗细、大小与颜色的对比来设计文字的显示级别。