第1部分淘寶美工基礎篇

第1章 認識淘寶美工2

1.1　淘寶美工基礎知識3

1.1.1　什么是淘寶美工3

1.1.2　淘寶美工的工作有哪些3

1.1.3　淘寶美工需要掌握哪些技能4

1.2　淘寶美工必學知識點5

1.2.1　淘寶網(wǎng)店各部分圖片尺寸5

1.2.2　圖片存儲格式7

1.2.3　素材資源的獲取7

第2章 熟悉淘寶美工的必備工具Photoshop11

　　視頻講解：68分鐘

2.1　開啟你的Photoshop之旅12

2.1.1　Photoshop是什么12

2.1.2　Photoshop不難學12

2.1.3　安裝Photoshop14

2.1.4　認識Photoshop的工作界面15

2.1.5　退出Photoshop 17

2.2　Photoshop文檔的基本操作18

2.2.1　在Photoshop中新建文件18

2.2.2　在Photoshop中打開圖像文件19

2.2.3　多文檔操作19

2.2.4　置入：向文檔中添加其他圖片21

2.2.5　將智能對象轉(zhuǎn)換為普通圖層21

2.2.6　存儲文件22

2.2.7　常見的圖像存儲格式22

2.2.8　關閉文件24

舉一反三：置入標簽素材制作網(wǎng)店商品頭圖24

2.3　調(diào)整圖像文件的查看比例和位置24

2.3.1　縮放工具：放大、縮小、看細節(jié)24

2.3.2　抓手工具：平移畫面25

2.4　錯誤操作的處理25

2.4.1　撤銷與還原操作25

2.4.2　恢復文件26

2.4.3　使用歷史記錄面板還原操作26

2.5　掌握圖層的基本操作26

2.5.1　圖層原理26

2.5.2　選擇圖層27

2.5.3　新建圖層28

2.5.4　刪除圖層28

2.5.5　復制圖層28

2.5.6　調(diào)整圖層順序28

2.5.7　動手練：使用圖層組管理圖層29

2.5.8　合并圖層29

2.6　使網(wǎng)店元素整齊排列30

2.6.1　移動圖層30

2.6.2　動手練：對齊圖層31

2.6.3　動手練：分布圖層31

2.7　創(chuàng)建簡單選區(qū)31

2.7.1　動手練：矩形選框工具32

2.7.2　動手練：橢圓選框工具33

2.7.3　單行/單列選框工具：1像素寬/1像素高的選區(qū)34

2.7.4　套索工具：繪制隨意的選區(qū)34

2.7.5　多邊形套索工具：創(chuàng)建帶有尖角的選區(qū)34

2.7.6　選區(qū)的基本操作35

2.7.7　動手練：描邊35

綜合實例：使用新建置入存儲命令制作飲品廣告36

第2部分淘寶店鋪圖像處理篇

第3章 商品圖片的基本處理39

　　視頻講解：48分鐘

3.1　調(diào)整商品圖片的尺寸及方向40

3.1.1　調(diào)整圖像尺寸40

練習實例：修改圖像大小制作產(chǎn)品主圖40

3.1.2　動手練：修改畫布大小41

練習實例：修改畫布大小制作照片邊框42

3.1.3　裁剪工具：裁剪畫面構(gòu)圖43

3.1.4　透視裁剪工具：矯正商品圖片的透視問題44

3.1.5　使用裁剪與裁切命令44

練習實例：使用裁切命令去除多余的像素45

3.1.6　旋轉(zhuǎn)畫布到正常的角度45

3.2　圖像局部的剪切/拷貝/粘貼46

3.2.1　剪切與粘貼46

3.2.2　拷貝46

舉一反三：使用拷貝粘貼命令制作產(chǎn)品細節(jié)展示46

3.2.3　合并拷貝47

3.2.4　清除圖像47

3.3　圖像的變換47

3.3.1　自由變換：縮放、旋轉(zhuǎn)、扭曲、透視、變形47

練習實例：使用自由變換功能快速填補背景49

練習實例： 使用復制并重復上一次變換功能制作放射狀

背景50

3.3.2　內(nèi)容識別縮放：保留主體物并調(diào)整圖片比例52

3.4　顏色的設置與應用52

3.4.1　認識前景色與背景色52

3.4.2　在拾色器中選取顏色53

3.4.3　使用Web安全色53

3.4.4　吸管工具：選取畫面中的顏色54

舉一反三：從優(yōu)秀作品中提取配色方案54

3.4.5　快速填充前景色/背景色54

練習實例：填充合適的前景色制作運動廣告55

綜合實例：商城折扣廣告56

第4章 商品圖片的瑕疵去除58

　　視頻講解：99分鐘

4.1　在網(wǎng)店版面中繪畫59

4.1.1　動手練：畫筆工具59

舉一反三：使用畫筆工具為畫面增添朦朧感60

練習實例：使用畫筆工具繪制陰影增強畫面真實感61

練習實例：使用畫筆工具繪制手繪感優(yōu)惠券62

4.1.2　橡皮擦工具62

舉一反三：巧用橡皮擦工具融合兩幅圖像制作背景圖63

練習實例：使用畫筆工具與橡皮擦工具制作優(yōu)惠券64

4.1.3　畫筆設置面板：設置各種不同的筆觸效果65

練習實例：使用畫筆工具制作甜美色系冰激凌廣告68

4.2　修復圖像的瑕疵70

4.2.1　仿制圖章工具：用已有像素覆蓋多余部分70

4.2.2　圖案圖章工具：繪制圖案71

練習實例：使用圖案圖章工具制作服裝印花71

4.2.3　污點修復畫筆工具：去除較小瑕疵72

4.2.4　修復畫筆工具：自動修復圖像瑕疵73

練習實例：使用修復畫筆工具去除畫面中的多余內(nèi)容73

4.2.5　修補工具：去除雜物74

舉一反三：去除復雜水印75

4.2.6　內(nèi)容感知移動工具：輕松改變畫面中物體的位置75

4.2.7　紅眼工具：去除紅眼問題76

4.2.8　內(nèi)容識別：自動清除雜物76

4.3　圖像的簡單修飾76

4.3.1　減淡工具：對圖像局部進行減淡處理76

舉一反三：制作純白背景77

4.3.2　加深工具：對圖像局部顏色進行加深處理77

舉一反三：制作純黑背景78

4.3.3　海綿工具：增強/減弱圖像局部飽和度78

練習實例：使用海綿工具進行局部去色78

4.3.4　涂抹工具：圖像局部柔和拉伸處理79

4.3.5　顏色替換工具：更改局部顏色79

4.3.6　液化：瘦臉瘦身隨意變81

練習實例：應用液化濾鏡為美女瘦臉82

4.4　圖像的模糊處理83

4.4.1　對圖像局部進行模糊處理83

舉一反三：使用模糊工具打造柔和肌膚83

4.4.2　圖像整體的輕微模糊83

4.4.3　高斯模糊：最常用的模糊濾鏡84

舉一反三：制作飄浮物體的模糊陰影效果84

4.4.4　減少畫面噪點/細節(jié)85

練習實例：快速凈化背景85

練習實例：為商品制作多種效果的陰影86

4.5　增強圖像清晰度88

4.5.1　對圖像局部進行銳化處理89

4.5.2　輕微的快速銳化89

4.5.3　USM銳化：使圖像變清晰89

4.5.4　智能銳化：增強圖像清晰度90

練習實例：應用智能銳化濾鏡使珠寶更精致91

4.5.5　防抖：減少拍照抖動模糊91

第5章 商品圖片的調(diào)色美化94

　　視頻講解：114分鐘

5.1　調(diào)色前的準備工作95

5.1.1　動手練：使用調(diào)色命令調(diào)色95

5.1.2　動手練：使用調(diào)整圖層調(diào)色96

5.2　自動矯正商品照片存在的偏色問題97

5.2.1　自動對比度97

5.2.2　自動色調(diào)97

5.2.3　自動顏色97

5.3　調(diào)整圖像的明暗97

5.3.1　亮度/對比度98

5.3.2　動手練：色階98

5.3.3　動手練：曲線100

練習實例：使用曲線命令提亮畫面101

5.3.4　曝光度103

5.3.5　陰影/高光104

5.4　調(diào)整圖像的色彩105

5.4.1　自然飽和度105

練習實例：使產(chǎn)品圖片更鮮艷106

練習實例：使用自然飽和度命令還原花瓶顏色106

5.4.2　色相/飽和度108

練習實例：改變?nèi)棺宇伾?09

5.4.3　色彩平衡112

5.4.4　黑白113

5.4.5　動手練：照片濾鏡114

5.4.6　通道混合器114

5.4.7　動手練：顏色查找115

5.4.8　反相115

5.4.9　色調(diào)分離115

5.4.10　閾值116

5.4.11　動手練：漸變映射116

練習實例：使用漸變映射命令打造復古電影色調(diào)116

5.4.12　可選顏色117

練習實例：使用可選顏色命令制作小清新色調(diào)118

練習實例：美化灰蒙蒙的商品照片119

5.4.13　動手練：HDR色調(diào)122

5.4.14　去色124

練習實例：使用去色命令制作服飾主圖124

5.4.15　動手練：匹配顏色125

5.4.16　動手練：替換顏色125

5.4.17　色調(diào)均化126

5.5　使用圖層混合進行商品調(diào)色127

5.5.1　為圖層設置透明效果127

5.5.2　圖層的混合效果127

舉一反三：使用強光混合模式制作雙重曝光效果130

練習實例：制作不同顏色的珍珠戒指131

練習實例：設置混合模式制作朦朧感廣告133

綜合實例：打造清新淡雅色調(diào)134

綜合實例：制作運動鞋創(chuàng)意廣告137

第6章 商品圖片的摳圖與創(chuàng)意合成139

　　視頻講解：63分鐘

6.1　認識摳圖140

6.1.1　什么是摳圖140

6.1.2　如何選擇合適的摳圖方法140

6.2　商品與背景存在色差的摳圖141

6.2.1　快速選擇工具：通過拖動自動創(chuàng)建選區(qū)141

6.2.2　魔棒工具：獲取容差范圍內(nèi)顏色的選區(qū)142

練習實例：使用魔棒工具去除背景制作數(shù)碼產(chǎn)品廣告143

6.2.3　磁性套索工具：自動查找差異邊緣繪制選區(qū)144

6.2.4　色彩范圍：獲取特定顏色選區(qū)144

練習實例：使用色彩范圍命令制作中國風招貼146

6.2.5　魔術橡皮擦工具：擦除顏色相似區(qū)域147

6.2.6　背景橡皮擦工具：智能擦除背景像素148

6.3　智能識別商品的摳圖功能149

6.3.1　焦點區(qū)域：自動獲取清晰部分的選區(qū)149

6.3.2　選擇并遮�。簱赋鲞吘壖毭艿膱D像151

練習實例：使用選擇并遮住命令為長發(fā)模特換背景153

6.3.3　擴大選取154

6.3.4　選取相似154

6.4　選區(qū)的編輯155

6.4.1　變換選區(qū)：縮放、旋轉(zhuǎn)、扭曲、透視、變形155

6.4.2　創(chuàng)建邊界選區(qū)155

6.4.3　平滑選區(qū)155

6.4.4　擴展選區(qū)156

練習實例：擴展選區(qū)制作不規(guī)則圖形的底色156

6.4.5　收縮選區(qū)157

舉一反三：去除摳圖之后的像素殘留157

6.4.6　羽化選區(qū)157

6.5　鋼筆摳圖：精確提取邊緣清晰的商品158

6.5.1　認識鋼筆工具158

6.5.2　動手練：使用鋼筆工具繪制路徑159

6.5.3　編輯路徑形態(tài)160

6.5.4　將路徑轉(zhuǎn)換為選區(qū)161

6.5.5　動手練：使用鋼筆工具為人像摳圖161

6.5.6　自由鋼筆工具163

6.5.7　磁性鋼筆工具164

練習實例：使用磁性鋼筆工具為人像更換背景164

6.6　利用蒙版進行非破壞性的摳圖165

6.6.1　圖層蒙版166

舉一反三：使用圖層蒙版輕松融圖制作橫版廣告168

練習實例：制作不規(guī)則對象的倒影168

6.6.2　剪貼蒙版170

舉一反三：使用調(diào)整圖層與剪貼蒙版進行調(diào)色171

練習實例：使用剪貼蒙版制作多彩拼貼標志172

6.7　通道摳圖：針對帶有毛發(fā)、半透明的商品173

6.7.1　通道與摳圖173

6.7.2　通道與選區(qū)173

6.7.3　動手練：使用通道進行摳圖174

舉一反三：通道摳圖動物皮毛175

舉一反三：通道摳圖透明物體176

舉一反三：通道摳圖白紗177

6.8　透明背景素材的獲取與保存178

綜合實例：制作箱包創(chuàng)意廣告179

第7章 制作特殊效果的商品圖像183

　　視頻講解：79分鐘

7.1　使用濾鏡處理商品照片184

7.1.1　認識濾鏡菜單184

7.1.2　動手練：使用濾鏡組184

7.1.3　濾鏡庫：效果濾鏡大集合186

練習實例：使用海報邊緣濾鏡制作涂鴉感繪畫186

練習實例：使用照亮邊緣濾鏡模擬設計手稿187

7.2　為商品添加特殊濾鏡效果188

7.2.1　風格化濾鏡組188

7.2.2　扭曲濾鏡組188

練習實例：拼貼畫效果詳情頁191

7.2.3　像素化濾鏡組194

7.2.4　渲染濾鏡組194

舉一反三：打造燃燒的火焰文字197

7.2.5　雜色濾鏡組198

練習實例：使用添加雜色濾鏡制作雪景199

練習實例：制作磨砂質(zhì)感的反光200

7.3　制作帶有運動感的模糊圖像202

7.3.1　動感模糊：制作運動模糊效果202

練習實例：使用動感模糊濾鏡制作運動畫面203

7.3.2　徑向模糊203

7.3.3　動手練：路徑模糊204

7.3.4　動手練：旋轉(zhuǎn)模糊205

舉一反三：讓靜止的車動起來205

7.4　特殊的模糊效果206

7.4.1　鏡頭模糊：模擬大光圈/淺景深效果206

舉一反三：多層次模糊使產(chǎn)品更突出207

7.4.2　場景模糊：定點模糊207

7.4.3　動手練：光圈模糊208

7.4.4　移軸模糊：輕松打造移軸攝影209

7.5　其他模糊效果209

7.5.1　方框模糊209

7.5.2　形狀模糊210

7.5.3　特殊模糊210

7.5.4　平均：得到畫面平均顏色210

7.6　制作簡單的商品動態(tài)圖211

7.6.1　認識幀動畫時間軸面板211

7.6.2　動手練：創(chuàng)建幀動畫212

練習實例：動態(tài)商品展示圖213

綜合實例：暗色調(diào)食品類目展示頁面215

第8章 批量快速處理淘寶圖片218

　　視頻講解：13分鐘

8.1　動作：自動處理商品照片219

8.1.1　認識動作面板219

8.1.2　記錄與使用動作219

練習實例：使用動作自動處理221

8.2　自動處理大量商品圖片222

練習實例：為商品照片批量添加水印223

練習實例：對大量商品照片批量調(diào)色224

8.3　圖像處理器：批量限制商品圖片尺寸226

綜合實例：批處理制作清新美食照片227

第3部分淘寶店鋪版面設計篇

第9章 淘寶美工必學的版式設計基礎知識230

9.1　版式設計基礎知識231

9.1.1　版式設計的構(gòu)成231

9.1.2　視覺流程與網(wǎng)店版面編排231

9.1.3　網(wǎng)店版式的設計原則232

9.2　店鋪首頁234

9.2.1　店鋪首頁的作用234

9.2.2　店鋪首頁的構(gòu)成234

9.2.3　常見的首頁構(gòu)圖方式235

9.3　詳情頁的構(gòu)成236

9.3.1　寶貝詳情頁的構(gòu)成236

9.3.2　寶貝詳情頁的內(nèi)容安排237

9.4　常見的店鋪廣告構(gòu)圖方式238

9.5　商品主圖的構(gòu)成239

9.5.1　商品主圖的構(gòu)成239

9.5.2　商品主圖設計技巧239

9.5.3　商品主圖的常見構(gòu)圖方式240

9.6　使用輔助工具輔助制圖241

9.6.1　標尺241

9.6.2　參考線241

9.6.3　智能參考線242

9.6.4　網(wǎng)格243

9.6.5　對齊243

第10章 淘寶美工必學的色彩搭配244

10.1　色彩的基本知識245

10.1.1　色彩的三大屬性245

10.1.2　關于色彩的一些關鍵詞245

10.1.3　主色、輔助色、點綴色247

10.1.4　如何進行顏色的選擇247

10.1.5　色彩搭配的小技巧248

10.2　色彩對比248

10.2.1　同類色對比249

10.2.2　鄰近色對比249

10.2.3　類似色對比249

10.2.4　對比色對比249

10.2.5　互補色對比250

10.2.6　明度對比250

10.2.7　純度對比250

10.2.8　面積對比251

10.2.9　冷暖對比251

10.3　傳達不同情感的配色方式251

10.3.1　健康251

10.3.2　潔凈252

10.3.3　女性化252

10.3.4　男性化253

10.3.5　溫暖253

10.3.6　清涼254

10.3.7　歡快254

10.3.8　冷靜255

10.3.9　商務255

10.3.10　閑適256

10.3.11　樸實256

10.3.12　奢華257

10.3.13　溫柔257

10.3.14　冷峻258

10.3.15　年輕258

10.3.16　成熟259

10.3.17　柔軟259

10.3.18　堅硬260

第11章 網(wǎng)店頁面繪圖261

　　視頻講解：112分鐘

11.1　為網(wǎng)店版面填充圖案/漸變262

11.1.1　動手練：使用填充命令262

11.1.2　油漆桶工具：為顏色相近范圍進行填充262

練習實例：使用油漆桶工具為背景填充圖案263

11.1.3　動手練：漸變工具264

練習實例：制作帶有倒影的手機展示效果266

11.2　認識矢量繪圖270

11.2.1　什么是矢量圖形270

11.2.2　矢量繪圖的幾種模式270

11.2.3　動手練：使用形狀模式繪圖271

11.2.4　使用像素模式繪圖273

練習實例：動感色彩廣告274

11.3　在網(wǎng)頁中繪制矢量幾何圖形276

11.3.1　使用矩形工具277

練習實例：家居產(chǎn)品主圖278

11.3.2　使用圓角矩形工具280

練習實例：男士運動裝通欄廣告280

練習實例：使用圓角矩形工具和矩形工具制作產(chǎn)品展

示模塊283

11.3.3　使用橢圓工具283

11.3.4　使用多邊形工具283

11.3.5　使用直線工具284

11.3.6　動手練：使用自定形狀工具285

11.3.7　矢量對象的編輯操作286

練習實例：使用矢量工具制作寶貝列表287

練習實例：商務感網(wǎng)站宣傳圖290

11.3.8　動手練：路徑的加減運算292

11.3.9　動手練：描邊路徑294

綜合實例：暗紅色調(diào)輪播圖295

綜合實例：使用矢量工具制作網(wǎng)頁廣告298

綜合實例：甜美風格女裝廣告301

第12章 在網(wǎng)店頁面中添加文字304

　　視頻講解：117分鐘

12.1　創(chuàng)建網(wǎng)店頁面必不可少的文字305

12.1.1　認識文字工具305

12.1.2　動手練：創(chuàng)建點文字306

練習實例：使用文字工具制作夏日感廣告307

練習實例：幼兒食品廣告310

12.1.3　動手練：創(chuàng)建段落文字313

練習實例：為商品照片添加水印313

練習實例：創(chuàng)建段落文字制作男裝宣傳頁315

12.1.4　動手練：創(chuàng)建路徑文字316

12.1.5　動手練：創(chuàng)建區(qū)域文字316

12.1.6　動手練：制作變形文字316

練習實例：變形藝術字317

12.1.7　文字蒙版工具：創(chuàng)建文字選區(qū)319

12.1.8　字符面板320

練習實例：使用文字工具制作運動器材宣傳圖321

12.1.9　段落面板323

12.1.10　柵格化：文字對象變?yōu)槠胀▓D層325

練習實例：網(wǎng)店粉筆字公告325

12.1.11　動手練：文字對象轉(zhuǎn)換為形狀圖層326

練習實例：制作香水主圖326

練習實例：護膚品主題廣告329

12.2　圖層樣式：為文字增添奇妙效果333

12.2.1　動手練：使用圖層樣式334

12.2.2　斜面和浮雕337

12.2.3　描邊337

練習實例：利用圖層樣式制作產(chǎn)品頁面338

12.2.4　內(nèi)陰影341

12.2.5　內(nèi)發(fā)光342

12.2.6　光澤342

12.2.7　顏色疊加343

12.2.8　漸變疊加343

12.2.9　圖案疊加343

12.2.10　外發(fā)光344

12.2.11　投影344

練習實例：清新風格服裝主圖345

練習實例：動感繽紛藝術字347

綜合實例：運動風通欄廣告351

綜合實例：活動宣傳頁面廣告354

第13章 網(wǎng)頁切片與輸出361

13.1　為制作好的網(wǎng)店頁面切片362

13.1.1　什么是切片362

13.1.2　認識切片工具362

13.1.3　動手練：使用切片工具劃分切片363

13.1.4　動手練：基于參考線創(chuàng)建切片364

13.1.5　動手練：基于圖層創(chuàng)建切片366

13.1.6　動手練：自動劃分切片366

13.1.7　提升：自動切片轉(zhuǎn)換為用戶切片366

13.1.8　設置切片選項367

練習實例：基于參考線劃分網(wǎng)頁切片367

13.2　輸出切片完成的網(wǎng)頁368

13.2.1　使用預設輸出網(wǎng)頁369

13.2.2　設置不同的存儲格式369

13.3　將切片上傳到網(wǎng)絡圖片空間371

綜合實例：使用切片工具進行網(wǎng)頁切片372

第4部分綜合實戰(zhàn)篇

第14章 網(wǎng)店設計綜合實戰(zhàn)375

　　視頻講解：136分鐘

14.1　童裝網(wǎng)店標志設計376

Part 1　制作標志背景376

Part 2　制作標志圖形376

Part 3　制作標志上的文字377

14.2　清新風格女裝通欄廣告377

Part 1　制作背景部分378

Part 2　制作廣告文字378

Part 3　添加人物380

14.3　中式風格產(chǎn)品廣告381

Part 1　制作廣告背景381

Part 2　制作主體圖像及文字383

Part 3　制作廣告展示效果385

14.4　化妝品圖像精修386

Part 1　摳圖并制作背景386

Part 2　瓶蓋修飾387

Part 3　文字部分修飾388

Part 4　瓶身修飾389

Part 5　整體調(diào)色391

14.5　摩登拼貼感店鋪首頁392

Part 1　制作店招及導航欄392

Part 2　制作產(chǎn)品圖片及文字信息393

Part 3　制作網(wǎng)頁底欄395

14.6　青春感網(wǎng)店首頁設計395

Part 1　制作網(wǎng)店頁面背景396

Part 2　制作店招397

Part 3　制作導航欄398

Part 4　制作首頁廣告399

Part 5　制作產(chǎn)品模塊403

Part 6　制作展示效果406

14.7　自然風網(wǎng)店首頁設計407

Part 1　制作網(wǎng)店頁面背景407

Part 2　制作店招408

Part 3　制作導航欄409

Part 4　制作通欄廣告410

Part 5　制作產(chǎn)品模塊412

Part 6　制作其他產(chǎn)品模塊415

Part 7　制作網(wǎng)頁底欄417