第1章(zhāng)  店(diàn)鋪設計(jì)基礎知(zhī)識™φ... 1

1.1  網店(diàn)的(de)裝修知(zhī)識... 2

1.1.1  呈現(xiàn)商品的(de)要(yào)點信息... 4

1.1.2  介紹商品的(de)詳細情況... 5

1.1.3  體(tǐ)現(xiàn)商品的(de)重點特色... 7

1.2  網店(diàn)裝修的(de)注意事(shì)項... 8

1.2.1  頁面布局的(de)合理(lǐ)性... 8

1.2.2  主打商品的(de)吸引力... 9

1.2.3  頁面設計(jì)的(de)靈活性... 10

1.3  網店(diàn)的(de)基本裝修技(jì)巧... 10

1.3.1  運營思想确定裝修風(fēng)格... 10

1.3.2  整體(tǐ)色調體(tǐ)現(xiàn)營銷特色... 11

1.3.3  頁面櫥窗(chuāng)照(zhào)決定美(měΩ∞&γi)觀效果... 12

1.3.4  引導顧客自(zì)主選擇購(gòu)物(wù)... 13

1.3.5  準确信息定位顧客需求... 13

1.3.6  證書(shū)證明(míng)展示技(jì)術(shù)實✔σ>力... 13

1.4  網店(diàn)裝修存在的(de)幾個(gè)誤區(qū)... 14

本章(zhāng)小(xiǎo)結... 15

第2章(zhāng)  店(diàn)鋪核心模塊的(de)布局技(™∑jì)巧... 16

2.1  店(diàn)招的(de)設計(jì)原理(lǐ∑γ↕)... 17

2.1.1  外(wài)觀和(hé)基本色調一(yī)緻... 17

2.1.2  結合品牌加深顧客記憶... 18

2.1.3  店(diàn)招的(de)制(zhì)作(zuò)方法... 19

2.1.4  店(diàn)招的(de)基本作(zuò)用(yòng)... 20

2.2  設計(jì)歡迎模塊的(de)技(jì)巧... 21

2.2.1  思考歡迎模塊的(de)設計(jì)重點... 21

2.2.2  設計(jì)歡迎模塊的(de)具體(tǐ)內(nèi  ‌)容... 21

2.2.3  留白(bái)處理(lǐ)提升設計(jì)檔次... 23

2.2.4  設計(jì)歡迎模塊的(de)必備元素... 24

2.3  導航條的(de)主要(yào)功能(néng)... 25

2.3.1  為(wèi)浏覽店(diàn)鋪提供便捷通(tōng)道(dào)... 25

2.3.2  用(yòng)首頁切片擴展裝修效果... 25

2.3.3  色彩和(hé)字體(tǐ)風(fēng)格增強導航層次... 26

本章(zhāng)小(xiǎo)結... 27

第3章(zhāng)  店(diàn)鋪的(de)配色... 28

3.1  色彩的(de)理(lǐ)論知(zhī)識... 29

3.1.1  色彩的(de)概念... 29

3.1.2  色彩基本要(yào)素的(de)特征... 30

3.1.3  色調構成店(diàn)鋪整體(tǐ)色彩... 32

3.2  認識常用(yòng)的(de)冷(lěn¥Ωg)暖色系... 35

3.2.1  暖色系的(de)運用(yòng)... 35

3.2.2  冷(lěng)色系的(de)運用(yòng)... 36

3.3  色彩搭配的(de)作(zuò)用(yòng₩​)... 38

3.3.1  對(duì)比配色豐富色彩畫(huà)面... 38

3.3.2  調和(hé)配色滿足視(shì)覺需求... 40

3.4  設計(jì)店(diàn)鋪的(de)排版布局... 43

3.4.1  不(bù)同字體(tǐ)決定店(diàn)鋪風(fēng)格... 43

3.4.2  文(wén)字編排準則的(de)具體(tǐ)要(y∏←ào)求... 46

3.4.3  文(wén)字的(de)分(fēn)割方式... 48

3.4.4  善用(yòng)頁面版式的(de)設計(jì)原則... 49

3.4.5  店(diàn)鋪畫(huà)面的(de)背景處理(l₽§ǐ)... 55

本章(zhāng)小(xiǎo)結... 57

第4章(zhāng)  商品圖像的(de)修飾... 58

4.1  運用(yòng)基礎工(gōng)具處理(lǐ)商品圖像... 59

4.1.1  移動工(gōng)具轉移圖像位置... 59

4.1.2  裁剪工(gōng)具調整畫(huà)面布局... 60

4.1.3  旋轉圖像選擇合适角度... 61

4.1.4  翻轉圖像調整适宜位置... 63

4.1.5  扭曲命令還(hái)原變形圖像... 64

4.1.6  透視(shì)功能(néng)調節圖像效果... 65

4.2  運用(yòng)修飾工(gōng)具美(měi)化(huà)商品圖像... 66

4.2.1  仿制(zhì)圖章(zhāng)工(gōng)具處理(₩←lǐ)雜(zá)物(wù)突出商品... 66

4.2.2  圖案圖章(zhāng)工(gōng)具添加店(diàn©")鋪标識... 67

4.2.3  污點修複畫(huà)筆(bǐ)工(gōng)具去(qù)除商品瑕疵... 69

4.2.4  修補工(gōng)具修補受損商品圖像... 70

4.2.5  橡皮擦工(gōng)具變更商品信息... 71

4.2.6  填充命令覆蓋圖像背景... 73

4.2.7  模糊工(gōng)具虛化(huà)背景突出主體(tǐ)... 74

4.2.8  銳化(huà)工(gōng)具顯現(xiàn)清晰商品圖像... 76

本章(zhāng)小(xiǎo)結... 77

課後習(xí)題... 77

第5章(zhāng)  調整圖像的(de)美(měi)化(huà)效果... 78

5.1  運用(yòng)面闆與工(gōng)具調整商品顔色... 79

5.1.1  使用(yòng)“顔色”面闆調整背景... 79

5.1.2  使用(yòng)“色闆”面闆預設顔色... 80

5.1.3  使用(yòng)漸變工(gōng)具填充雙色圖像... 81

5.2  運用(yòng)命令調整商品圖像的(de)色調... 83

5.2.1  使用(yòng)“自(zì)動對(duì)比度™←γ×”豐富色彩層次... 83

5.2.2  使用(yòng)“亮(liàng)度/對(du↕∏♥ì)比度”調整圖像明(míng)暗(àn)... 84

5.2.3  使用(yòng)“色階”命令提高(gāo)圖像亮(liàng)度... 85

5.2.4  使用(yòng)“曲線”命令改變商品圖像色調... 86

5.2.5  使用(yòng)“曝光(guāng)度”修飾圖像光(guāng)線瑕疵... 87

5.2.6  使用(yòng)“自(zì)然飽和(hé)度”命令調整圖像色彩... 88

5.2.7  使用(yòng)“色相(xiàng)/飽和(hé)度調”讓色彩變得(de)明(míng)亮(liàng)... 88

5.2.8  使用(yòng)“色彩平衡”命令校(xiào)正圖像偏色... 90

5.2.9  使用(yòng)“替換顔色”命令調整圖像色差... 91

5.2.10  使用(yòng)“可(kě)選顔色”命令校(xiào)正圖像色彩平衡... 92

本章(zhāng)小(xiǎo)結... 93

課後習(xí)題... 93

第6章(zhāng)  商品圖像的(de)摳圖技(jì)巧... 95

6.1  商品圖像的(de)簡單摳圖技(jì)巧... 96

6.1.1  使用(yòng)矩形選框工(gōng)具☆¥摳取矩形圖像... 96

6.1.2  使用(yòng)橢圓選框工(gōng)具摳取橢圓圖像... 97

6.1.3  使用(yòng)磁性套索工(gōng)具提高(gāo)摳圖效率... 98

6.1.4  使用(yòng)橡皮擦工(gōng)具擦去(qù)圖像多(duō)餘物(wù)品... 99

6.1.5  使用(yòng)背景橡皮擦工(gōng)具擦除單一(yī)背景... 101

6.1.6  使用(yòng)魔術(shù)橡皮擦工(gōng)具快(kuài)速摳取商品... 102

6.1.7  使用(yòng)魔棒工(gōng)具選取相(xiàng)近(j ♠ìn)顔色範圍... 103

6.2  商品圖像的(de)高(gāo)級摳圖技(jì)巧... 106

6.2.1  使用(yòng)鋼筆(bǐ)工(gōng)具摳取多(duō)邊形商品... 106

6.2.2  使用(yòng)鋼筆(bǐ)工(gōng)具摳取平滑邊緣的(de)商品... 108

6.2.3  使用(yòng)矩形工(gōng)具摳圖矩形圖像... 109

6.2.4  使用(yòng)橢圓工(gōng)具摳取橢圓商品... 111

6.2.5  使用(yòng)快(kuài)速蒙版摳取複雜(zá)的(de)背景... 112

6.2.6  使用(yòng)圖層蒙版控制(zhì)獨立的(de)圖層區(qū)域... 114

6.2.7  使用(yòng)矢量蒙版摳取輪廓分(fēn)明(míng)的(de)圖像... 116

6.2.8  使用(yòng)通(tōng)道(dào)對(duì)比摳取複雜(zá)的(de)背景圖像... 118

本章(zhāng)小(xiǎo)結... 119

課後習(xí)題... 119

第7章(zhāng)  店(diàn)鋪文(wén)字的(de)設計(jì)與排版... 120

7.1  制(zhì)作(zuò)網店(diàn)商品的(de)文(wén)字效果... 121

7.1.1  制(zhì)作(zuò)橫排文(wén)字效果的(→©de)商品圖像... 121

7.1.2  制(zhì)作(zuò)直排文(wén)字效果的(de)商品圖像... 122

7.1.3  制(zhì)作(zuò)商品圖像的(de)段落文(wén)字效果... 124

7.1.4  通(tōng)過文(wén)字段落屬性改變顯示效果... 126

7.1.5  通(tōng)過文(wén)字蒙版制(zhì)作(zuò≠π₽€)商品宣傳效果... 127

7.1.6  調整商品中文(wén)字的(de)水(shuǐ)平與垂直方向... 129

7.1.7  通(tōng)過路(lù)徑排列呈現(xiàn)商品文(wén)字特殊效果... 130

7.1.8  通(tōng)過路(lù)徑調整商品文(wén)字的(de)排列位置... 131

7.2  制(zhì)作(zuò)商品文(wén)字的(de)©¥特殊效果... 133

7.2.1  通(tōng)過變形文(wén)字凸顯商品美(měi)觀度... 133

7.2.2  通(tōng)過文(wén)字描邊提升文(wén)字顯示效果... 134

7.2.3  通(tōng)過顔色疊加改變圖像文(wén)字顔色... 135

7.2.4  通(tōng)過顔色漸變充實商品圖像畫(huà)面... 137

7.2.5  通(tōng)過發光(guāng)效果吸引顧客目光(guāng)... 138

本章(zhāng)小(xiǎo)結... 140

課後習(xí)題... 140

第8章(zhāng)  店(diàn)鋪廣告圖片的(de)特效制(zhì)作(z£α'uò)... 141

8.1  制(zhì)作(zuò)商品廣告特效... 142

8.1.1  複古特效烘托畫(huà)面氛圍... 142

8.1.2  冷(lěng)藍(lán)特效增強高(gāo<₽)貴氣質... 144

8.1.3  冷(lěng)綠(lǜ)特效增強圖像清新感... 146

8.1.4  暖黃(huáng)特效加強圖像溫馨感... 148

8.1.5  懷舊(jiù)特效突出典雅魅力... 149

8.2  制(zhì)作(zuò)商品展示特效... 151

8.2.1  拍(pāi)立得(de)特效顯現(xiàn★≠®)别樣風(fēng)趣... 151

8.2.2  幻燈片效果放(fàng)大(dà)圖像視(shì)覺... 154

8.2.3  單張立體(tǐ)空(kōng)間(jiān)展示圖像立體(tǐ)感... 156

本章(zhāng)小(xiǎo)結... 159

課後習(xí)題... 159

第9章(zhāng)  商品圖像的(de)合成技(jì)巧... 160

9.1  制(zhì)作(zuò)淘寶店(diàn)慶的(de)廣告效果... 161

9.1.1  運用(yòng)“新建”命令創建圖像... 161

9.1.2  運用(yòng)移動工(gōng)具添加花(huā)紋圖像... 161

9.1.3  運用(yòng)魔棒工(gōng)具摳取商品圖像... 163

9.1.4  運用(yòng)圖層蒙版與漸變工(gōng)具制(zhì)作(zuò)倒影(yǐng)... 165

9.1.5  運用(yòng)“描邊”命令添加圖像層次感... 166

9.1.6  運用(yòng)“漸變疊加”命令制(zhì)作(zuò)文(wén)字特效... 167

9.1.7  運用(yòng)橫排文(wén)字工(gōng)具制(zhì)作(zuò)¥φ多(duō)種效果... 168

9.2  制(zhì)作(zuò)手包店(diàn)鋪的(de)商品圖像... 170

9.2.1  使用(yòng)“新建”命令創建圖像... 170

9.2.2  使用(yòng)魔棒工(gōng)具摳取商品... 170

9.2.3  拖曳圖像添加花(huā)紋和(hé)顔色... 172

9.2.4  使用(yòng)矩形選框工(gōng)具填充顔色... 173

9.2.5  添加文(wén)字說(shuō)明(míng)為(wèi≠Ω≤)産品做(zuò)宣傳... 173

9.3  制(zhì)作(zuò)玩(wán)具店(diàn)鋪的(de)商品圖像... 175

9.3.1  運用(yòng)“新建”命令創建文(wén)件(jiàn)... 175

9.3.2  運用(yòng)矩形工(gōng)具制(zhì)作(zuò)背景框架效果... 176

9.3.3  運用(yòng)魔棒工(gōng)具删除白(bβ©ái)色背景... 177

9.3.4  運用(yòng)文(wén)字工(gōng)™≈✔π具添加相(xiàng)應文(wén)字... 178

本章(zhāng)小(xiǎo)結... 180

課後習(xí)題... 180

第10章(zhāng)  網店(diàn)裝修的(de)元素設計(jì)... 181

10.1  廣告海(hǎi)報(bào)區(qū)：沖擊視(shì)覺效果達到(dào)宣傳目的(de)... 182

10.1.1  構成網店(diàn)廣告海(hǎi)報(bào)的(de)基本要(yào)素... 182

10.1.2  解析女(nǚ)鞋網店(diàn)的(de)廣告海(hǎi)報(bào)設計(jì)方案... 183

10.2  公告欄區(qū)：發布店(diàn)鋪最新信息的•←&¥(de)展示平台... 190

10.2.1  制(zhì)作(zuò)網店(diàn)公告欄的(de)注意事(shì)項... 190

10.2.2  設計(jì)美(měi)觀精緻的(de)公告欄區(δ₩<∞qū)... 190

10.3  店(diàn)鋪收藏區(qū)：添加收藏方便二次購(gòu)物(wù)... 193

10.3.1  掌握店(diàn)鋪收藏區(qū)的(de)功能(néng)及作(zuò)用(yòng)... 193

10.3.2  分(fēn)析店(diàn)鋪收藏區(qū)的(de)設計(jì)方案... 196

本章(zhāng)小(xiǎo)結... 200

課後習(xí)題... 200

第11章(zhāng)  店(diàn)鋪的(de)設計(jì)與制(zhì)作(zuò)方法... 201

11.1  招牌設計(jì)... 202

11.1.1  設計(jì)珠寶網店(diàn)的(de)店(diàn)招... 202

11.1.2  設計(jì)家(jiā)具網店(diàn)的(de)店(di↓♥àn)招... 202

11.2  導航設計(jì)... 204

11.2.1  設計(jì)手機(jī)網店(diàn)的(≤♠±≥de)導航... 204

11.2.2  設計(jì)護膚品網店(diàn)的(de)導航... 206

11.3  首頁設計(jì)... 208

11.3.1  設計(jì)農(nóng)産品網店(diàn)的(de)首頁歡迎模塊... 209

11.3.2  設計(jì)女(nǚ)包網店(diàn)的(de)首​±♥頁歡迎模塊... 212

11.4  主圖設計(jì)... 214

11.4.1  設計(jì)電(diàn)腦(nǎo)店(d£ ✔"iàn)鋪的(de)商品主圖... 214

11.4.2  設計(jì)玩(wán)具網店(diàn)的δ♥(de)商品主圖... 219

11.5  詳頁設計(jì)... 223

11.5.1  設計(jì)抱枕網店(diàn)的(de)産品詳頁... 224

11.5.2  設計(jì)堅果零食網店(diàn)的(de)産品詳頁... 228

本章(zhāng)小(xiǎo)結... 231

課後習(xí)題... 231

第12章(zhāng)  店(diàn)鋪裝修與設計(jì)綜合實例... 232

12.1  美(měi)妝店(diàn)鋪的(de)裝修與設計(jì)... 233

12.1.1  制(zhì)作(zuò)美(měi)妝店(diàn)鋪的(de)店(diàn)招和(hé)導航條... 234

12.1.2  制(zhì)作(zuò)美(měi)妝店(dià≈×¥n)鋪的(de)首頁歡迎模闆... 236

12.1.3  制(zhì)作(zuò)美(měi)妝店(dià÷φn)鋪的(de)促銷方案... 240

12.1.4  制(zhì)作(zuò)美(měi)妝店(diàn)鋪的(de)商品展示區(qū)... 242

12.1.5  制(zhì)作(zuò)美(měi)妝店(diàn)鋪的(de)商品熱(rè)銷區(qū)... 245

12.2  美(měi)食店(diàn)鋪的(de)裝修與設計(jì)... 247

12.2.1  制(zhì)作(zuò)美(měi)食店(diàn)鋪的(de)δ↕₹導航條和(hé)店(diàn)招效果... 249

12.2.2  制(zhì)作(zuò)美(měi)食店(diàn)鋪的( ‍®≈de)首頁歡迎模塊效果... 251

12.2.3  制(zhì)作(zuò)美(měi)食店(diàn)鋪的(de)商品推薦區(qū)效果... 253

12.2.4  制(zhì)作(zuò)美(měi)食店(> ↕diàn)鋪的(de)商品展示區(qū)效果... 256

12.2.5  制(zhì)作(zuò)美(měi)食店(diàn)鋪的(de)底部功能(néng)區(qū)效果... 259

本章(zhāng)小(xiǎo)結... 261