第 1篇　網(wǎng)店美工基礎(chǔ)

第　1章 初識網(wǎng)店美工

■　1.1?O熟悉淘寶、天貓網(wǎng)店美工崗位　002

1.1.1　淘寶、天貓網(wǎng)店美工的工作范疇與設(shè)計(jì)要求　002

1.1.2　網(wǎng)店美工的技能要求　002

1.1.3　搜索并熟悉網(wǎng)店美工知識　002

■　1.2?O熟悉Photoshop圖像處理軟件　004

1.2.1　認(rèn)識Photoshop CS6的工作界面　004

1.2.2　認(rèn)識Photoshop CS6的常用工具　005

1.2.3　認(rèn)識Photoshop CS6的“圖層”面板　006

1.2.4　圖層常用的操作　007

1.2.5　認(rèn)識與應(yīng)用圖層樣式　008

1.2.6　Photoshop中的常用快捷組合鍵　009

1.2.7　促銷標(biāo)簽制作實(shí)戰(zhàn)　010

■　1.3?O熟悉其他常用的圖像制作與處理軟件　013

1.3.1　認(rèn)識Adobe Illustrator CS6　013

1.3.2　認(rèn)識美圖秀秀　014

1.3.3　Illustrator制作吊牌實(shí)戰(zhàn)　014

1.3.4　美圖秀秀制作海報(bào)拼圖實(shí)戰(zhàn)　017

■　1.4?O擴(kuò)展閱讀——淘寶、天貓網(wǎng)店美工的成長路徑　020

■　1.5?O高手進(jìn)階　021

第　2章 網(wǎng)店美工設(shè)計(jì)的基本理念

■　2.1?O了解設(shè)計(jì)元素　023

2.1.1　點(diǎn)　023

2.1.2　線　023

2.1.3　面　024

2.1.4　全屏海報(bào)設(shè)計(jì)元素賞析　025

■　2.2?O色彩的搭配　026

2.2.1　色彩的屬性與對比　026

2.2.2　主色、輔助色與點(diǎn)綴色　027

2.2.3　店鋪首頁顏色賞析　028

■　2.3?O文案排版設(shè)計(jì)　029

2.3.1　字體的性格特征　030

2.3.2　字體風(fēng)格的搭配　031

2.3.3　字體的布局技巧　032

2.3.4　海報(bào)字體搭配賞析　033

■　2.4?O視覺構(gòu)圖與頁面的布局　034

2.4.1　視覺構(gòu)圖　034

2.4.2　店鋪頁面布局的基本元素　036

2.4.3　店鋪頁面布局的原則　037

2.4.4　淘寶首頁視覺賞析　038

■　2.5?O擴(kuò)展閱讀——淘寶、天貓文本裝飾技巧　039

■　2.6?O高手進(jìn)階　041

第　2篇 店鋪圖片的處理與管理

第3章　商品圖片的處理

■　3.1?O調(diào)整商品圖片的尺寸　044

3.1.1　淘寶、天貓中圖片文件的格式　044

3.1.2　調(diào)整商品圖片大小與角度的技巧　044

3.1.3　商品圖片的要求　045

3.1.4　矯正、裁剪并設(shè)置商品主圖的尺寸實(shí)戰(zhàn)　046

3.1.5　裁剪商品細(xì)節(jié)圖實(shí)戰(zhàn)　047

■　3.2?O修飾商品圖片　049

3.2.1　圖片修飾的必要性　050

3.2.2　修圖的常用方法　050

3.2.3　淘寶、天貓模特美化實(shí)戰(zhàn)　051

3.2.4　金屬質(zhì)感首飾處理實(shí)戰(zhàn)　053

3.2.5　商品描述圖制作實(shí)戰(zhàn)　056

■　3.3?O調(diào)整商品圖片的色彩與質(zhì)感　058

3.3.1　調(diào)色的必要性　058

3.3.2　商品調(diào)色的原則　058

3.3.3　圖片色彩校正的方法　059

3.3.4　調(diào)色的常用命令　059

3.3.5　圖片亮度與鮮艷度調(diào)整實(shí)戰(zhàn)　060

3.3.6　圖片偏色調(diào)整實(shí)戰(zhàn)　062

3.3.7　圖片質(zhì)感調(diào)整實(shí)戰(zhàn)　063

■　3.4?O擴(kuò)展閱讀——修圖內(nèi)容分析　065

■　3.5?O高手進(jìn)階　066

第4章　商品圖片的特殊處理

■　4.1?O處理商品圖片的背景　068

4.1.1　從背景中摳取商品的技巧　068

4.1.2　鋼筆工具的使用　070

4.1.3　虛化效果的設(shè)置　070

4.1.4　使用蒙版控制圖像的顯示　071

4.1.5　虛化商品背景實(shí)戰(zhàn)　071

4.1.6　白底商品背景處理實(shí)戰(zhàn)　072

4.1.7　替換玻璃杯背景實(shí)戰(zhàn)　074

■　4.2?O商品圖片的組合　077

4.2.1　圖片組合的類型　077

4.2.2　圖文搭配技巧　077

4.2.3　商品的陳列方式　078

4.2.4　商品的陳列原則　079

4.2.5　商品圖片的排列、分布與對齊　080

4.2.6　圖文組合實(shí)戰(zhàn)　081

■　4.3?O擴(kuò)展閱讀 ——淘寶開店的圖片處理技巧　084

■　4.4?O高手進(jìn)階　084

第5章　商品圖片的切片與管理

■　5.1?O商品圖片的切片　087

5.1.1　切片的作用　087

5.1.2　切片技巧　087

5.1.3　認(rèn)識標(biāo)尺、輔助線　087

5.1.4　新品上市促銷模塊切片實(shí)戰(zhàn)　088

■　5.2?O商品圖片的管理　091

5.2.1　圖片空間的優(yōu)勢　092

5.2.2　管理空間圖片　092

5.2.3　查看圖片引用與排列方式　093

5.2.4　上傳優(yōu)化后的商品圖片到圖片空間實(shí)戰(zhàn)　094

5.2.5　刪除與還原空間圖片實(shí)戰(zhàn)　095

5.2.6　替換空間圖片實(shí)戰(zhàn)　096

■　5.3?O擴(kuò)展閱讀——將切片后的圖片應(yīng)用到店鋪中　097

■　5.4?O高手進(jìn)階　098

第3篇　常規(guī)店鋪裝修設(shè)計(jì)

第6章　店鋪裝修元素設(shè)計(jì)

■　6.1?O店鋪Logo設(shè)計(jì)　101

6.1.1　Logo的類型　101

6.1.2　店鋪Logo設(shè)計(jì)要領(lǐng)　102

6.1.3　女鞋Logo制作實(shí)戰(zhàn)　102

■　6.2?O店標(biāo)設(shè)計(jì)　104

6.2.1　店標(biāo)制作方法　105

6.2.2　店標(biāo)的設(shè)計(jì)要點(diǎn)　105

6.2.3　靜態(tài)店標(biāo)制作實(shí)戰(zhàn)　106

6.2.4　動態(tài)店標(biāo)制作實(shí)戰(zhàn)　108

6.2.5　上傳店標(biāo)到店鋪實(shí)戰(zhàn)　110

■　6.3?O店招設(shè)計(jì)　111

6.3.1　店招的設(shè)計(jì)原則　111

6.3.2　店招風(fēng)格分析　111

6.3.3　店招的設(shè)計(jì)要求　112

6.3.4　常規(guī)店招制作實(shí)戰(zhàn)　112

6.3.5　通欄店招制作實(shí)戰(zhàn)　115

■　6.4?O快速導(dǎo)航條設(shè)計(jì)　116

6.4.1　快速導(dǎo)航條的作用　117

6.4.2　快速導(dǎo)航條制作實(shí)戰(zhàn)　117

■　6.5?O擴(kuò)展閱讀——店招的類型　120

■　6.6?O高手進(jìn)階　121

第7章　淘寶、天貓推廣圖設(shè)計(jì)

■　7.1?O制作高點(diǎn)擊率的主圖　123

7.1.1　商品圖片的規(guī)范　123

7.1.2　商品圖片的背景搭配　124

7.1.3　制作優(yōu)質(zhì)商品主圖的技巧　124

7.1.4　高清播放器主圖制作實(shí)戰(zhàn)　126

■　7.2?O直通車推廣圖設(shè)計(jì)　130

7.2.1　認(rèn)識直通車　130

7.2.2　不同時(shí)期直通車投放的策略　131

7.2.3　直通車的設(shè)計(jì)原則　131

7.2.4　直通車引流的關(guān)鍵　132

7.2.5　直通車圖制作實(shí)戰(zhàn)　134

■　7.3?O智鉆圖設(shè)計(jì)　138

7.3.1　智鉆位置　139

7.3.2　智鉆圖設(shè)計(jì)標(biāo)準(zhǔn)　141

7.3.3　智鉆圖的排版方式　141

7.3.4　新品男士牛仔褲首焦智鉆圖制作實(shí)戰(zhàn)　143

■　7.4?O擴(kuò)展閱讀——促銷廣告實(shí)施步驟　145

■　7.5?O高手進(jìn)階　146

第8章　店鋪首頁視覺設(shè)計(jì)

■　8.1?O了解店鋪首頁　148

8.1.1　了解店鋪首頁的基礎(chǔ)模塊　148

8.1.2　店鋪首頁模塊布局的要點(diǎn)　149

8.1.3　系統(tǒng)模板應(yīng)用實(shí)戰(zhàn)　149

8.1.4　首頁框架搭建實(shí)戰(zhàn)　150

■　8.2?O設(shè)計(jì)全屏輪播圖　153

8.2.1　不同輪播圖的尺寸要求　153

8.2.2　首頁焦點(diǎn)圖的設(shè)計(jì)要點(diǎn)　154

8.2.3　首張全屏海報(bào)圖制作實(shí)戰(zhàn)　154

8.2.4　第 二張全屏海報(bào)圖制作實(shí)戰(zhàn)　156

■　8.3?O設(shè)計(jì)優(yōu)惠券模塊　160

8.3.1　優(yōu)惠券設(shè)計(jì)要點(diǎn)　160

8.3.2　女包店鋪優(yōu)惠券制作實(shí)戰(zhàn)　161

■　8.4?O設(shè)計(jì)分類模塊　162

8.4.1　分類模塊設(shè)計(jì)要點(diǎn)　162

8.4.2　橫向分類模塊制作實(shí)戰(zhàn)　163

8.4.3　縱向分類模塊制作實(shí)戰(zhàn)　165

■　8.5?O設(shè)計(jì)商品促銷模塊　167

8.5.1　商品促銷模塊設(shè)計(jì)要點(diǎn)　167

8.5.2　商品上新預(yù)告模塊制作實(shí)戰(zhàn)　167

8.5.3　商品推薦模塊制作實(shí)戰(zhàn)　170

■　8.6?O設(shè)計(jì)收藏區(qū)與客服模塊　173

8.6.1　店鋪收藏概述　173

8.6.2　店鋪客服區(qū)的概述　173

8.6.3　收藏圖片制作實(shí)戰(zhàn)　173

8.6.4　客服區(qū)制作實(shí)戰(zhàn)　174

■　8.7?O 設(shè)計(jì)頁尾模塊　176

8.7.1　頁尾模塊設(shè)計(jì)要點(diǎn)　176

8.7.2　頁面模塊制作實(shí)戰(zhàn)　176

■　8.8?O擴(kuò)展閱讀——首頁背景的應(yīng)用　178

■　8.9?O高手進(jìn)階　178

第4篇　無線店鋪裝修設(shè)計(jì)

第　9章 無線店鋪裝修設(shè)計(jì)

■　9.1?O了解無線店鋪裝修要點(diǎn)　206

9.1.1　無線店鋪裝修的潮流趨勢　206

9.1.2　無線店鋪的裝修要點(diǎn)　206

9.1.3　無線店鋪與電腦端店鋪對比分析　206

■　9.2?O無線店鋪首頁裝修　208

9.2.1　無線店鋪裝修入口及后臺操作　208

9.2.2　認(rèn)識手機(jī)端首頁的模塊組成　209

9.2.3　認(rèn)識手機(jī)端首頁模塊的特點(diǎn)與裝修要點(diǎn)　209

9.2.4　無線店鋪首頁的裝修注意事項(xiàng)　210

9.2.5　手機(jī)端店招制作實(shí)戰(zhàn)　210

9.2.6　手機(jī)端焦點(diǎn)圖制作實(shí)戰(zhàn)　212

9.2.7　優(yōu)惠券制作實(shí)戰(zhàn)　213

9.2.8　分類導(dǎo)航的設(shè)計(jì)與裝修實(shí)戰(zhàn)　215

9.2.9　商品列表圖制作實(shí)戰(zhàn)　216

■　9.3?O使用“淘寶神筆”模板制作詳情頁　218

9.3.1　無線店鋪詳情頁的特征　219

9.3.2　無線店鋪詳情頁設(shè)計(jì)的要點(diǎn)　219

9.3.3　“淘寶神筆”模板制作實(shí)戰(zhàn)　219

■　9.4?O自定義頁面裝修　222

9.4.1　自定義頁面裝修要點(diǎn)　222

9.4.2　自定義菜單制作實(shí)戰(zhàn)　222

9.4.3　自定義頁面制作實(shí)戰(zhàn)　224

■　9.5?O擴(kuò)展閱讀——無線店鋪活動頁的主要類型　225

■　9.6?O高手進(jìn)階　226