淘寶天貓網店/微店裝修設計從入門到精通

第1篇 基礎入門篇

第01章　了解網店與微店裝修設計
1.1　網店/微店裝修入門基礎　11
1.1.1　認識網店/微店裝修　11
1.1.2　網店/微店裝修的重要性　12
1.2　裝修網店與微店的意義　12
1.2.1　展示店鋪信息，加深品牌印象　12
1.2.2　展示商品詳情，吸引顧客購買　14
1.2.3　實現視覺營銷，提升店鋪轉化率　15
1.2.4　確定裝修風格，突出產品的特色　16
1.3　10大常見網店與微店平台　17
1.3.1　淘寶與天貓　17
1.3.2　唯品會　18
1.3.3　京東　19
1.3.4　當當網　19
1.3.5　口袋購物與微店　20
1.3.6　微信小店　22
1.3.7　有贊　24
1.3.8　微盟旺鋪　25
1.3.9　微店網　26
1.3.10　微小店　27

第02章　視覺營銷讓寶貝奪人眼球
2.1　網店/微店的色彩設計知識　29
2.1.1　無彩色系和有彩色系　29
2.1.2　認識色彩的三種屬性　31
2.1.3　色調：色彩的基調　34
2.2　冷暖色系的網店/微店配色　37
2.2.1　暖色系色彩的特點　37
2.2.2　冷色系色彩的特點　38
2.3　網店/微店配色的常用方案　39
2.3.1　網店/微店中的對比配色技巧　39
2.3.2　網店/微店中的調和配色技巧　40
2.4　網店/微店的文字應用技巧　43
2.4.1　網店/微店的常見字體風格　43
2.4.2　網店/微店的文字編排規則　45
2.4.3　網店/微店的文字分割方式　46
2.5　網店/微店的版式布局技巧　48
2.5.1　網店/微店的版式布局原則　48
2.5.2　網店/微店的圖片布局處理　52
2.5.3　網店/微店的版式布局指向　54

第03章　Photoshop電腦專業修圖
3.1　Photoshop CC的基本應用　57
3.1.1　認識Photoshop　57
3.1.2　學會使用圖層　60
3.1.3　使用基礎工具　61
3.1.4　編輯蒙版技巧　63
3.2　網店/微店圖片的基本處理　67
3.2.1　調整圖像尺寸　67
3.2.2　裁剪圖像素材　68
3.2.3　更改圖片的文件格式　70
3.3　網店/微店圖片的修復操作　71
3.3.1　運用仿制圖章工具去除多余圖像　71
3.3.2　運用修補工具修復圖像瑕疵　72
3.3.3　運用修復畫筆工具修復圖像　72
3.3.4　運用模糊工具模糊局部圖像　73
3.3.5　運用紅眼工具清除人物紅眼　74
3.4　網店/微店圖片的摳圖技法　75
3.4.1　摳取單色背景圖　75
3.4.2　摳取規則對象　76
3.4.3　摳取多邊形對象　78
3.4.4　摳取輪廓清晰的圖像　78
3.4.5　摳取精細的圖像　79
3.4.6　摳取半透明的圖像　81
3.5　網店/微店圖片的調色技巧　83
3.5.1　自動校正圖像的色彩與色調　83
3.5.2　色彩濃度的調整——「色相/飽和度」命令　84
3.5.3　調整圖像的顏色——「色彩平衡」命令　85
3.5.4　畫面冷暖調的改變——「照片濾鏡」命令　86
3.5.5　調整照片的局部色調——「可選顏色」命令　86
3.5.6　掌握黑白轉換技巧——「黑白」命令　87
3.6　網店/微店圖片的影調處理　87
3.6.1　修正光線的明暗——「曝光度」命令　87
3.6.2　控制照片的明暗對比——「亮度/對比度」命令　88
3.6.3　局部的明暗處理——「色階」命令　89
3.6.4　單個通道的明暗調整——「曲線」命令　90
3.6.5　暗部和亮部的處理——「陰影/高光」命令　91
3.7　網店/微店圖片的文字編輯　91
3.7.1　添加單行或單列文字　91
3.7.2　編輯段落文字　92
3.8　網店/微店圖片的高級處理　93
3.8.1　銳化圖像細節　93
3.8.2　添加水印效果　93
3.8.3　制作邊框效果　94
3.8.4　制作網頁切片　95
3.8.5　照片的批量處理　95

第04章　手機美圖秀秀快速美化照片
4.1　新手上路：初識美圖秀秀　98
4.1.1　美圖秀秀的下載與安裝　98
4.1.2　美圖秀秀的基本操作　98
4.2　一鍵搞定：網店/微店商品照片美化　99
4.2.1　調整照片的色彩和色調　100
4.2.2　智能美化商品照片　102
4.2.3　商品照片的裁剪、旋轉與銳化　103
4.2.4　為商品照片應用特效　106
4.2.5　為商品照片添加邊框效果　108
4.2.6　使用魔幻筆修飾商品照片　111
4.2.7　為商品照片添加馬賽克　112
4.2.8　為商品照片添加文字效果　113
4.2.9　為商品照片添加背景虛化效果　115
4.3　美容化妝：網店/微店模特照片美化　116
4.3.1　一鍵美顏　116
4.3.2　磨皮美白　116
4.3.3　祛斑祛痘　118
4.3.4　瘦臉瘦身　118
4.3.5　快速增高　119
4.3.6　眼睛放大　120
4.3.7　祛黑眼圈　120
4.3.8　亮眼功能　121
4.4　拼圖效果：完美組合商品照片　121
4.4.1　模版拼圖　122
4.4.2　自由拼圖　122
4.4.3　海報拼圖　124
4.4.4　拼接合成　124

第05章　店鋪裝修5大核心區域設計
5.1　打出過目不忘的招牌——店招　126
5.1.1　店招的設計要求　126
5.1.2　店招的主要功能　129
5.1.3　實例：花店類店招設計與詳解　129
5.2　幫助顧客精確定位——導航條　131
5.2.1　導航條的設計分析　131
5.2.2　實例：兒童玩具店鋪導航條設計與詳解　133
5.3　巧用心思贏得回頭客——店鋪收藏區　135
5.3.1　收藏區的設計分析　135
5.3.2　實例：店鋪收藏區設計與詳解　136
5.4　給顧客解惑答疑——客服區　140
5.4.1　客服區的設計分析　140
5.4.2　實例：奶粉店鋪客服區設計與詳解　141
5.5　方便顧客了解店鋪信息——公告欄　143
5.5.1　公告欄的設計分析　143
5.5.2　實例：店鋪公告欄設計與詳解　145

第2篇　核心技能篇

第06章　首頁設計——引人注目的第一印象
6.1　首頁歡迎模塊的設計分析　149
6.1.1　了解首頁歡迎模塊　149
6.1.2　首頁歡迎模塊的設計要點　150
6.1.3　首頁歡迎模塊的設計技巧　151
6.2　實例：女裝網店首頁設計　153
6.2.1　制作首頁背景效果　153
6.2.2　制作商品圖像效果　154
6.2.3　制作宣傳文案效果　155
6.3　實例：農產品微店首頁設計　157
6.3.1　制作首頁背景效果　157
6.3.2　制作商品圖像效果　158
6.3.3　制作首頁文案效果　160

第07章　主圖優化——增加商品直觀視覺效果
7.1　商品主圖優化的設計分析　165
7.1.1　收集裝修圖片素材　165
7.1.2　一定要配有清晰的圖片　166
7.2　實例：電腦網店主圖優化　167
7.2.1　制作主圖背景效果　168
7.2.2　制作主圖商品效果　169
7.2.3　制作主圖文案效果　170
7.3　實例：玩具微店主圖優化　173
7.3.1　制作主圖背景效果　173
7.3.2　制作細節圖效果　174
7.3.3　制作主圖文案效果　175

第08章　廣告海報——熱銷商品頁面設計理念
8.1　廣告海報的設計分析　178
8.1.1　網絡廣告海報的分類　178
8.1.2　廣告海報設計的要點　180
8.2　實例：首飾網店廣告海報　181
8.2.1　制作廣告海報的背景效果　182
8.2.2　制作廣告海報的商品效果　184
8.2.3　制作廣告海報的文案效果　185
8.3　實例：化妝品微店廣告海報　188
8.3.1　制作廣告海報的背景效果　188
8.3.2　制作廣告海報的商品效果　191
8.3.3　制作廣告海報的文案效果　192

第09章　產品詳頁——全方位地詳細展示商品
9.1　產品詳頁的設計分析　195
9.1.1　產品詳頁的設計規范　195
9.1.2　產品詳頁的設計要點　195
9.2　實例：時尚女包產品詳頁　198
9.2.1　制作產品詳頁的商品效果　199
9.2.2　制作產品詳頁的文案效果　200
9.3　實例：電動車產品詳頁　202
9.3.1　制作產品詳頁的背景效果　202
9.3.2　制作產品詳頁的商品效果　205
9.3.3　制作產品詳頁的文案效果　206

第10章　促銷方案——讓買家心動促成交易
10.1　促銷方案的設計分析　211
10.1.1　商品促銷區的制作方法　211
10.1.2　促銷方案的設計要點　212
10.1.3　促銷活動的過程與類型　213
10.2　實例：汽車用品促銷方案　217
10.2.1　制作促銷方案的背景效果　217
10.2.2　制作促銷方案的整體效果　219
10.3　實例：化妝品促銷方案　221
10.3.1　制作促銷方案的背景效果　222
10.3.2　制作促銷方案的整體效果　224

第3篇　行業實戰篇

第11章　女包店鋪裝修實戰
11.1　女包店鋪裝修設計與詳解　227
11.1.1　布局策划解析　227
11.1.2　主色調：清新藍色和灰色　227
11.1.3　案例配色擴展　228
11.1.4　案例設計流程　229
11.2　女包店鋪裝修實戰步驟詳解　230
11.2.1　制作店鋪背景和導航條　230
11.2.2　制作首頁歡迎模塊　231
11.2.3　制作促銷方案　232
11.2.4　制作收藏區與廣告海報　235
11.2.5　制作商品展示區　237

第12章　美妝店鋪裝修實戰
12.1　美妝店鋪裝修設計與詳解　241
12.1.1　布局策划解析　241
12.1.2　主色調：淡雅黃色調　241
12.1.3　案例配色擴展　242
12.1.4　案例設計流程　243
12.2　美妝店鋪裝修實戰步驟詳解　244
12.2.1　制作店鋪店招和導航　244
12.2.2　制作首頁歡迎模塊　246
12.2.3　制作促銷方案　248
12.2.4　制作商品展示區　250
12.2.5　制作熱銷商品區　252

第13章　手機店鋪裝修實戰
13.1　手機店鋪裝修設計與詳解　255
13.1.1　布局策划解析　255
13.1.2　主色調：黑白灰多層次搭配　255
13.1.3　案例配色擴展　256
13.1.4　案例設計流程　257
13.2　手機店鋪裝修實戰步驟詳解　258
13.2.1　制作店鋪背景和店招　258
13.2.2　制作首頁歡迎模塊　260
13.2.3　制作商品展示區　261
13.2.4　制作單品簡介區　263
13.2.5　制作其他商品區　265

第14章　家居店鋪裝修實戰
14.1　家居店鋪裝修設計與詳解　269
14.1.1　布局策划解析　269
14.1.2　主色調：棕色暖色調　269
14.1.3　案例配色擴展　270
14.1.4　案例設計流程　271
14.2　家居店鋪裝修實戰步驟詳解　272
14.2.1　制作店鋪導航和店招　272
14.2.2　制作首頁歡迎模塊　274
14.2.3　制作單品簡介區　276
14.2.4　制作廣告海報　278
14.2.5　制作服務信息區　280

第15章　家具店鋪裝修實戰
15.1　家具店鋪裝修設計與詳解　282
15.1.1　布局策划解析　282
15.1.2　主色調：懷舊色調　282
15.1.3　案例配色擴展　283
15.1.4　案例設計流程　284
15.2　家具店鋪裝修實戰步驟詳解　285
15.2.1　制作店鋪店招和導航　285
15.2.2　制作首頁歡迎模塊　287
15.2.3　制作掌櫃推薦區　289
15.2.4　制作爆款推薦區　291
15.2.5　制作促銷活動區　293

第16章　飾品店鋪裝修實戰
16.1　飾品店鋪裝修設計與詳解　295
16.1.1　布局策划解析　295
16.1.2　主色調：高明度暖色調　295
16.1.3　案例配色擴展　296
16.1.4　案例設計流程　297
16.2　飾品店鋪裝修實戰步驟詳解　298
16.2.1　制作店鋪店招和導航　298
16.2.2　制作首頁歡迎模塊　301
16.2.3　制作促銷方案　303
16.2.4　制作商品展示區1　305
16.2.5　制作商品展示區2　307

第17章　美食店鋪裝修實戰
17.1　美食店鋪裝修設計與詳解　310
17.1.1　布局策划解析　310
17.1.2　主色調：低純度黃色系　310
17.1.3　案例配色擴展　311
17.1.4　案例設計流程　312
17.2　美食店鋪裝修實戰步驟詳解　313
17.2.1　制作店鋪店招和導航　313
17.2.2　制作首頁歡迎模塊　315
17.2.3　制作商品推薦區　316
17.2.4　制作商品展示區　319
17.2.5　制作底部功能區　322

第18章　母嬰店鋪裝修實戰
18.1　母嬰店鋪裝修設計與詳解　324
18.1.1　布局策划解析　324
18.1.2　主色調：藍色調　324
18.1.3　案例配色擴展　325
18.1.4　案例設計流程　326
18.2　母嬰店鋪裝修實戰步驟詳解　327
18.2.1　制作店鋪店招和導航　327
18.2.2　制作首頁歡迎模塊　329
18.2.3　制作主打商品區　332
18.2.4　制作標題欄　332
18.2.5　制作商品展示區　333