淘宝天猫店铺设计与装修一本通

01淘宝天猫店铺基础

1.1 淘宝网开店................................................... 10

1.1.1 注册账号和开户认证 ................................ 10

1.1.2 商品类目确定以及装修上线 .................... 13

1.2 淘宝店铺的组成结构...................................... 13

1.2.1 店招 ........................................................ 13

1.2.2 导航条 .......................................................13

1.2.3 促销海报 .................................................... 13

1.2.4 分类区（商品列表） ................................ 14

1.2.5 自定义区域 ................................................ 14

1.2.6 客服区 ...................................................... 15

1.3 淘宝与天猫店铺各模块规格..........................................15

1.3.1 天猫店铺 .................................................... 15

1.3.2 淘宝店铺 .................................................... 16

02网店设计装修概要

2.1 为什么网店这么火.......................................... 18

2.2 实体店与网店的区别...................................... 18

2.2.1 实体店 ...................................................... 18

2.2.2 网店 ........................................................ 18

2.3 网店设计装修................................................ 19

2.3.1 网店设计装修的定义 ................................ 19

2.3.2 网店设计装修的重要性 ............................ 19

2.4 网店装修的基本流程...................................... 20

2.4.1 定位商品的经营类目 ................................ 20

2.4.2 确定店铺的整体风格 ................................ 20

2.4.3 产品拍摄 .................................................... 21

2.4.4 收集商品设计所需素材 ............................ 22

2.4.5 宝贝设计 .................................................... 22

2.4.6 切图上传并上架出售 ................................ 23

2.5 网页设计师应具备的技能................................ 24

2.5.1 软件的熟练、恰当的配色与布局.............24

2.5.2 善于沟通，协助客户定位店铺风格.........25

2.5.3 熟悉商品设计的整个流程 ........................ 25

2.5.4 持续学习提升设计水平 ............................ 25

2.6 影响店铺转化率的因素分析..........................................25

2.6.1 产品本身 .................................................... 25

2.6.2 产品销量 .................................................... 26

2.6.3 顾客评价 .................................................... 26

2.6.4 详情页 ...................................................... 27

2.6.5 客户服务 .................................................... 28

03网店装修软件及图片效果制作

3.1 认识Photoshop.............................................. 30

3.2 Photoshop图层............................................ 30

3.2.1 了解图层 .................................................... 30

3.2.2 图层的操作 ................................................ 31

3.3 Photoshop基础工具...................................... 33

3.3.1 选择类工具 ................................................ 33

3.3.2 编辑类工具 ................................................ 34

3.4 图像的简单处理............................................. 37

3.4.1 图像的缩放、移动、复制和删除 ................ 37

3.4.2 图像编辑与调色命令 ................................ 39

3.4.3 利用图层混合模式修改图像色彩 ................ 43

3.5 抠图技巧...................................................... 50

3.5.1 利用选框工具抠图 .................................... 50

3.5.2 利用快速选择工具抠图 ............................ 51

3.5.3 利用图层混合模式抠图 ............................ 52

3.5.4 利用橡皮擦工具抠图 ................................ 54

3.5.5 路径创建选区抠图 .................................... 55

3.5.6 通道创建选区抠图 .................................... 56

3.5.7 根据色彩范围建立选区抠图 .................... 58

3.5.8 根据调整边缘抠图 .................................... 59

04色彩搭配与排版布局

4.1 色彩基础知识................................................ 62

4.1.1 色彩的重要性 ............................................ 62

4.1.2 色彩三要素 ................................................ 62

4.1.3 色彩三原色 ................................................ 64

4.1.4 色彩的象征与情感 .................................... 64

4.1.5 色彩的属性 ................................................ 67

4.2 关于配色...................................................... 69

4.2.1 配色原则 .................................................... 69

4.2.2 配色方法 .................................................... 71

4.3 页面排版布局................................................ 73

4.3.1 直通车图排版 ............................................ 74

4.3.2 海报排版 .................................................... 75

4.3.3 详情页排版 ................................................ 77

4.3.4 首页排版 .................................................... 79

4.3.5 文案排版 .................................................... 82

05店铺基础模块的设计与装修

5.1 店招的设计与装修.......................................... 88

5.1.1 什么是店招 ................................................ 88

5.1.2 设计店招时应注意的问题 ........................ 88

5.1.3 店招的尺寸规格 ........................................ 88

5.1.4 店招包含的信息 ........................................ 88

5.1.5 实战：家纺店招设计 ................................ 89

5.1.6 店招的装修 ................................................ 91

5.2 导航条的设计与装修...................................... 93

5.2.1 什么是导航条 ............................................ 93

5.2.2 导航条的尺寸规格 .................................... 93

5.2.3 导航条设计的两种类型 ............................ 93

5.2.4 导航条设计分析 ........................................ 93

5.2.5 实战：自定义导航设计 ............................ 94

5.2.6 导航条的装修 ............................................ 95

5.3 客服区的设计与装修...................................... 97

5.3.1 什么是客服区 ............................................ 97

5.3.2 客服区设计分析 ........................................ 97

5.3.3 实战：客服中心设计 ................................ 98

5.3.4 客服区的装修 ............................................ 98

5.4 大屏海报的设计............................................101

5.4.1 什么是大屏海报 ...................................... 101

5.4.2 大屏海报的尺寸规格 .............................. 101

5.4.3 海报的分类 .............................................. 101

5.4.4 海报设计分析 .......................................... 102

5.4.5 实战：双十一大屏海报设计 .................. 103

5.5 主图与直通车图的设计..................................109

5.5.1 主图与直通车图的概念 .......................... 109

5.5.2 主图与直通车图的区别 ...........................111

5.5.3 主图与直通车图设计分析 ...................... 112

5.5.4 主图与直通车图设计的四大技巧...........112

5.5.5 实战：童鞋直通车图设计 ...................... 112

5.6 详情页设计..................................................115

5.6.1 商品详情页 .............................................. 115

5.6.2 详情页设计分析 ...................................... 115

5.6.3 详情页设计框架结构 .............................. 118

5.6.4 详情页设计原则 ...................................... 121

5.6.5 详情页卖点挖掘 ...................................... 122

5.7 活动图片设计...............................................125

5.7.1 淘宝网常见的活动 .................................. 125

5.7.2 钻石展位图片设计分析 .......................... 125

5.7.3 聚划算图片设计分析 .............................. 127

5.7.4 节日促销活动页面分析 .......................... 128

06店铺首页设计分析与制作

6.1 首页分析与制作——服饰类....................... 134

6.1.1 页面说明 .................................................. 134

6.1.2 页面配色分析 .......................................... 134

6.1.3 布局说明 .................................................. 134

6.1.4 制作流程 .................................................. 135

6.2 首页分析与制作——饰品箱包类..................................140

6.2.1 页面说明 .................................................. 140

6.2.2 页面配色分析 .......................................... 141

6.2.3 布局说明 .................................................. 141

6.2.4 制作流程 .................................................. 142

6.3 首页分析与制作——美妆护肤类.................................. 147

6.3.1 页面说明 .................................................. 147

6.3.2 页面配色分析 .......................................... 147

6.3.3 布局说明 .................................................. 148

6.3.4 制作流程 .................................................. 148

6.4 首页分析与制作——膳食保养品类..................................155

6.4.1 页面说明 .................................................. 155

6.4.2 页面配色分析 .......................................... 155

6.4.3 布局说明 .................................................. 156

6.4.4 制作流程 .................................................. 156

6.5 首页分析与制作——家纺生活类.................................. 159

6.5.1 页面说明 .................................................. 159

6.5.2 页面配色分析 .......................................... 159

6.5.3 布局说明 .................................................. 159

6.5.4 制作流程 .................................................. 160

6.6 首页分析与制作——儿童类 ..................................167

6.6.1 页面说明 .................................................. 167

6.6.2 页面配色分析 .......................................... 167

6.6.3 布局说明 .................................................. 168

6.6.4 制作流程 .................................................. 168

6.7 首页分析与制作——户外旅游类..................................173

6.7.1 页面说明 .................................................. 173

6.7.2 页面配色分析 .......................................... 173

6.7.3 布局说明 .................................................. 173

6.7.4 制作流程 .................................................. 174

07店铺详情页设计分析与制作

7.1 详情页分析与制作——服饰鞋包类..................................184

7.1.1 包包详情页 .............................................. 184

7.1.2 现代风服饰详情页 .................................. 191

7.1.3 运动鞋详情页 .......................................... 199

7.1.4 商务男袜详情页 ...................................... 205

7.2 详情页分析与制作——珠宝饰品类..................................210

7.2.1 银镯详情页 .............................................. 210

7.2.2 太阳镜详情页 .......................................... 217

7.2.3 手表腕表详情页 ...................................... 222

7.3 详情页分析与制作——家居生活类..................................231

7.3.1 家居床具详情页 ...................................... 231

7.3.2 家居枕头详情页 ...................................... 237

7.3.3 茶具详情页 .............................................. 243

7.4 详情页分析与制作——美妆护肤类.................................... 250

7.4.1 美妆面膜详情页 ...................................... 250

7.4.2 护肤精油详情页 ...................................... 256

7.5 详情页分析与制作——食品类...................................... 264

7.5.1 苹果详情页 .............................................. 264

7.5.2 豆豉酱详情页 .......................................... 269

7.5.3 五谷杂粮详情页 ...................................... 273

7.6 详情页分析与制作——户外运动类.................................... 277

7.6.1 旅游详情页 .............................................. 277

7.6.2 运动产品详情页 ...................................... 280

7.7 详情页分析与制作——数码办公类...................................283

7.7.1 办公座椅详情页 ...................................... 283

7.7.2 笔记本电脑详情页 .................................. 290