内容简介

《视觉引流：网店美工操作实战》以实例和设计理论相结合的方式介绍了美工在网店装修方面的各个知识点，包括从最初的网店美工应该掌握的技能操作到网店中需要引流的模块制作和理论讲解。作者精心设计了多个与店铺视觉引流模块相关的实例，其中包含网店外部吸引流量的直通车、钻展图和店标的制作，店铺内部吸引流量的通栏广告、店招、商品广告、店铺收藏、店铺公告、详情页等知识与效果。

《视觉引流：网店美工操作实战》由一线电子商务网店美工教师和广告设计教师编写，全书共分8章，依次讲解了网店美工须掌握的基础操作、网店外部区域引流图像设计与制作、网店首屏元素设计与制作、商品广告图像设计与制作、快速导航区设计与制作、店铺公告模板设计与制作、店铺收藏与客服应用以及详情页设计与制作。

《视觉引流：网店美工操作实战》兼具技术手册和应用技巧参考手册的特点，技术实用，讲解清晰，不仅适合想自己装修店铺的初中级读者和网店美工，也可以作为大中专院校相关专业及电子商务方面培训班的教材。

前言

拥有好的美工的网店可以不与同行拼进货渠道、拼物流、拼价格等硬性指标，因为浏览者有很大一部分都是通过网店中的视觉效果被吸引进来的。这部分的流量完全可以靠美工来实现！

网店的视觉引流可以分为两个阶段：一个是店铺内部的首页和详情页的视觉效果；另一个是未进店时的直通车、钻展图等视觉效果。无论是哪个阶段，只要网店美工的功底较为深厚，就可以完成这项目标。网店美工所负责的任务就是专门使网店在视觉上起到夺人眼球的作用，吸引买家进入店铺，在店铺中又再次让买家被里面的其他商品宣传所吸引，从而给卖家带来经济效益。市场上关于网店美工的书籍主要以理论、案例操作类和教程类为主。本书与其他同类书籍的不同之处在于，不仅在淘宝网店各个元素、店外的直通车图片、钻展图片上都有精心的实例，还在具体的图片来源、配色、修正等方面进行了理论与实例相结合的详细讲解，真正做到了手把手教初学者轻松了解网店美工各个实操部分，让用户花最少的钱，得到最大化的收益。

本书在最初的策划阶段就是本着在吸引买家的注意、在网店各个吸引视觉流量的图像方面进行的。作者有着多年丰富的电商和广告教学经验、网店经营以及装修的实际设计工作经验，并将自己在网店的视觉效果装修过程中总结的经验和技巧展现给读者，希望读者能够在体会装修过程中应用各个软件强大功能的同时，将设计创意和设计理念通过软件反映到网店中的视觉效果上来。更希望通过本书能够帮助您解决开店时遇到的设计难题。

本书特点

本书的内容安排由浅入深、循序渐进、丰富多彩，力争涵盖网店视觉及装修的全部知识点。以实例结合理论的方式对网店装修进行了实际应用的讲解，使读者在学习时少走弯路。

本书具有以下特点。

内容全面，几乎涵盖了网店装修所涉及的视觉图像、配色和整体店铺装修的各个方面。从商品图像设计的一般流程入手，逐步引导读者学习网店中所涉及的各种技能。

语言通俗易懂，讲解清晰，前后呼应，以最小的篇幅、最易读懂的语言来讲解每一项功能和每一个实例，让您学习起来更加轻松，阅读更加容易。

实例丰富，技巧全面实用，技术含量高，与实践紧密结合。每一个实例都倾注了作者多年的

实践经验，每一个功能都已经过实操验证。

注重理论与实践相结合。本书中实例的操作都是通过软件的某个重要知识点展开，使读者更

容易理解和掌握，从而方便知识点的记忆，进而能够举一反三。

本书章节安排

本书循序渐进地讲解了网店美工在工作时所需要的各方面知识。全书共分为8章，依次讲解了网店美工须掌握的基础操作、网店外部区域引流图像设计与制作、网店首屏元素设计与制作、商品广告图像设计与制作、快速导航区设计与制作、店铺公告模板设计与制作、店铺收藏与客服应用以及详情页设计与制作。

本书读者对象

本书主要面向想开网店的初、中级读者，是一本非常适合网店装修的美工学习教材。全书从简单的基础开始，再循序渐进地进行讲解。对于以前没有接触过网上开店或自己装修的读者也可轻松入门，对于已经可以自己进行网店店铺装修的读者，同样可以从中快速了解本书中的网店美工基础、店外引流提升转化率以及网店各个可装修元素方面的知识点，自如地踏上新的台阶。

本书由曹天佑、王红蕾和刘东美编著，其他参与编写的人员还有陆沁、吴国新、时延辉、戴时影、刘绍婕、尚彤、张叔阳、葛久平、孙倩、殷晓峰、谷鹏、胡渤、张希、赵頔、张猛、齐新、王海鹏、刘爱华、张杰、张凝、王君赫、潘磊、周荥、周莉、金雨、陆鑫、刘智梅、黄友良、蒋立军、蒋岚、蒋玉、苏丽荣、谭明宇、李岩、吴承国、陶卫锋、孟琦、曹培军、沈桂军、关向东、刘丹、王凤展、卜彦波、祁淑玲、吴忠民、袁震寰、田秀云、李垚、郎琦、谢振勇、霍宏、王威、王建红、程德东、杨秀娟、刘琳、张文超、郭瑞金、孙名军等。

由于作者水平有限，书中疏漏和错误之处在所难免，敬请读者批评指正。

本书提供了案例所需的素材、源文件、视频文件以及PPT课件，同时还赠送大量的Photoshop的基础内容视频、动作、画笔、图案、形状、样式，通过扫描二维码，推送到自己的邮箱后下载获取。

编　者

目录

第1章  网店美工须掌握的基础操作

1.1 网店配色基础 001

1.1.1 色彩原理 001

1.1.2 网页安全色 003

1.1.3 网店色彩分类 006

1.1.4 网店色彩采集 008

1.1.5 识别色域以外的颜色 009

1.1.6 网店页面色彩搭配 010

1.1.7 网店图像配色 021

1.2 网店图像的布局 024

1.2.1 图片基本构图 024

1.2.2 图像中文本布局规则 026

1.2.3 图像参与布局的规则 029

1.2.4 版面布局设计 031

1.3 美工修图基础 032

1.3.1 宝贝图片色调调整 032

1.3.2 宝贝图片校正 037

1.3.3 瑕疵图片处理 038

1.3.4 人物磨皮处理 041

1.3.5 校正模糊图片 042

1.4 网店中常用的美工抠图 045

1.4.1 按规则几何图形进行抠图 045

1.4.2 复杂图像快速抠图 046

1.4.3 复杂图像精细抠图 046

1.4.4 透明图像抠图 049

1.4.5 毛发抠图 052

第2章  网店外部区域引流图像设计与制作

2.1 店标设计与制作 055

2.1.1 店标设计原则 055

2.1.2 店标的制作构思 056

2.1.3 店标的制作过程 057

2.2 直通车设计与制作 060

2.2.1 直通车图片的设计原则 061

2.2.2 直通车图片的制作 064

2.3 钻展图设计与制作 069

2.3.1 钻展图片的设计原则 069

2.3.2 钻展图片主图设计与制作 069

2.3.3 钻展图片右侧小图设计与制作 074

第3章  网店首屏元素设计与制作

3.1 店招设计与制作 078

3.1.1 店招设计的原则 078

3.1.2 商品参与店招设计与制作 079

3.1.3　与导航一同进行设计与制作 085

3.2 首屏全屏广告设计与制作 091

3.2.1 首屏全屏广告及轮播图的作用 091

3.2.2 渐变背景广告设计与制作 092

3.2.3 大面积配色背景广告设计与制作 096

3.2.4 图像背景广告设计与制作 100

第4章  商品广告图像设计与制作

4.1 950像素广告设计与制作 105

4.1.1 商品整体参与设计与制作 105

4.1.2 商品局部参与设计与制作 111

4.1.3 多视点参与广告设计与制作 115

4.1.4 超出背景区域设计与制作 119

4.2 750像素广告设计与制作 123

4.2.1 暖色系方案设计与制作 123

4.2.2 冷色系方案设计与制作 127

4.2.3 中性色方案设计与制作 131

4.3 190像素广告设计与制作 136

4.3.1 凸显特点方案设计与制作 136

4.3.2 商品本身参与设计与制作 139

4.4 陈列区广告设计与制作 141

4.4.1　格局分布方案设计与制作 142

4.4.2　单色与图片搭配方案设计与制作 144

第5章  快速导航区设计与制作

5.1 悬浮导航设计与制作 148

5.1.1　半透明方案设计与制作 149

5.1.2　单色背景方案设计与制作 153

5.2 宝贝分类设计与制作 155

5.2.1 宝贝分类设计与制作原则 156

5.2.2 按钮式图像方案设计与制作 157

5.2.3　文字效果方案设计与制作 161

5.2.4 子分类设计与制作 163

第6章  店铺公告模板设计与制作

 6.1 横幅公告模板设计与制作 166

6.1.1 950 像素店铺公告模板的制作 166

6.1.2 750像素店铺公告模板的制作 170

6.2 直幅公告模板设计与制作 174

6.3 为制作的模板创建切片 175

第7章  店铺收藏与客服应用

 7.1 店铺收藏设计与制作 178

7.1.1 宽幅店铺收藏的制作 178

7.1.2 窄幅店铺收藏的制作 183

7.2 客服图片设计与制作 184

7.2.1 宽幅客服图像设计与制作 185

7.2.2 窄幅客服图像设计与制作 188

第8章  详情页设计与制作

8.1 详情页的设计思路以及操作流程 190

8.2 详情页的格局构成 191

8.3 详情页的设计原则 192

8.4 详情页的制作过程 193

8.4.1　详情页框架 193

8.4.2 商品广告区设计 193

8.4.3 商品色彩展示区设计 197

8.4.4 商品细节展示区设计 200

8.4.5 随行搭配区的设计 205

8.4.6 尺码区的设计 208

8.4.7 购物须知区设计 209

8.4.8 合成详情页 210