正版 电子商务视觉设计(新商科互联网+教育电子商务专业系列教材)

第一章 绪论 ................................................................................................................................................. 1
第一节 电商视觉设计概述 .............................................................................................................. 2
一、视觉设计 ................................................................................................................................ 2
二、视觉营销 ................................................................................................................................ 3
第二节 电商视觉设计的准备 .......................................................................................................... 5
一、电商网店的视觉定位 ........................................................................................................... 5
二、文案策划 ................................................................................................................................ 6
三、商品拍摄 ................................................................................................................................ 7
四、图片处理 ................................................................................................................................ 8
五、详情页设计 ............................................................................................................................ 8
第三节 电商视觉设计色彩应用 .................................................................................................... 10
一、色彩的基础知识 .................................................................................................................. 10
二、电商网店视觉图像的色彩调整 ......................................................................................... 17
三、电商网店的配色 .................................................................................................................. 23
第四节 电商视觉设计文字应用 .................................................................................................... 28
一、电商视觉设计中的字体 ..................................................................................................... 28
二、电商网店的字体设计 ......................................................................................................... 31
第五节 电商视觉设计的形状应用 ................................................................................................ 34
一、电商网店视觉设计中的形状 ............................................................................................. 34
二、形状的创意处理 .................................................................................................................. 34
第二章 电商视觉设计体现 ..................................................................................................................... 36
第一节 电商视觉营销设计体现 .................................................................................................... 37
一、电商网店视觉体现 ............................................................................................................. 37
二、广告视觉体现 ...................................................................................................................... 38
三、商品视觉体现 ...................................................................................................................... 39
第二节 电商网店视觉风格 ............................................................................................................ 42
一、电商网店视觉风格的概念 ................................................................................................. 42
二、确定电商网店视觉风格 ..................................................................................................... 43
第三节 电商广告视觉传达 ............................................................................................................ 44
一、电商广告视觉传达的概念及意义 ..................................................................................... 44
二、电商广告视觉传达的要求 ................................................................................................. 45
第四节 电商视觉营销 ..................................................................................................................... 45
一、电商视觉营销的概念 ......................................................................................................... 45
二、电商视觉营销的策略 ......................................................................................................... 45
第三章 电商视觉影像传达 ..................................................................................................................... 55
第一节 电商商品拍摄基础知识 .................................................................................................... 56
一、认识拍摄器材 ...................................................................................................................... 56
二、电商商品拍摄中的用光与布光 ......................................................................................... 63
三、开拍前必不可少的准备工作 ............................................................................................. 69
第二节 电商商品拍摄的构图 ........................................................................................................ 73
一、构图的含义与目的 ............................................................................................................. 73
二、构图的画幅 .......................................................................................................................... 74
三、基本构图方法 ...................................................................................................................... 75
四、基本构图技巧 ...................................................................................................................... 78
第三节 电商商品图片拍摄 ............................................................................................................ 81
一、电商商品拍摄中背景的选择 ............................................................................................. 81
二、电商商品拍摄中商品的陈列与摆放 ................................................................................. 82
三、电商商品图片拍摄案例 ..................................................................................................... 83
第四节 电商商品视频拍摄 ............................................................................................................ 85
一、视频拍摄的要求 .................................................................................................................. 85
二、电商商品视频拍摄的流程 ................................................................................................. 87
三、电商商品视频拍摄案例 ..................................................................................................... 88
第四章 电商商品图片的处理 ................................................................................................................. 90
第一节 商品图片视觉效果分析 .................................................................................................... 91
一、视觉效果 .............................................................................................................................. 91
二、视觉元素 .............................................................................................................................. 98
第二节 精细处理商品图片 ............................................................................................................ 99
一、去除商品图片中的细小瑕疵――清除商品图片上的污渍 ............................................ 99
二、去除商品图片中的大面积瑕疵――还原商品图片原貌 ............................................... 101
三、突出商品图片细节的处理――锐化商品图片细节 ....................................................... 102
四、商品图片的虚实处理――突出商品图片主体 ............................................................... 104
五、修复商品图片的残缺――好看的碗 ............................................................................... 106
第三节 抠取图片中所要的内容 .................................................................................................. 107
一、抠取规则形状的商品图片――草地上的球 ................................................................... 107
二、抠取不规则形状的商品图片――甜品 ........................................................................... 110
三、根据色彩抠取商品图片――项链 ................................................................................... 112
第四节 丰富商品图片内容 .......................................................................................................... 114
一、添加矢量元素――凸显商品信息 ................................................................................... 114
二、用文字装饰图片――灵活的路径文字 ........................................................................... 116
三、改变商品图片局部色彩――让颜色更丰富 ................................................................... 118
第五章 电商网店首页视觉设计 ........................................................................................................... 121
第一节 电商网店首页认知 .......................................................................................................... 122
一、电商网店首页部分内容展示 ........................................................................................... 122
二、电商网店首页设计 ........................................................................................................... 123
第二节 店招视觉设计 ................................................................................................................... 123
一、店招视觉设计的意义与功能 ........................................................................................... 123
二、店招视觉设计的规范 ....................................................................................................... 124
三、店招视觉设计的要求 ....................................................................................................... 124
四、店招视觉设计的方法 ....................................................................................................... 125
五、店招视觉设计案例――善美花屋网店店招 ................................................................... 125
第三节 店徽视觉设计 ................................................................................................................... 128
一、店徽视觉设计认知 ........................................................................................................... 128
二、店徽视觉设计的常见类型 ............................................................................................... 128
三、店徽视觉设计的要点 ....................................................................................................... 130
四、店徽视觉设计案例――喵村网店店徽 ........................................................................... 131
第四节 海报视觉设计 ................................................................................................................... 135
一、海报视觉设计认知 ........................................................................................................... 135
二、海报视觉设计的要点 ....................................................................................................... 135
三、海报视觉设计的规范 ....................................................................................................... 135
四、海报视觉设计的技巧 ....................................................................................................... 136
五、海报视觉设计案例――厨具网店海报 ........................................................................... 137
第六章 电商网店详情页视觉设计 ...................................................................................................... 140
第一节 电商网店详情页认知 ...................................................................................................... 141
一、详情页的意义 .................................................................................................................... 141
二、详情页的营销流程 ........................................................................................................... 141
三、详情页的尺寸 .................................................................................................................... 141
四、详情页的设计要点 ........................................................................................................... 141
五、详情页的设计类型 ........................................................................................................... 141
第二节 商品主图视觉设计 .......................................................................................................... 144
一、商品主图视觉设计认知 ................................................................................................... 144
二、商品主图的设计形式 ....................................................................................................... 145
三、提高商品主图点击率的方法 ........................................................................................... 146
四、商品主图视觉设计案例――八分裤商品主图 ............................................................... 146
第三节 关联营销图视觉设计 ...................................................................................................... 149
一、关联营销图视觉设计认知 ............................................................................................... 149
二、关联营销图视觉设计的原则 ........................................................................................... 149
三、关联营销图视觉设计的表现形式 ................................................................................... 150
第四节 商品细节图视觉设计 ...................................................................................................... 152
一、商品细节图的表现方法 ................................................................................................... 152
二、商品细节图的设计方法 ................................................................................................... 154
三、商品细节图视觉设计案例――品牌女鞋 ....................................................................... 155
第五节 商品功能图视觉设计 ...................................................................................................... 158
一、商品功能图视觉设计认知 ............................................................................................... 158
二、商品功能图的设计规范 ................................................................................................... 158
第六节 商品展示设计 ................................................................................................................... 160
一、商品展示设计认知 ........................................................................................................... 160
二、商品展示设计的内容 ....................................................................................................... 160
三、商品展示设计的方法 ....................................................................................................... 161
四、商品展示设计案例――女包颜色展示 ........................................................................... 162
第七章 电商网店推广图与促销活动页视觉设计 ............................................................................. 165
第一节 高点击率推广图视觉设计 .............................................................................................. 166
一、高点击率推广图的意义 ................................................................................................... 166
二、直通车推广图的设计技巧 ............................................................................................... 166
三、直通车推广图视觉设计案例――地灯直通车推广图 ................................................... 168
四、钻展图视觉设计 ................................................................................................................ 171
第二节 促销活动页视觉设计 ...................................................................................................... 173
一、促销活动页的制作方法 ................................................................................................... 173
二、促销活动页的广告尺寸 ................................................................................................... 173
三、促销活动页的广告设计准则 ........................................................................................... 173
四、促销活动的类型 ................................................................................................................ 175
五、促销活动页视觉设计案例――女包促销广告 ............................................................... 178
第八章 手机移动端视觉设计 ............................................................................................................... 183
第一节 手机移动端电商网店视觉设计 ..................................................................................... 184
一、手机移动端电商网店视觉设计认知 ............................................................................... 184
二、手机移动端电商网店首页视觉设计 ............................................................................... 186
三、手机移动端电商网店首页视觉设计案例――时尚床品店铺首页 .............................. 189
四、手机移动端电商网店详情页视觉设计 ........................................................................... 193
五、手机移动端电商网店详情页视觉设计案例――索尼相机详情页 .............................. 195
第二节 手机移动端微店视觉设计 .............................................................................................. 198
一、手机移动端微店首页视觉设计 ....................................................................................... 198
二、手机移动端微店详情页视觉设计 ................................................................................... 201
三、手机移动端微店底部导航视觉设计 ............................................................................... 203
四、手机移动端微店详情页视觉设计案例――年货大集详情页 ...................................... 203
参考文献 ..................................................................................................................................................... 208

刘艳玲，艺术设计专业硕士研究生， 数字艺术设计师，副教授，毕业于东北师范大学，现任长春信息技术职业学院电子商务专业系主任。长期从事电子商务视觉营销和网络营销推广方面的教学工作，主讲网络运营与广告、UI设计和视觉营销设计等课程。近几年主持 “十三五”科研规划课题1项、省市级课题6项，承担省级课题改革项目3项，主讲1门吉林省精品资源共享课程。获得省级科技进步奖3项，省级教学成果2项，吉林省高职技能大赛 指导教师2项。发表北大核心论文1篇， 论文5篇，省级论文4篇。吉林省美学学会会员，吉林省电子商务协会会员，吉林省职业院校“双师型”教师人才成员；长春市电子商务协会高职院校联系人。

电子商务视觉设计作为电子商务闭环中最重要的内容之一，是店铺营销成功必不可少的一步。本书采用软件教程实践与视觉设计理论相结合的方式，详细向读者介绍了电子商务视觉设计思路和具体的实现方法。本书一共八章，主要介绍了绪论、电商视觉设计体现、电商视觉影像传达、电商商品图片的处理、店铺首页视觉设计、店铺详情页视觉设计、店铺推广与促销活动页视觉设计、手机移动端视觉设计等知识。本书注重理论的同时结合实践，内容丰富，既适合电商等相关专业的学生学习，也适合电商从业者作为知识补充。