本書是一本以淘寶美工綜合技法案例實操教學為主的書，全方面地講解美工設計師需具備的電商設計基本功底與美工實戰(zhàn)技巧。以美工設計會涉及的軟件、裝修后臺、配色及版式設計等基礎知識和圖片的處理、字體的設計與排版等基本技法為支撐，依次對淘寶店標、主圖、電商海報、店鋪首頁背景、寶貝詳情頁、優(yōu)惠券、客服中心欄、頁尾圖、無線視頻，以及手機淘寶店鋪的制作與安裝等知識點進行全方位的實戰(zhàn)演練與講解，化難為易，聚散成整，讓想要學習美工設計的讀者朋友能夠通過本書得到系統(tǒng)的學習與提升。
曾玉珍，筆名子若老師，平面設計師，淘寶美工設計師，8年電商從業(yè)經(jīng)驗，兩年實戰(zhàn)教學經(jīng)驗；服務過多家頂級的天貓旗艦店設計，有豐富的實踐行業(yè)經(jīng)驗，擅長海報設計、淘寶天貓首頁裝修設計、手機端裝修設計等，曾擔任過騰訊課堂標桿行業(yè)的平面兼職講師，歷經(jīng)8年的積累和沉淀。
01 美工設計的基本知識.......................17
1.1 概述.................................................18
1.2 認識Photoshop軟件............................18
1.2.1 界面的基本介紹................................18
1.2.2 基礎命令的介紹.................................19
1.3 認識CorelDRAW軟件............................20
1.3.1 界面的基本介紹................................20
1.3.2 基礎命令的介紹.................................20
1.4 認識Dreamweaver軟件........................21
1.4.1 Dreamweave的編輯環(huán)境介紹.....................22
1.4.2 Dreamweave的基本功能介紹.................24
1.5 關于店鋪裝修后臺的了解...................28
1.5.1 店鋪首頁的裝修................................28
1.5.2 店鋪詳情頁的裝修.............................32
1.5.3 寶貝列表頁的裝修.............................34
02 配色的基礎知識..............................37
2.1 認識色彩..........................................38
2.1.1 色彩的來源.......................................38
2.1.2 色彩模式的顯示方式..........................38
2.1.3 RGB顏色模式......................................38
2.1.4 CMYK顏色模式....................................39
2.1.5 HSB顏色模式......................................39
2.2 色彩的三要素....................................41
2.2.1 色相..................................................41
2.2.2 明度..................................................42
2.2.3 飽和度...............................................44
2.3 色彩的心理學....................................45
2.3.1 色彩有冷暖........................................45
2.3.2 色彩有重量........................................46
2.3.3 色彩有遠近........................................46
2.3.4 色彩有大小........................................46
2.3.5 色彩有味道........................................47
2.4 店鋪色彩的搭配技巧..........................47
2.4.1 互補色搭配.......................................48
2.4.2 鄰近色搭配........................................49
2.4.3 間隔色搭配........................................50
03 版式設計的基礎知識......................51
3.1 什么是版式設計................................52
3.2 平面的構成原理.................................52
3.2.1 點.....................................................52
3.2.2 線......................................................53
3.2.3 面.....................................................54
3.3 版式設計的原則.................................54
3.3.1 思想性與單一性.................................55
3.3.2 藝術性與裝飾性.................................55
3.3.3 趣味性與獨創(chuàng)性.................................55
3.4 版式設計的類型.................................56
3.4.1 骨骼型..............................................56
3.4.2 滿版型...............................................56
3.4.3 左右分割型........................................56
3.4.4 上下分割型........................................56
3.4.5 中軸型...............................................56
3.4.6 傾斜型...............................................56
3.4.7 曲線型...............................................57
3.4.8 對稱型...............................................57
3.4.9 重心型................................................57
3.4.10 三角型............................................57
3.4.11 并置型............................................58
3.4.12 自由型............................................58
3.4.13 四角型............................................58
3.5 電商設計中的元素表現(xiàn).......................58
3.5.1 重復..................................................58
3.5.2 類似..................................................58
3.5.3 漸變..................................................59
3.5.4 對比..................................................59
3.5.5 密集..................................................59
3.5.6 發(fā)射..................................................60
3.5.7 空間..................................................60
3.5.8 分割..................................................60
3.6 電商海報的排版技巧..........................60
3.6.1 對齊..................................................60
3.6.2 對比..................................................61
3.6.3 重復..................................................61
3.6.4 親密..................................................62
04 圖片處理的方法.............................63
4.1 幾種常見的產(chǎn)品摳圖方法...................64
4.1.1 婚紗人像的摳取................................64
實戰(zhàn)：用色彩范圍摳取人像...........................64
4.1.2 透明玻璃杯的摳取.............................66
實戰(zhàn)：用通道摳取透明玻璃杯.......................66
4.1.3 純色背景人像的摳取..........................68
實戰(zhàn)：用色彩范圍結合調(diào)整邊緣摳取人像......69
4.1.4 人物發(fā)絲的摳取.................................71
實戰(zhàn)：用多個命令與操作摳取發(fā)絲................71
4.1.5 火焰的摳取.......................................73
實戰(zhàn)：用色彩范圍結合混合模式摳取人像......73
4.2 如何去除/復制圖像元素......................76
4.2.1 用仿制圖章工具去除圖像...................76
實戰(zhàn)：去除圖片中多余的花朵.......................76
4.2.2 用修復畫筆工具去除圖像 ..................76
實戰(zhàn)：去除畫面中多余的帆船.......................76
4.2.3 利用修復畫筆工具復制圖像 ...............77
實戰(zhàn)：利用Alt鍵復制圖像.............................77
4.2.4 用消失點功能去除雜物.......................78
實戰(zhàn)：去除圖像中多余的樹葉.......................78
4.3 如何去除圖片中的水印.......................79
4.3.1 用修補工具去除水印..........................79
實戰(zhàn)：去除茶葉圖片中的水印.......................79
4.3.2 用矩形選框工具去除水印....................80
實戰(zhàn)：去除密碼箱產(chǎn)品圖中的水印................80
4.3.3 用借圖法去除水印..............................80
實戰(zhàn)：去除白色茶杯圖片中的水印................81
4.3.4 利用選區(qū)+色階+仿制圖章工具去除水印 81
實戰(zhàn)：去除挎包產(chǎn)品圖中的鏈接....................82
4.3.5 用內(nèi)容識別功能去除水印....................83
實戰(zhàn)：去除素材圖片中的水印.......................83
4.3.6 用魔棒工具去除水印..........................83
實戰(zhàn)：去除折扇產(chǎn)品圖中的水印....................83
4.4 用污點修復工具去除瑕疵...................84
實戰(zhàn)：修復人物臉部的瑕疵...........................84
4.5 如何完成人物的磨皮處理...................85
4.5.1 光滑磨皮...........................................85
實戰(zhàn)：人物臉部的光滑磨皮處理....................85
4.5.2 計算磨皮...........................................87
實戰(zhàn)：半身人像的濾鏡磨皮處理....................87
4.5.3 PortraitPlus一鍵磨皮.........................90
技術專題：PortraitPlus插件的下載與安裝......90
實戰(zhàn)：半身人像的潤色美白磨皮處理.............91
4.6 產(chǎn)品圖的調(diào)色處理和方法...................92
4.6.1 如何處理產(chǎn)品圖過曝問題...................92
實戰(zhàn)：女包產(chǎn)品圖的過曝問題處理................92
4.6.2 如何處理產(chǎn)品圖過暗..........................93
實戰(zhàn)：女包產(chǎn)品圖的過暗問題處理................93
4.6.3 如何給產(chǎn)品圖校色..............................94
實戰(zhàn)：蘋果產(chǎn)品圖的校色處理.......................94
4.6.4 如何給產(chǎn)品圖換色..............................96
實戰(zhàn)：女包產(chǎn)品圖的換色處理.......................96
4.6.5 不同風格的調(diào)色處理...........................97
實戰(zhàn)：唯美淡青色風格調(diào)色...........................97
實戰(zhàn)：懷舊復古風格調(diào)色..............................99
技術專題：相框效果的添加.........................103
實戰(zhàn)：日系淡色風格調(diào)色............................104
4.7 產(chǎn)品投影效果的制作........................108
4.7.1 接觸陰影的制作...............................108
實戰(zhàn)：男鞋產(chǎn)品圖的陰影繪制與表現(xiàn)...........108
4.7.2 柔和陰影的制作...............................109
實戰(zhàn)：茶杯產(chǎn)品圖的陰影繪制與表現(xiàn)............109
4.7.3 投射陰影的制作...............................110
實戰(zhàn)：頂光投射陰影效果的繪制與表現(xiàn)........110
實戰(zhàn)：側光投射陰影的繪制與表現(xiàn)..............110
4.7.4 產(chǎn)品倒影的制作...............................111
實戰(zhàn)：紙箱水平倒影的制作與表現(xiàn)..............112
4.8 產(chǎn)品批處理的方法...........................113
實戰(zhàn)：女鞋產(chǎn)品圖的批處理.........................114
4.9 綜合案例：鉆戒精修........................115
4.9.1 產(chǎn)品的結構分析...............................116
4.9.2 操作步驟.........................................116
技術專題：關于投影的另外一種制作方法.....122
4.10 綜合案例：面膜精修......................122
4.10.1 產(chǎn)品的結構分析.............................123
4.10.2 操作步驟.......................................123
05 字體的設計與排版........................131
5.1 概述...............................................132
5.2 字體的下載與安裝...........................132
5.3 電商字體的風格劃分........................133
5.3.1 秀麗柔美.........................................133
5.3.2 穩(wěn)重挺拔.........................................133
5.3.3 活潑有趣.........................................134
5.3.4 蒼勁古樸.........................................134
5.4 字體設計的原則與排版設計流程.......134
5.4.1 字體設計的原則...............................134
5.4.2 字體排版設計的基本流程..................134
5.5 毛筆字的制作與運用........................135
5.5.1 基本特點和使用途徑........................135
5.5.2 設計要點..........................................135
實戰(zhàn)：“開年大促”海報字體的制作...........136
5.6 3D字體的制作與運用........................141
5.6.1 基本特點和使用途徑........................141
5.6.2 設計要點..........................................141
實戰(zhàn)：“約惠情人節(jié)”海報字體的制作........141
06 淘寶店標的制作...........................147
6.1 什么是店標.....................................148
6.2 店標的制作格式與規(guī)范.....................148
6.3 靜態(tài)店標的制作...............................148
實戰(zhàn)：慕子小鋪靜態(tài)店標制作.....................148
6.4 動態(tài)店標的制作...............................150
實戰(zhàn)：慕子小鋪動態(tài)店標制作.....................150
07 產(chǎn)品主圖的設計與制作................153
7.1 什么是產(chǎn)品主圖..............................154
7.2 產(chǎn)品主圖設計的三要素.....................154
7.2.1 產(chǎn)品圖片.........................................154
7.2.2 文案................................................155
7.2.3 背景................................................155
7.3 常見的主圖排版結構方式.................156
7.4 產(chǎn)品主圖的五種展示角度.................156
7.5 創(chuàng)意主圖的制作...............................157
7.5.1 展示位置介紹..................................157
7.5.2 設計原則.........................................157
實戰(zhàn)：“電吹風”創(chuàng)意主圖的制作..............158
7.6 直通車主圖的制作...........................165
7.6.1 展示位置介紹..................................166
7.6.2 設計原則.........................................166
實戰(zhàn)：“水云凝晚霜”直通車主圖的制作....167
08 電商海報的設計與制作................175
8.1 什么是電商海報..............................176
8.2 全屏海報的制作...............................176
8.2.1 什么是全屏海報...............................176
8.2.2 全屏海報的設計意義.........................176
實戰(zhàn)：彩妝品牌的全屏海報制作..................176
8.3 促銷海報的制作...............................182
8.3.1 什么是促銷海報...............................182
8.3.2 促銷海報的設計意義........................182
實戰(zhàn)：運動鞋品牌的促銷海報制作..............182
09 店鋪首頁背景的制作、代碼安裝與發(fā)布....................................187
9.1 什么是店鋪首頁背景........................188
9.2 首頁移動背景的制作與安裝..............188
實戰(zhàn)：女鞋店鋪首頁移動背景的制作............188
9.3 首頁固定背景的制作與安裝..............191
實戰(zhàn)：女鞋店鋪首頁固定背景的制作...........191
10 寶貝詳情頁的制作、代碼安裝與發(fā)布..........................................195
10.1 什么是寶貝詳情頁.........................196
10.2 詳情頁的設計要點.........................197
10.3 詳情頁的結構拆分與說明...............198
10.4 寶貝詳情頁設計實戰(zhàn)解析...............198
10.4.1 寶貝詳情頁的尺寸規(guī)范..................198
10.4.2 “黃金前三屏3秒注意力”原則.......198
實戰(zhàn)：女鞋產(chǎn)品詳情頁的制作.....................199
11 優(yōu)惠券的設計、代碼安裝與發(fā)布..213
11.1 什么是優(yōu)惠券...............................214
11.2 優(yōu)惠券的設置與發(fā)布.....................214
11.2.1 訂購優(yōu)惠券流程............................214
11.2.2 創(chuàng)建店鋪優(yōu)惠券.............................215
11.2.3 創(chuàng)建商品優(yōu)惠券.............................216
11.2.4 創(chuàng)建包郵券...................................216
11.3 優(yōu)惠券的領取位置說明..................217
11.3.1 在店招上方位置領取.....................217
11.3.2 在旺旺對話框右側領取...................218
11.3.3 在寶貝詳情頁領取.........................218
11.3.4 在首頁領取...................................218
11.4 優(yōu)惠券的制作實戰(zhàn)解析..................218
實戰(zhàn)：制作一張女裝店鋪優(yōu)惠券..................218
12 客服中心欄的設計、代碼安裝與發(fā)布..........................................225
12.1 什么是客服中心欄.........................226
12.2 客服中心欄背景的制作...................226
實戰(zhàn)：用Photoshop制作客服中心欄背景.......226
實戰(zhàn)：用Dreamweaver制作客服中心欄背景...228
12.3 如何在Dreamweaver中添加旺旺代碼229
12.4 如何在Dreamweaver中添加旺旺頭像229
12.5 如何將旺旺客服代碼安裝到店鋪.....230
13 頁尾圖的設計、代碼安裝與發(fā)布..231
13.1 什么是頁尾圖...............................232
13.2 頁尾圖的制作實戰(zhàn)解析...................232
實戰(zhàn)：女鞋店鋪頁尾圖的設計、代碼安裝與發(fā)布.............................................232
14 淘寶官方視頻的制作、訂購、上傳與發(fā)布...................................239
14.1 什么是淘寶官方視頻.....................240
14.2 淘寶官方視頻的制作......................240
14.3 關于“淘寶官方無線視頻”的訂購..241
14.3.1 “無線視頻”功能對于商家的劃分..241
14.3.2 無線視頻的訂購流程......................241
14.4 視頻的上傳與發(fā)布方法..................242
14.4.1 將視頻發(fā)布到手機淘寶首頁............242
14.4.2 將視頻發(fā)布到微淘.........................244
14.4.3 將詳情頁視頻發(fā)布到手機淘寶首頁..246
15 手機淘寶店鋪的設計、代碼安裝與發(fā)布...................................249
15.1 裝修后臺的位置說明.....................250
15.2 裝修后臺的模塊組成與介紹............250
15.3 綜合案例：手機淘寶女鞋店鋪的首頁裝修與發(fā)布.............................251
15.3.1 店招圖片的制作、安裝與發(fā)布........251
15.3.2 輪播圖的制作、安裝與發(fā)布............254
15.3.3 雙列分類圖片模塊的制作與安裝......256
15.3.4 自定義區(qū)模塊的制作、切片與安裝..260
15.3.5 優(yōu)惠券模塊的制作與安裝................266
15.3.6 頁尾圖的制作、安裝與發(fā)布............269
15.3.7 保存、發(fā)布與備份..........................271
新書資訊