第 1章 聊聊電商圈001
1.1 認(rèn)識(shí)電商設(shè)計(jì) 004
1.1.1 電商設(shè)計(jì)3階段 004
1.1.2 設(shè)計(jì)師的職業(yè)類型 008
1.1.3 運(yùn)營(yíng)設(shè)計(jì)師的分類 011
1.1.4 運(yùn)營(yíng)設(shè)計(jì)師的工作內(nèi)容 012
1.1.5 運(yùn)營(yíng)設(shè)計(jì)師的技能需求 014
1.2 生存之道 023
1.2.1 我的12年 023
1.2.2 給新人的4點(diǎn)建議 025
1.3 漫談未來(lái) 028
1.3.1 人工智能 028
1.3.2 VR AR MR 029
1.4 本章小結(jié) 032

第 2章 別急著動(dòng)手，思考很重要 033
2.1 持續(xù)積累 036
2.1.1 網(wǎng)站推薦 036
2.1.2 整理參考 038
2.1.3 借鑒之道 040
2.2 了解需求 044
2.2.1 服務(wù)對(duì)象 044
2.2.2 品牌調(diào)性 044
2.2.3 目標(biāo)用戶 045
2.2.4 商業(yè)目的 046
2.2.5 展示情況 046
2.2.6 文案內(nèi)容 049
2.3 挖掘訴求點(diǎn) 050
2.3.1 產(chǎn)品利益點(diǎn) 051
2.3.2 用戶情感 052
2.3.3 品牌調(diào)性 054
2.4 推導(dǎo)核心概念 055
2.5 構(gòu)思創(chuàng)意表現(xiàn)形式 057
2.5.1 夸張 058
2.5.2 比喻 059
2.5.3 擬人 060
2.5.4 對(duì)比 060
2.5.5 視角 061
2.5.6 故事化 062
2.5.7 氛圍渲染 063
2.6 本章小結(jié) 065

第3章 設(shè)計(jì)風(fēng)格和視覺元素 067
3.1 簡(jiǎn)述平面設(shè)計(jì)發(fā)展史 070
3.1.1 工業(yè)革命時(shí)期 070
3.1.2 現(xiàn)代主義設(shè)計(jì) 072
3.1.3 后現(xiàn)代主義設(shè)計(jì) 075
3.2 電商設(shè)計(jì)的風(fēng)格演變 076
3.2.1 UI設(shè)計(jì)風(fēng)格 077
3.2.2 專題頁(yè)設(shè)計(jì)風(fēng)格 078
3.3 藝術(shù)風(fēng)格分類 079
3.3.1 中國(guó)風(fēng) 079
3.3.2 復(fù)古風(fēng) 080
3.3.3 極簡(jiǎn)風(fēng) 082
3.3.4 后現(xiàn)代設(shè)計(jì)風(fēng)格 083
3.3.5 扁平插畫風(fēng) 087
3.3.6 擬物寫實(shí)風(fēng) 088
3.3.7 紙雕風(fēng) 089
3.3.8 霓虹風(fēng) 089
3.3.9 2.5D風(fēng)格 090
3.3.10 三維純色風(fēng) 091
3.4 主題風(fēng)格分類 092
3.4.1 熱鬧促銷 092
3.4.2 時(shí)尚潮流 092
3.4.3 活潑可愛 093
3.4.4 甜美溫馨 094
3.4.5 文藝清新 094
3.4.6 大氣簡(jiǎn)約 094
3.4.7 未來(lái)科技 095
3.4.8 動(dòng)感活力 096
3.5 塑造合適元素，將風(fēng)格融入設(shè)計(jì) 097
3.5.1 元素的塑造原則 098
3.5.2 元素的設(shè)計(jì)誤區(qū) 104
3.5.3 元素的符號(hào)化表達(dá) 107
3.6 本章小結(jié) 112

第4章 Banner的版面布局 113
4.1 初識(shí)手機(jī)Banner 116
4.1.1 常見分類 116
4.1.2 常見比例 121
4.1.3 前期準(zhǔn)備 125
4.2 布局類型 128
4.2.1 上下布局 129
4.2.2 左右布局 130
4.2.3 上中下布局 132
4.2.4 左中右布局 133
4.2.5 包圍布局 134
4.2.6 十字布局 135
實(shí)戰(zhàn)案例 139
4.3 布局原則均衡布局 140
4.3.1 對(duì)稱均衡 141
4.3.2 非對(duì)稱均衡 144
4.4 布局原則突出重點(diǎn) 150
4.4.1 主體元素 152
4.4.2 文案 153
4.4.3 按鈕 155
實(shí)戰(zhàn)案例 157
4.5 本章小結(jié) 158

第5章 6招提升形式感 159
5.1 第 1招：圖形分割 162
5.1.1 橫 豎線分割 167
5.1.2 斜線分割 170
5.1.3 三角形分割 173
5.1.4 圓形分割 178
5.1.5 方形分割 181
5.1.6 異形分割 189
5.1.7 放射分割 192
實(shí)戰(zhàn)案例 196
5.2 第 2招：簡(jiǎn)約背景 201
5.2.1 單色背景 201
5.2.2 漸變背景 202
5.2.3 底紋背景 207
實(shí)戰(zhàn)案例 210
5.3 第3招：放大核心點(diǎn) 212
5.3.1 放大標(biāo)題 212
5.3.2 放大宣傳點(diǎn) 214
5.3.3 放大主體元素 216
實(shí)戰(zhàn)案例 219
5.4 第4招：使用攝影圖片 222
5.4.1 直接使用 224
5.4.2 后期處理 224
實(shí)戰(zhàn)案例 227
5.5 第5招：空間陳列 229
5.5.1 焦點(diǎn)透視 230
5.5.2 陳列場(chǎng)景 252
實(shí)戰(zhàn)案例 263
5.6 第6招：創(chuàng)意場(chǎng)景 269
5.6.1 確定創(chuàng)意和風(fēng)格 271
5.6.2 畫草圖、定配色 271
5.6.3 場(chǎng)景搭建 272
5.6.4 添加光影 274
實(shí)戰(zhàn)案例 276
5.7 本章小結(jié) 278

第6章 移動(dòng)時(shí)代，色彩為王 281
6.1 色彩知多少 284
6.1.1 色彩形成 284
6.1.2 色彩分類 288
6.1.3 色彩三要素 289
6.2 12色相環(huán) 292
6.2.1 同類色搭配 294
6.2.2 鄰近色搭配 298
6.2.3 類似色搭配 302
6.2.4 中差色搭配 307
6.2.5 對(duì)比色搭配 312
6.2.6 互補(bǔ)色搭配 316
6.3 PCCS色彩體系 318
6.3.1 純色調(diào) 321
6.3.2 淺色調(diào) 322
6.3.3 淡色調(diào) 322
6.3.4 深色調(diào) 323
6.3.5 暗色調(diào) 324
6.3.6 淺灰色調(diào) 325
6.3.7 濁色調(diào) 326
6.3.8 特殊色調(diào) 327
6.4 配色方法 329
6.4.1 理論配色法 330
實(shí)戰(zhàn)案例 331
6.4.2 主體配色法 333
實(shí)戰(zhàn)案例 338
6.4.3 借鑒配色法 339
實(shí)戰(zhàn)案例 342
6.5 配色原則 345
6.5.1 與設(shè)計(jì)風(fēng)格匹配 345
6.5.2 主輔色有對(duì)比 346
6.5.3 數(shù)量要合適 352
6.6 本章小結(jié) 354

第7章 電商設(shè)計(jì)常用色 355
7.1 紅色 358
7.1.1 純紅色 358
7.1.2 粉紅色 362
7.1.3 深紅色 366
實(shí)戰(zhàn)案例 369
7.2 黃色 372
7.2.1 純黃色 372
7.2.2 淺黃色 376
7.2.3 褐色 378
實(shí)戰(zhàn)案例 380
7.3 綠色 383
7.3.1 純綠色 384
7.3.2 淺綠色 385
7.3.3 深綠色 387
實(shí)戰(zhàn)案例 390
7.4 藍(lán)色 393
7.4.1 純藍(lán)色 394
7.4.2 淺藍(lán)色 397
7.4.3 深藍(lán)色 400
實(shí)戰(zhàn)案例 402
7.5 紫色 405
7.5.1 純紫色 405
7.5.2 淺紫色 407
7.5.3 深紫色 409
實(shí)戰(zhàn)案例 411
7.6 本章小結(jié) 414

第8章 設(shè)計(jì)中的光影視界 415
8.1 光源類型 418
8.1.1 照射光 418
8.1.2 環(huán)境光 421
8.2 物體明暗 424
8.2.1 明暗原則 425
8.2.2 環(huán)境色影響 429
實(shí)戰(zhàn)案例 432
8.2.3 照射光影響 434
8.2.4 其他材質(zhì) 445
8.3 物體投影 450
8.3.1 投影方向 451
8.3.2 投影輪廓 451
8.3.3 投影顏色 458
8.3.4 投影深淺 459
8.3.5 投影虛實(shí) 461
實(shí)戰(zhàn)案例 464
8.4 戲劇化用光 470
8.4.1 明暗對(duì)比 470
8.4.2 色相對(duì)比 473
8.4.3 形狀劃分 476
實(shí)戰(zhàn)案例 481
8.5 本章小結(jié) 484

第9章 字體設(shè)計(jì)的門與路 485
9.1 字體的類型和氣質(zhì) 488
9.1.1 字體類型 488
9.1.2 字體氣質(zhì) 496
9.1.3 選擇合適的字體 498
9.2 字體設(shè)計(jì) 502
9.2.1 字體設(shè)計(jì)原則 502
9.2.2 改字 504
9.2.3 造字 511
實(shí)戰(zhàn)案例 516
9.3 字效呈現(xiàn) 519
9.3.1 立體 519
9.3.2 邊框 522
9.3.3 陰影 523
9.3.4 質(zhì)感 526
實(shí)戰(zhàn)案例 529
9.4 本章小結(jié) 534

第 10章 版式設(shè)計(jì)沒(méi)那么簡(jiǎn)單（一）手機(jī)端詳情頁(yè)設(shè)計(jì) 535
10.1 做前想一想 538
10.1.1 整體印象 538
10.1.2 梳理文案 541
10.1.3 確定風(fēng)格 544
10.1.4 畫草圖、定配色 547
10.2 版式設(shè)計(jì)4原則 549
10.2.1 對(duì)齊 549
10.2.2 親密性 552
10.2.3 對(duì)比 556
10.2.4 重復(fù) 559
10.3 詳情頁(yè)版式設(shè)計(jì) 564
10.3.1 瀏覽順序 566
10.3.2 一屏一版塊 571
10.3.3 版塊結(jié)構(gòu) 573
10.3.4 前3屏原則 581
10.3.5 輕重結(jié)合 582
10.3.6 留白 586
10.3.7 少即是多 589
10.4 版式設(shè)計(jì)細(xì)節(jié) 592
10.4.1 幾何圖形 592
10.4.2 具象圖形 600
10.5 本章小結(jié) 606

第 11章 版式設(shè)計(jì)沒(méi)那么簡(jiǎn)單（二）手機(jī)端專題頁(yè)設(shè)計(jì) 607
11.1 專題頁(yè)設(shè)計(jì)全局觀 610
11.1.1 服務(wù)對(duì)象 610
11.1.2 常用版塊 610
11.1.3 統(tǒng)一與變化 614
11.1.4 表現(xiàn)類型 624
實(shí)戰(zhàn)案例 632
11.2 專題頁(yè)版式設(shè)計(jì) 635
11.2.1 瀏覽順序 635
11.2.2 模塊大小 637
11.2.3 內(nèi)容區(qū)隔 642
11.2.4 信息呈現(xiàn) 648
11.3 本章小結(jié) 656