網(wǎng)店視覺營銷與美工設計從入門到精通

目錄
前言
如何獲取云空間資料
第1部分 設計之道—理解視覺營銷
第1章 視覺營銷必知精髓
1.1 走進視覺營銷
1.1.1 視覺營銷的基本概念 2
1.1.2 視覺營銷的運作流程 3
1.1.3 視覺營銷的原則 3
1.2 衡量視覺營銷成敗的三大數(shù)據(jù)指標
1.2.1 決定銷量高低的基礎—流量 4
1.2.2 彰顯電商成交的關鍵數(shù)據(jù)—轉化率 6
1.2.3 體現(xiàn)商品屬性和消費者屬性—客單價 7
1.3 視覺營銷的四個關鍵點
1.3.1 “視”的關鍵：打造注意力 8
1.3.2 “覺”的關鍵：喚醒記憶力 9
1.3.3 “營”的關鍵：營造好感度 9
1.3.4 “銷”的關鍵：激發(fā)想象力 11
第2章 視覺營銷的表現(xiàn)形式
2.1 定義店鋪的品牌風格
2.1.1 便于識別的店鋪專屬VI 13
2.1.2 色彩與風格的完美搭配 15
2.1.3 商品圖片的視覺統(tǒng)一化處理 17
2.2 用圖片和文字提升閱讀體驗
2.2.1 店鋪首頁的布局優(yōu)化 19
2.2.2 商品詳情頁面的內容安排 20
2.2.3 網(wǎng)店商品文案的撰寫 21
2.3 對店鋪進行全方位包裝和宣傳
2.3.1 促銷活動的策劃與實施技巧 23
2.3.2 商品分類要充分考慮商品屬性與消費者習慣 24
2.3.3 利用輔助信息提升購物體驗 25
第3章 商品攝影入門與進階
3.1 拍出符合網(wǎng)店裝修需要的照片
3.1.1 設置合適的照片格式 28
3.1.2 具備真實色彩的照片風格 29
3.1.3 從不同視角全方位展現(xiàn)商品 31
3.2 準確對焦拍出清晰照片
3.2.1 廣泛應用的單次自動對焦 32
3.2.2 適合拍攝體積較小商品的手動對焦 32
3.3 正確曝光獲得理想畫面
3.3.1 影響畫面清晰范圍的光圈 33
3.3.2 避免畫面模糊的安全快門 34
3.3.3 盡量使用低感光度 35
3.3.4 簡單易用的曝光補償 36
3.4 商品拍攝進階技巧
3.4.1 商品的擺放 37
3.4.2 點綴元素提升商品的檔次 38
3.4.3 表現(xiàn)整體外觀的拍攝技巧 39
3.4.4 表現(xiàn)細節(jié)的拍攝技巧 41
第4章 視覺營銷常用工具
4.1 獲取滿意的配色方案
4.1.1 配色軟件ColorSchemer Studio 43
4.1.2 基于網(wǎng)頁的配色工具Adobe Color CC 45
4.1.3 配色網(wǎng) 48
4.2 實用的網(wǎng)店裝修輔助工具
4.2.1 美圖秀秀 49
4.2.2 淘寶裝修助手 50
4.2.3 淘美網(wǎng)店裝修助手 51
4.2.4 淘幫手 52
第2部分 核心技法—Photoshop設計必知
第5章 裁圖與摳圖
5.1 調整照片質量
5.1.1 改變商品照片的尺寸 54
5.1.2 更改商品照片的分辨率 55
5.1.3 巧用“另存為”命令減小文件占用空間 56
5.2 裁剪圖像
5.2.1 對商品照片進行重新構圖 57
5.2.2 拉直水平線讓商品端正展示 58
5.3 摳取圖像
5.3.1 純色背景的摳取 59
5.3.2 外形規(guī)則商品的摳取 60
5.3.3 外形不規(guī)則商品的摳取 61
5.3.4 精細摳取商品 63
5.3.5 半透明商品的摳取 64
5.3.6 特定顏色的摳取 65
5.3.7 選區(qū)邊緣的處理 66
第6章 調色與精修
6.1 商品照片的色彩調整
6.1.1 恢復商品的真實色彩 68
6.1.2 讓商品照片擺脫“灰色陰影” 69
6.1.3 突出玻璃制品晶瑩剔透質感的調色技巧 70
6.1.4 調出炫目的金屬色 71
6.1.5 增強商品溫暖感的調色方法 72
6.1.6 提升商品照片色調的厚重感 73
6.2 商品照片的精細修飾
6.2.1 去掉用于懸掛商品的掛鉤 75
6.2.2 清除攝影棚的痕跡 76
6.2.3 消除模特身上的瑕疵 77
6.2.4 去除背景板上的瑕疵 79
6.2.5 清除商品上的毛發(fā)、灰塵 80
6.2.6 去除商品包裝上的瑕疵 81
6.2.7 修補商品表面的缺陷 82
第 7章 文字編排與圖形繪制
7.1 文字的編排
7.1.1 字體與店鋪風格的完美搭配攻略 85
7.1.2 文字的添加與設置 86
7.1.3 文字的藝術化編排 88
7.1.4 變形文字的制作 89
7.2 修飾圖形的繪制
7.2.1 修飾圖形與視覺營銷之間的關系 91
7.2.2 繪制規(guī)則形狀的修飾圖形 91
7.2.3 添加自定義形狀讓畫面內容更豐富 93
7.2.4 隨心所欲繪制所需的修飾圖形 94
第 8章 合成與特效
8.1圖像合成
8.1.1 制作白底效果的商品圖 97
8.1.2 合成材質圖像讓商品更顯檔次 98
8.1.3 合成裝飾元素讓畫面更豐富 99
8.1.4 添加半透明水印的技巧 100
8.1.5 添加顏色邊框的三種方法 101
8.2 特效制作
8.2.1 簡單幾步打造手繪設計圖 103
8.2.2 構建景深突出商品形象 105
8.2.3 讓商品照片細節(jié)變清晰的三種方法 106
8.2.4 制作商品剪影 108
8.3 圖層樣式
8.3.1 更改設計元素的填充和描邊樣式 109
8.3.2 讓設計元素更立體的樣式 111
8.3.3 發(fā)光樣式在店鋪裝修中的應用 113
第3部分 實戰(zhàn)之道—案例解析
第9章 網(wǎng)店首頁各元素設計
9.1 店招與導航條
9.1.1 店招與導航條的設計規(guī)范 115
9.1.2 店招中店鋪名稱的藝術化處理 116
9.1.3 圖層樣式在導航條制作中的應用 117
9.1.4 店招與導航條設計案例01 117
9.1.5 店招與導航條設計案例02 121
9.2 歡迎模塊與輪播圖
9.2.1 歡迎模塊與輪播圖的設計規(guī)范 126
9.2.2 三大元素構建完美設計圖 127
9.2.3 溶圖在歡迎模塊中的應用 128
9.2.4 歡迎模塊設計案例01 128
9.2.5 歡迎模塊設計案例02 133
9.3 商品陳列區(qū)
9.3.1 商品陳列區(qū)的設計規(guī)范 136
9.3.2 商品陳列區(qū)的布局方式 137
9.3.3 商品陳列區(qū)設計案例01 138
9.3.4 商品陳列區(qū)設計案例02 144
9.4 客服區(qū)與店鋪收藏區(qū)
9.4.1 客服區(qū)與店鋪收藏區(qū)的設計規(guī)范 148
9.4.2 聊天軟件頭像的多種創(chuàng)意表現(xiàn) 149
9.4.3 客服區(qū)與店鋪收藏區(qū)設計案例01 149
9.4.4 客服區(qū)與店鋪收藏區(qū)設計案例02 154
第10章 網(wǎng)店首頁整體打造
10.1 化妝品店鋪首頁裝修設計
10.1.1 框架設計 159
10.1.2 風格定位 160
10.1.3 配色方案 161
10.1.4 步驟詳解 162
10.1.5 案例擴展 170
10.2 家具店鋪首頁裝修設計
10.2.1 框架設計 171
10.2.2 風格定位 172
10.2.3 配色方案 173
10.2.4 步驟詳解 174
10.2.5 案例擴展 181
10.3 婚慶商品店鋪首頁裝修設計
10.3.1 框架設計 182
10.3.2 風格定位 183
10.3.3 配色方案 184
10.3.4 步驟詳解 185
10.3.5 案例擴展 193
第11章 商品詳情頁面各元素設計
11.1 商品主圖
11.1.1 商品主圖的設計規(guī)范 195
11.1.2 添加輔助文案提高商品主圖點擊率 196
11.1.3 商品主圖設計案例01 197
11.1.4 商品主圖設計案例02 201
11.2 商品搭配專區(qū)
11.2.1 商品搭配專區(qū)的兩種表現(xiàn)方式 205
11.2.2 指示性符號在商品搭配專區(qū)中的妙用 206
11.2.3 商品搭配專區(qū)設計案例01 207
11.2.4 商品搭配專區(qū)設計案例02 211
11.3 商品細節(jié)展示區(qū)
11.3.1 商品細節(jié)展示區(qū)的表現(xiàn)方式 217
11.3.2 文字與素材在商品細節(jié)展示區(qū)中的作用 218
11.3.3 商品細節(jié)展示區(qū)設計案例01 220
11.3.4 商品細節(jié)展示區(qū)設計案例02 225
11.4 商品功效簡介區(qū)
11.4.1 商品功效簡介區(qū)的設計規(guī)范 230
11.4.2 修飾元素讓商品功效簡介區(qū)表現(xiàn)更生動 230
11.4.3 商品功效簡介區(qū)設計案例01 232
11.4.4 商品功效簡介區(qū)設計案例02 236
11.5 其他輔助信息
11.5.1 信息視圖在流程圖設計中的應用 242
11.5.2 利用品牌和公司簡介提升店鋪專業(yè)形象 243
11.5.3 溫馨提示設計案例 244
11.5.4 購物須知設計案例 247
11.5.5 售后承諾設計案例 251
11.5.6 品牌簡介設計案例 255
第12章 商品詳情頁面整體打造
12.1 運動鞋詳情頁面裝修設計
12.1.1 框架設計 259
12.1.2 風格定位 260
12.1.3 配色方案 261
12.1.4 步驟詳解 262
12.1.5 案例擴展 271
12.2 眼鏡框詳情頁面裝修設計
12.2.1 框架設計 272
12.2.2 風格定位 273
12.2.3 配色方案 274
12.2.4 步驟詳解 275
12.2.5 案例擴展 281
12.3 茶具套裝詳情頁面裝修設計
12.3.1 框架設計 282
12.3.2 風格定位 283
12.3.3 配色方案 284
12.3.4 步驟詳解 285
12.3.5 案例擴展 291
第4部分 高手之道—裝修進階
第13章 網(wǎng)頁制作入門與進階
13.1 設計圖的切片與優(yōu)化
13.1.1 按功能對設計圖進行切片 293
13.1.2 優(yōu)化切片提升瀏覽體驗 294
13.2 網(wǎng)頁制作入門
13.2.1 利用表格展示商品詳情信息 295
13.2.2 在頁面中插入圖片 298
13.2.3 利用表格實現(xiàn)圖文混排 299
13.2.4 制作鏈接代碼 301
13.3 網(wǎng)頁制作進階
13.3.1 制作輪播圖代碼 302
13.3.2 制作客服區(qū)代碼 303
13.3.3 制作店鋪收藏區(qū)代碼 305
13.3.4 制作歡迎模塊代碼 306
13.3.5 在店鋪頁面中添加視頻 309