第1章 初識網(wǎng)店美工 ■　1.1∣熟悉網(wǎng)店美工崗位 ..................002 1.1.1　淘寶、天貓網(wǎng)店美工人員的 工作范疇　...............................　002 1.1.2　網(wǎng)店美工的技能要求 .............　002 1.1.3　實戰(zhàn)——搜索并熟悉網(wǎng)店 美工　......................................　002 ■　1.2∣熟悉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的 “圖層”面板　..........................　007 1.2.4　認(rèn)識與應(yīng)用圖層樣式 .............　008 1.2.5　實戰(zhàn)——制作促銷標(biāo)簽 .........　009 ■　1.3∣網(wǎng)店美工設(shè)計的基本理念 ....012 1.3.1　了解設(shè)計元素 ..........................　012 1.3.2　色彩的搭配 ...........................　013 1.3.3　文字的字體 ...........................　014 1.3.4　視覺構(gòu)圖與頁面布局 的原則　..................................　016 1.3.5　實戰(zhàn)——網(wǎng)店首頁視覺 賞析　......................................　017 ■　1.4∣擴展閱讀——高級網(wǎng)店美工人員的
成長路徑 .................................018 ■　1.5∣高手進階 ................................019 第2章　商品圖片的拍攝與處理 ■　2.1∣拍攝商品圖片 .........................021 2.1.1　拍攝商品圖片的要求 .............　021 2.1.2　拍攝商品圖片的基本流程 ......　022 2.1.3　拍攝商品圖片的基本技巧 ......　022 2.1.4　實戰(zhàn)——拍攝口紅 .................　025 2.1.5　實戰(zhàn)——拍攝手表 .................　027 ■　2.2∣調(diào)整商品圖片的尺寸 ..............030 2.2.1　淘寶、天貓中圖片文件的 格式　..........................................　030 2.2.2　調(diào)整商品圖片大小與角度 的技巧　......................................　030 2.2.3　實戰(zhàn)——矯正、裁剪并 設(shè)置商品主圖尺寸　................　031 2.2.4　實戰(zhàn)——裁剪商品細(xì)節(jié)圖 .............................................　033 ■　2.3∣修飾商品圖片 .........................036 2.3.1　修飾圖片的必要性 .................　036 2.3.2　修圖的常用方法 ....................　036 2.3.3　實戰(zhàn)——網(wǎng)店女裝模特美化 ...　038 2.3.4　實戰(zhàn)——金屬質(zhì)感首飾處理 ...　040 2.3.5　實戰(zhàn)——功能展示圖制作 ......　042 ■　2.4∣調(diào)整商品圖片的色彩與 質(zhì)感　.......................................045 2.4.1　調(diào)色的必要性 ........................　045 2.4.2　商品調(diào)色的原則 ....................　045 2.4.3　圖片色彩校正的方法 .............　046 2.4.4　調(diào)色的常用命令 ....................　047 2.4.5　實戰(zhàn)——圖片亮度與鮮艷度 調(diào)整　......................................　047 2.4.6　實戰(zhàn)——圖片偏色調(diào)整 .........　049 2.4.7　實戰(zhàn)——圖片質(zhì)感調(diào)整 .........　050 ■　2.5∣擴展閱讀——修圖內(nèi)容分析 ...052 ■　2.6∣高手進階 ................................053 第3章　商品圖片的特殊處理 ■　3.1 ∣商品圖片的背景處理 .............055 3.1.1　從背景中摳取商品的技巧 .....055 3.1.2　鋼筆工具的使用 ....................　057 3.1.3　虛化效果的設(shè)置 ....................　058 3.1.4　使用蒙版控制圖像的顯示 ......　058 3.1.5　實戰(zhàn)——虛化商品圖片背景 ..　058 3.1.6　實戰(zhàn)——處理白底商品圖片 背景　......................................　060 3.1.7　實戰(zhàn)——替換玻璃杯圖片 背景　......................................　061 ■　3.2∣商品圖片的組合 .....................065 3.2.1　圖片組合的類型 ....................　065 3.2.2　圖文搭配技巧 ........................　065 3.2.3　商品的陳列方式 ....................　066 3.2.4　商品的陳列原則 ....................　067 3.2.5　商品圖片的排列、分布與 對齊　......................................　068 3.2.6　實戰(zhàn)——圖文組合 .................　069 ■　3.3∣商品圖片的切片與管理 ..........072 3.3.1　切片的作用 ...........................　072 3.3.2　切片技巧 ...............................　072 3.3.3　管理素材中心圖片 .................　072 3.3.4　查看圖片排列方式與引用 ......　073 3.3.5　實戰(zhàn)——新品女包促銷模塊 切片　......................................　074 3.3.6　實戰(zhàn)——上傳商品圖片到 素材中心　...............................　077 3.3.7　實戰(zhàn)——刪除、還原和替換 素材中心的圖片　....................　078 ■　3.4∣擴展閱讀——淘寶網(wǎng)店的圖片 處理技巧　................................080 ■　3.5∣高手進階 ................................081 第4章　網(wǎng)店推廣圖設(shè)計 ■　4.1∣店標(biāo)設(shè)計 ................................084 4.1.1　店標(biāo)制作流程 ........................　084 4.1.2　店標(biāo)的設(shè)計要點 ....................　085 4.1.3　實戰(zhàn)——店標(biāo)制作 .................　085 4.1.4　實戰(zhàn)——上傳店標(biāo) .................　088 ■　4.2∣直通車推廣圖設(shè)計 ..................089 4.2.1　直通車的設(shè)計原則 .................　089 4.2.2　直通車引流的關(guān)鍵 .................　090 4.2.3　實戰(zhàn)——制作直通車推廣圖 ...　091 ■　4.3∣智鉆圖設(shè)計 ............................095 4.3.1　智鉆位置 ...............................　095 4.3.2　智鉆圖設(shè)計標(biāo)準(zhǔn) ....................　096 4.3.3　智鉆圖的構(gòu)圖方式 .................　097 4.3.4　實戰(zhàn)——制作首焦智鉆圖 ......　099 ■　4.4∣擴展閱讀——促銷廣告實施 步驟　.......................................101 ■　4.5∣高手進階 ................................102 第5章　店鋪首頁視覺設(shè)計 ■　5.1∣了解店鋪首頁 .........................104 5.1.1　了解店鋪首頁的基礎(chǔ)模塊 ......　104 5.1.2　店鋪首頁模塊布局的要點 ......　105 5.1.3　實戰(zhàn)——應(yīng)用系統(tǒng)模板 .........　105 5.1.4　實戰(zhàn)——搭建首頁框架 .........　106 ■　5.2∣設(shè)計店招與導(dǎo)航條 ..................108 5.2.1　店招的設(shè)計原則 ....................　108 5.2.2　店招的風(fēng)格分析 ....................　109 5.2.3　店招的設(shè)計要求 ....................　109 5.2.4　實戰(zhàn)——制作常規(guī)店招 .........　110 5.2.5　實戰(zhàn)——制作通欄店招 .........　112 ■　5.3∣設(shè)計全屏輪播圖 .....................114 5.3.1　不同輪播圖的尺寸要求 .........　114 5.3.2　全屏海報的設(shè)計要點 .............　115 第3章 文前.indd　6 2021-1-5 10:26:09 5.3.3　實戰(zhàn)——制作首張全屏 海報　......................................　115 5.3.4　實戰(zhàn)——制作第2張全屏 海報　......................................　117 ■　5.4∣設(shè)計優(yōu)惠券模塊 .....................120 5.4.1　優(yōu)惠券設(shè)計要點 ....................　120 5.4.2　實戰(zhàn)——制作優(yōu)惠券 .............　121 ■　5.5∣設(shè)計分類模塊 .........................122 5.5.1　分類模塊設(shè)計要點 .................　122 5.5.2　實戰(zhàn)——制作分類模塊 .........　123 ■　5.6∣設(shè)計商品展示模塊 ..................125 5.6.1　商品展示模塊設(shè)計要點 .........　126 5.6.2　實戰(zhàn)——制作商品上新 預(yù)告模塊　...............................　126 5.6.3　實戰(zhàn)——制作商品推薦 模塊　......................................　128 ■　5.7∣擴展閱讀——首頁背景的 應(yīng)用　.......................................131 ■　5.8∣高手進階 ................................132 第6章　商品詳情頁視覺設(shè)計 ■　6.1∣了解商品詳情頁 .....................135 6.1.1　了解商品詳情頁的模塊 .........　136 6.1.2　商品詳情頁的內(nèi)容分析 與設(shè)計要點　...........................　137 6.1.3　實戰(zhàn)——商品詳情頁布局 ......　138 6.1.4　實戰(zhàn)——制作商品詳情 分類條　..................................　139 ■　6.2∣商品詳情頁焦點圖設(shè)計 ..........140 6.2.1　商品詳情頁焦點圖設(shè)計要點 ...　140 6.2.2　實戰(zhàn)——制作商品詳情頁 焦點圖　..................................　141 ■　6.3∣建議搭配模塊設(shè)計 ..................143 6.3.1　建議搭配模塊設(shè)計要點 .........　143 6.3.2　實戰(zhàn)——制作建議搭配 模塊　......................................　144 ■　6.4∣商品賣點圖設(shè)計 .....................146 6.4.1　商品賣點的特征 ....................　146 6.4.2　商品賣點提煉的原則 與方法　..................................　147 6.4.3　實戰(zhàn)——制作商品 賣點圖　...................................　147 ■　6.5∣商品信息展示圖設(shè)計 ..............151 6.5.1　商品參數(shù)的常用表達方式 ......　151 6.5.2　對比圖的展示 ........................　151 6.5.3　商品信息的展示方式 .............　152 6.5.4　實戰(zhàn)——制作商品參數(shù) 展示圖　...................................　152 6.5.5　實戰(zhàn)——制作商品尺碼 對照展示圖　...........................　154 6.5.6　實戰(zhàn)——制作商品顏色 展示圖　..................................　156 6.5.7　實戰(zhàn)——制作商品全方位 展示圖　..................................　157 ■　6.6∣商品細(xì)節(jié)圖設(shè)計 .....................159 6.6.1　商品細(xì)節(jié)圖設(shè)計要點 .............　159 6.6.2　實戰(zhàn)——制作商品細(xì)節(jié)圖 ......　160 ■　6.7∣擴展閱讀——抓住商品詳情頁 設(shè)計的重點　.............................162 ■　6.8∣高手進階 ................................163 第7章　手機端店鋪頁面設(shè)計 ■　7.1∣了解手機端店鋪頁面設(shè)計 .......165 7.1.1　手機端店鋪頁面設(shè)計的潮流 趨勢　......................................　165 7.1.2　手機端店鋪頁面的設(shè)計要點 ...　165 7.1.3　實戰(zhàn)——手機端店鋪頁面與 PC端店鋪頁面對比分析　........　166 ■　7.2∣手機端店鋪首頁頁面設(shè)計 .......167 7.2.1　認(rèn)識手機端店鋪首頁的模塊 組成　......................................　168 文前.indd　7 2021-1-5 10:26:09 7.2.2　手機端店鋪首頁模塊的 特點與設(shè)計要點　....................　168 7.2.3　手機端店鋪首頁頁面 設(shè)計的注意事項　....................　169 7.2.4　實戰(zhàn)——制作手機端店鋪 店招　.....................................　169 7.2.5　實戰(zhàn)——制作手機端店鋪 焦點圖　.................................　172 7.2.6　實戰(zhàn)——制作手機端店鋪 優(yōu)惠券　..................................　174 7.2.7　實戰(zhàn)——制作手機端店鋪 分類導(dǎo)航　...............................　175 7.2.8　實戰(zhàn)——制作手機端店鋪 商品列表圖　...........................　177 ■　7.3∣手機端商品詳情頁頁面設(shè)計 ...182 7.3.1　手機端商品詳情頁的特征 ......　182 7.3.2　手機端商品詳情頁的設(shè)計 要點　......................................　182 7.3.3　實戰(zhàn)——制作手機端商品 詳情頁　..................................　183 ■　7.4∣擴展閱讀——手機端活動頁的 主要類型　................................186 ■　7.5∣高手進階 ................................187 第8章　網(wǎng)店視頻的拍攝與制作 ■　8.1∣網(wǎng)店視頻拍攝 .........................189 8.1.1　視頻拍攝的要求 ....................　189 8.1.2　視頻拍攝的設(shè)置 ...................　190 8.1.3　視頻拍攝的流程 ....................　191 8.1.4　實戰(zhàn)——拍攝女士套裝主圖 視頻　......................................　192 8.1.5　實戰(zhàn)——拍攝電動牙刷詳情 頁視頻　..................................　194 ■　8.2∣網(wǎng)店視頻制作 .........................198 8.2.1　認(rèn)識快剪輯視頻剪輯軟件 ......　198 8.2.2　視頻制作流程 ........................　201 8.2.3　實戰(zhàn)——編輯和分割主圖 視頻　......................................　203 8.2.4　實戰(zhàn)——編輯和分割詳情頁 視頻　......................................　205 8.2.5　實戰(zhàn)——為主圖視頻添加轉(zhuǎn)場和 濾鏡特效　...............................　208 8.2.6　實戰(zhàn)——為詳情頁視頻添加字 幕和音頻特效　.......................　209 ■　8.3∣網(wǎng)店視頻上傳與應(yīng)用 ..............214 8.3.1　支持視頻功能的商品 類目　......................................　214 8.3.2　上傳視頻要達到的要求 .........　215 8.3.3　視頻的上傳 ...........................　215 8.3.4　實戰(zhàn)——上傳主圖視頻到 網(wǎng)店　......................................　216 8.3.5　實戰(zhàn)——詳情頁視頻的應(yīng)用...　218 ■　8.4∣擴展閱讀——網(wǎng)店視頻的拍攝 技巧　.......................................219