電商視覺營銷設(shè)計必修課（Photoshop版）

第 1 章  電商設(shè)計師的4項常識  1
1.1 走近電商設(shè)計師     2
1.1.1 電商設(shè)計師的主要職責   2
1.1.2 電商設(shè)計師的薪資待遇   2
1.1.3 電商設(shè)計師的市場需求   3
1.1.4 電商設(shè)計師的“薪”動向    3
1.2 電商設(shè)計師應(yīng)該知曉的設(shè)計常識   4
1.2.1 對電商商品主圖需要知道的5件事    4
1.2.2 手機移動端的店鋪商品展示設(shè)計要求  5
1.2.3 做好電商設(shè)計師必須知曉的8個概念  6
1.2.4 電商設(shè)計的正確流程您必須知曉  7
1.2.5 微商城視覺設(shè)計的4個特點   7
1.2.6 微信視覺推廣設(shè)計的注意事項    8
1.3 電商視覺營銷設(shè)計需要掌握的6項主要技能      9
1.3.1 素材整理與搜集   9
1.3.2 熟練掌握流行的設(shè)計工具   11
1.3.3 掌握創(chuàng)造分享話題的5個基本技巧  12
1.3.4 了解一些營銷的常識  12
1.3.5 了解一些常用的互聯(lián)網(wǎng)常識   12
1.3.6 了解一些構(gòu)圖的常識  13
第 2 章  電商視覺營銷設(shè)計的基礎(chǔ)：構(gòu)圖         14
2.1 電商視覺營銷設(shè)計中的構(gòu)圖   15
2.1.1 8種常規(guī)的構(gòu)圖方式   15
2.1.2 異形構(gòu)圖方式    18
2.1.3 電商視覺營銷設(shè)計：設(shè)計思維拓展  18
2.2 掌握電商視覺營銷設(shè)計的5個構(gòu)圖技巧   20
2.3 掌握電商視覺營銷設(shè)計的核心：優(yōu)秀的版式會說話    23
2.3.1 電商視覺營銷設(shè)計中的點、線、面  23
2.3.2 點的張力     24
2.3.3 線的自如     24
2.3.4 面的整體感   25
2.4 構(gòu)圖與瀏覽體驗    25
第 3 章  電商設(shè)計師要學會“約會”素材         27
3.1 好素材需要自己行動  28
3.1.1 圖片質(zhì)量高的網(wǎng)站    28
3.1.2 設(shè)計技巧分享：好圖像引導(dǎo)好流量  28
3.1.3 如何使用圖片搜索引擎     28
3.1.4 好圖像也需要好標題  29
3.2 “約會”素材，必須掌握4種摳圖技巧   30
3.2.1 用好磁性套索工具精細化摳取單色背景的圖像  30
3.2.2 借助鋼筆工具實現(xiàn)精準化摳圖   30
3.2.3 通道摳圖法   32
3.2.4 使用其他插件摳圖    33
3.3 “贏銷”：電商視覺營銷設(shè)計技巧    34
3.3.1 用談戀愛的心態(tài)才能做“好”設(shè)計  34
3.3.2 做“好”視覺營銷，創(chuàng)造視覺焦點很關(guān)鍵   36
3.3.3 從視覺營銷設(shè)計的角度理解微信公眾號   37
第4章  電商視覺營銷設(shè)計中的圖像美化         39
4.1 電商視覺營銷設(shè)計常用的圖片尺寸   40
4.4.1 淘寶與天貓平臺的常用設(shè)計尺寸    40
4.4.2 平臺的常用設(shè)計尺寸   41
4.4.3 蘇寧易購平臺的常用設(shè)計尺寸   41
4.4.4 移動無線端常用設(shè)計尺寸   42
4.2 素材圖像的色調(diào)調(diào)整  43
4.2.1 快速選擇圖像的高光與陰影   43
4.2.2 圖像色調(diào)調(diào)整的利器：巧妙改善產(chǎn)品的明度    45
4.2.3 無損化調(diào)整圖像的色調(diào)：智能對象與智能濾鏡  46
4.3 素材圖像的色彩調(diào)整  47
4.3.1 對某一種具體顏色的調(diào)控技巧   47
4.3.2 調(diào)整好圖像的明度，讓產(chǎn)品顯得更通透   48
4.3.3 調(diào)整圖像的局部色彩，讓對比更強烈     49
4.3.4 對產(chǎn)品圖像整體色彩的調(diào)控技巧    50
4.3.5 校正圖像的偏色，讓圖像更真實  51
4.3.6 產(chǎn)品圖像：不可或缺的銳化   52
4.3.7 打造誘人的產(chǎn)品主圖像：瑕疵修復(fù)  53
4.4 電商視覺營銷設(shè)計技巧提煉   55
4.4.1 把握消費者的心理    56
4.4.2 提升點擊率的4種技巧     56
4.4.3 設(shè)計的關(guān)鍵詞，您確定好了嗎   57
4.4.4 選圖片，就是選美女  58
4.5 手機端視覺營銷設(shè)計的4個關(guān)鍵點     58
4.5.1 視覺設(shè)計一定要專注  58
4.5.2 版面布局一定要合理  59
4.5.3 圖像的優(yōu)化一定要合理     59
4.5.4 主圖設(shè)計的2個關(guān)鍵點要知曉   60
4.6 主圖設(shè)計案例分享    61
4.6.1 化妝品主圖設(shè)計  61
4.6.2 護眼燈促銷主圖設(shè)計  63
4.6.3 生鮮產(chǎn)品主圖設(shè)計    65
4.6.4 農(nóng)特水果產(chǎn)品主圖設(shè)計     67
第5章  沒時間調(diào)整圖像，就讓圖形和文字做主吧      69
5.1 策劃電商“贏銷”文案     70
5.2 設(shè)計“贏銷”文案    71
5.2.1 電商設(shè)計師需知道，文案創(chuàng)意的4個要點   71
5.2.2 電商設(shè)計師需知道，英文會讓設(shè)計變得“高大上”  72
5.2.3 電商設(shè)計師需知道，設(shè)計精確的數(shù)據(jù)更具吸引力  72
5.2.4 好字體，我們約會吧  73
5.2.5 手機移動端文案設(shè)計的4個要點  73
5.3 案例與技巧分享：網(wǎng)店文案，應(yīng)該這樣寫   75
5.4 技能提升：為形狀點贊     76
5.4.1 技能提升：濫用形狀的5宗罪   76
5.4.2 技能提升：形狀美化的6個技巧  77
5.4.3 技能提升：如何畫出曲線圖形   80
5.4.4 技能提升：形狀組合的應(yīng)用   82
5.5 形狀案例設(shè)計與技巧分享     84
5.5.1 分享：淘寶產(chǎn)品海報設(shè)計案例   84
5.5.2 分享：天貓品牌海報設(shè)計案例   87
5.5.3 分享：平臺促銷海報設(shè)計案例  90
5.5.4 分享：微店產(chǎn)品海報設(shè)計案例   92
5.5.5 分享：微信推廣海報設(shè)計案例   96
5.6 “贏銷”：電商視覺營銷設(shè)計技巧提煉  98
5.6.1 技巧提煉：用好圖形，讓信息展現(xiàn)更直觀   98
5.6.2 技巧提煉：用好圖形，讓“贏銷”重點更突出   99
5.6.3 技巧提煉：用好圖形，讓頁面裝飾更簡練   99
5.6.4 技巧提煉：用好形狀，讓頁面更具營銷力     100
第6章  “好色”才能“贏銷”   102
6.1 電商視覺營銷設(shè)計: 再談色彩的3個基本屬性    103
6.1.1 再談色彩的明度   103
6.1.2 再談色彩的飽和度   104
6.1.3 再談色彩的色相   104
6.2 電商設(shè)計的配色技巧   107
6.2.1 懶一點，就用單色   107
6.2.2 巧用產(chǎn)品或模特的顏色    107
6.2.3 儲備兩個常用的配色網(wǎng)站  108
6.3 電商設(shè)計中煉就“好色”的4種吸色大法    108
6.3.1 三角形配色法   108
6.3.2 “互補 類似”式配色法  109
6.3.3 四邊形配色法   109
6.3.4 4種常用的色彩調(diào)和配色法     109
6.3.5 “偷學”大賣家的配色技巧    111
6.4 設(shè)計案例分享     112
6.4.1 色彩應(yīng)用案例：電商收藏區(qū)設(shè)計   112
6.4.2 色彩應(yīng)用案例：電商客服區(qū)設(shè)計   113
6.4.3 色彩應(yīng)用案例：售后服務(wù)保障卡設(shè)計    115
6.4.4 色彩應(yīng)用案例：微商產(chǎn)品官網(wǎng)設(shè)計  117
第7章  店招        123
7.1 認識店招    124
7.1.1 記憶品牌    124
7.1.2 店招設(shè)計要注意的基本要求    124
7.1.3 從瀏覽者角度設(shè)計店招    124
7.1.4 店招設(shè)計需要掌握的技巧  124
7.2 設(shè)計案例分享     125
7.2.1 品牌特色鮮明的農(nóng)特產(chǎn)品店招設(shè)計  125
7.2.2 高品質(zhì)品牌男裝店鋪的店招設(shè)計   127
7.2.3 借用“點”的魅力設(shè)計男鞋店鋪的店招     131
7.2.4 凸顯店鋪主題的女鞋店招設(shè)計    132
7.2.5 色彩與活動主題呼應(yīng)的衛(wèi)浴店招設(shè)計    134
7.2.6 突出促銷功能的包包店招設(shè)計    136
第8章  電商海報       139
8.1 電商海報設(shè)計的3個關(guān)鍵點    140
8.1.1 提煉產(chǎn)品的賣點   140
8.1.2 給瀏覽者的點擊理由是充分的  140
8.1.3 規(guī)劃營銷信息的層次   141
8.2 “贏銷”：電商設(shè)計師要洞察一切   142
8.2.1 電商設(shè)計師要知曉瀏覽者的心理   142
8.2.2 電商設(shè)計師要注意行業(yè)表達的特征  142
8.3 “贏銷”：電商視覺營銷設(shè)計中商品放置的4個奧秘    143
8.3.1 “贏銷”就要用好三角形  143
8.3.2 “贏銷”就要注意環(huán)繞和飄舞  144
8.3.3 “贏銷”就要用好視覺容器    144
8.3.4 “贏銷”就要注意用戶的瀏覽視線  145
8.4 設(shè)計案例分享     145
8.4.1 案例：淘寶店家用電器海報設(shè)計   145
8.4.2 案例：天貓網(wǎng)店數(shù)碼海報設(shè)計   149
8.4.3 案例：商城化妝品海報設(shè)計   152
8.4.4 案例：商城家用電器海報設(shè)計  154
8.4.5 案例：蘇寧易購超市海報設(shè)計   156
8.4.6 案例：唯品會產(chǎn)品海報設(shè)計    159
8.4.7 案例：手機店鋪的海報設(shè)計    161
第9章  首頁焦點輪播廣告    164
9.1 焦點輪播廣告設(shè)計常見的4個誤區(qū)    165
9.2 “贏銷”：焦點海報視覺設(shè)計技巧提煉  166
9.3 做好焦點海報設(shè)計的4個維度   167
9.4 設(shè)計案例解析     170
9.4.1 焦點輪播海報設(shè)計：PC端焦點輪播廣告設(shè)計   170
9.4.2 焦點輪播海報：首頁形象廣告設(shè)計   172
9.4.3 焦點輪播海報設(shè)計：促銷為主的首屏焦點海報   176
9.4.4 焦點輪播海報設(shè)計：做好構(gòu)圖用好素材    181
9.4.5 焦點輪播海報設(shè)計：用好光影對比   183
第10章  網(wǎng)店首頁設(shè)計     188
10.1 創(chuàng)造瀏覽者的眼印象   189
10.1.1 設(shè)計“情調(diào)”，提升購物的欲望     189
10.1.2 導(dǎo)航設(shè)計，給出消費的原因    190
10.1.3 作為設(shè)計師，應(yīng)該知曉3種常見的店鋪布局    191
10.1.4 首屏設(shè)計的5種類型很重要    191
10.2 恰當分割頁面的5個區(qū)域  193
10.2.1 頂部形象區(qū)    193
10.2.2 首屏吸引區(qū)    193
10.2.3 營造氛圍的促銷區(qū)  194
10.2.4 建立情感的交互區(qū)  195
10.2.5 不可忽略的頁腳區(qū)  195
10.3 素材圖像管理的3個技巧  195
10.3.1 制定素材圖像設(shè)計的標準   195
10.3.2 素材的管理    196
10.3.3 邊框的添加    197
10.4 實戰(zhàn)：女鞋店面設(shè)計案例   198
10.4.1 店鋪的店招設(shè)計    198
10.4.2 店鋪的導(dǎo)航設(shè)計    199
10.4.3 主體促銷海報設(shè)計  199
10.4.4 熱賣專區(qū)設(shè)計  201
10.4.5 特色產(chǎn)品區(qū)的設(shè)計  204
10.4.6 別致蕾絲&長鞋區(qū)的設(shè)計   208
10.4.7 店鋪的頁腳設(shè)計    208
第11章  電商詳情頁設(shè)計     209
11.1 詳情頁營銷要素解析     210
11.1.1 引發(fā)興趣   210
11.1.2 激發(fā)需求   211
11.1.3 產(chǎn)生信賴和記憶    211
11.1.4 夢想擁有   212
11.1.5 做出決定   212
11.2 細節(jié)頁設(shè)計的3個關(guān)鍵點  213
11.3 詳情頁設(shè)計案例分享     214
11.3.1 詳情頁設(shè)計：基本信息區(qū)域設(shè)計   214
11.3.2 詳情頁設(shè)計：賣點解析   216
11.3.3 詳情頁設(shè)計：產(chǎn)品主要賣點展示   219
11.3.4 詳情頁設(shè)計：設(shè)計手稿   220
11.3.5 詳情頁設(shè)計：產(chǎn)品展示部分的設(shè)計     222
11.3.6 詳情頁設(shè)計：模特試穿   222
11.3.7 詳情頁設(shè)計：產(chǎn)品參數(shù)及細節(jié)展示   223
11.3.8 詳情頁設(shè)計：尺碼設(shè)計   224
11.3.9 詳情頁設(shè)計：關(guān)聯(lián)商品區(qū)域的設(shè)計     224
11.4 手機端設(shè)計案例分享     224
11.4.1 詳情頁設(shè)計案例：搭建頁面結(jié)構(gòu)   224
11.4.2 詳情頁設(shè)計案例：設(shè)計黏住用戶的海報圖  225
11.4.3 詳情頁設(shè)計案例：品牌介紹強化特色   227
11.4.4 詳情頁設(shè)計案例：賣點要體現(xiàn)產(chǎn)品的差異化    228
11.4.5 詳情頁設(shè)計案例：產(chǎn)品信息與產(chǎn)品展示設(shè)計    230
第12章  電商專題頁設(shè)計     232
12.1 解析電商專題頁面策劃的4個要點   233
12.2 營銷要素解析    233
12.3 案例設(shè)計全程：商城店鋪專題頁  234
12.3.1 總體布局規(guī)劃  234
12.3.2 專題頁的頁面背景設(shè)計過程分享   235
12.3.3 專題頁歡迎區(qū)設(shè)計過程分享   236
12.3.4 促銷優(yōu)惠區(qū)設(shè)計過程分享   241
12.3.5 廣告商品區(qū)設(shè)計過程分享   242
12.4 天貓手機端無線商城的專題頁面設(shè)計  245
12.4.1 總體布局規(guī)劃  245
12.4.2 無線端的頁面布局與背景設(shè)計分享   245
12.4.3 專題頁面的店招與焦點海報的設(shè)計分享   246
12.4.4 廣告產(chǎn)品區(qū)效果的制作分享   249
12.5 案例：微信O2O新年專題海報   250