滿額折
Photoshop H5廣告設計（簡體書）
相關商品
商品簡介
作者簡介
目次
商品簡介
菜鳥如何快速成為H5廣告頁面設計高手？如何用H5廣告頁面征服上司和客戶？如何零基礎製作出專業、漂亮的H5廣告頁面？《Photoshop H5廣告設計》將按照兩條線路幫助讀者精通Photoshop H5廣告設計： 一條是橫向案例線，通過20多個經典案例，包括產品推廣、活動推廣、互粉增粉、人才招募、企業宣傳、節日活動、會議邀請、喜慶請柬等，從零開始學習製作H5廣告效果。 另一條是縱向技巧線，講解了配色常識、文字排版、版式佈局等核心技能，幫助讀者徹底讀懂、玩透H5廣告設計。 《Photoshop H5廣告設計》適合H5微信頁面廣告設計者、新媒體廣告設計師、移動互聯網廣告設計人員等閱讀。
作者簡介
盧博，畢業于廣州美術學院，專業廣告學出身曾於佛羅倫薩美術學院(意大利)進修站酷網 H5 設計師，亞洲CI網、紅動中國 H5 設計師擅長新媒體、H5、APP界面設計，如H5微信界面、H5微信廣告、直播廣告、微信公眾號、微信小程序等廣告
目次
目錄
第1章 H5廣告設計入門 1
1.1 什麼是H5 2
1.1.1 H5是什麼 2
1.1.2 無處不在的H5 3
1.1.3 H5的主要功能 5
1.1.4 使用H5有哪些優勢 5
1.1.5 探索H5廣告的潮流和方向 8
1.2 H5頁面的類型 9
1.2.1 活動運營型 10
1.2.2 品牌宣傳型 10
1.2.3 產品介紹型 11
1.2.4 總結報告型 11
1.3 形式為功能服務 12
1.3.1 簡單圖文的H5頁面 12
1.3.2 禮物 賀卡 邀請函的H5頁面 12
1.3.3 問答 評分 測試的H5頁面 12
1.3.4 遊戲的 H5頁面 13
第2章 H5設計的常用工具 14
2.1 基於互聯網平臺的H5開發工具 15
2.1.1 APICloud：H5代碼編輯工具 15
2.1.2 Egret：提供開源的H5引擎 16
2.1.3 雲適配：一鍵PC網站轉移動網站 17
2.1.4 iH5：HTML5可視化編輯工具 18
2.1.5 人人秀：無代碼的H5製作工具 20
2.1.6 易企秀：H5場景定制工具 22
2.2 基於應用軟件的H5設計工具 24
2.2.1 Photoshop：圖形圖像設計工具 24
2.2.2 Illustrator：專業的矢量圖繪製工具 25
2.2.3 After Effects：製作酷炫的視頻特效 25
2.2.4 CINEMA 4D：專業的三維軟件工具 26
2.2.5 隨身錄音室：數碼音樂創作軟件 26
2.2.6 HYPE：HTML5動畫製作利器 27
2.2.7 其他：H5設計常用的輔助工具 27
2.3 選擇H5的工具組合形式 29
2.3.1 選擇開發類H5工具 29
2.3.2 選擇網站類H5工具 30
2.3.3 利用手機制作H5 30
第3章 H5設計的基本操作 32
3.1 如何“生產”H5 33
3.1.1 選擇平臺和進行登錄 33
3.1.2 選擇模板 33
3.1.3 佈局頁面 34
3.1.4 添加和編輯圖片 35
3.1.5 添加和編輯文本元素 36
3.1.6 添加動畫元素 36
3.1.7 添加音樂元素 37
3.1.8 添加視頻元素 37
3.1.9 添加交互元素 38
3.1.10 添加表單和組件 39
3.1.11 預覽作品 40
3.1.12 發佈作品 40
3.2 在H5頁面中添加各種元素 41
3.2.1 添加彈幕元素 41
3.2.2 添加地圖元素 42
3.2.3 添加倒計時元素 43
3.2.4 添加動畫文字元素 45
3.2.5 添加圖表插件元素 46
3.2.6 添加祝福賀卡元素 48
3.2.7 添加雷達掃描元素 49
3.2.8 添加語音留言元素 50
3.2.9 添加照片海報元素 51
3.2.10 製作長頁面H5 52
3.3 為設計加分的4個要點 54
3.3.1 細節與統一 54
3.3.2 熱點與話題 55
3.3.3 故事與情感 55
3.3.4 技術與互動 56
第4章 H5的視覺交互設計 57
4.1 H5頁面的版式設計 58
4.1.1 H5版式設計的原則 58
4.1.2 H5頁面的網格設計 59
4.1.3 H5頁面版式的突破 62
4.2 H5頁面的字體設計 62
4.2.1 設置H5頁面的字體 62
4.2.2 設置H5頁面的字號 64
4.2.3 設置H5頁面的字間距 64
4.2.4 設置H5頁面的行間距 65
4.2.5 H5字體設計的基本技巧 65
4.3 H5頁面的色彩設計 66
4.3.1 瞭解色彩原理 66
4.3.2 瞭解色彩三要素 67
4.3.3 實用H5配色技巧 70
4.4 H5頁面的交互設計 74
4.4.1 瞭解H5交互設計 74
4.4.2 製作H5交互設計 74
4.5 H5頁面的視覺流程設計 78
4.5.1 什麼是視覺流程設計 78
4.5.2 H5常見的視覺流程設計類型 78
第5章 H5的創意內容設計 81
5.1 創建H5活動營銷頁面 82
5.1.1 答題活動的H5頁面 82
5.1.2 問卷調查活動的H5頁面 84
5.1.3 微信紅包活動的H5頁面 86
5.1.4 VR全景的H5頁面 88
5.1.5 一鏡到底的H5頁面 89
5.1.6 快閃活動的H5頁面 90
5.1.7 砍價活動的H5頁面 91
5.2 創建H5趣味營銷頁面 92
5.2.1 互動遊戲設計 92
5.2.2 微信場景模擬 93
5.2.3 來電界面模擬 95
5.2.4 通知界面模擬 95
第6章 產品推廣：營銷展示的H5廣告設計 97
6.1 新品上市：掌握新品發佈的H5頁面設計 98
6.1.1 設計新品發佈背景形狀效果 98
6.1.2 設計新品發佈圖文信息效果 101
6.1.3 設計新品發佈圖層裝飾效果 105
6.2 數碼宣傳：掌握電商產品的H5頁面設計 108
6.2.1 設計電商產品雜色背景效果 108
6.2.2 設計電商產品主體佈局效果 110
6.2.3 設計電商產品信息點綴效果 115
6.3 品牌汽車：掌握汽車產品的H5頁面設計 116
6.3.1 設計汽車產品頁面背景效果 117
6.3.2 設計汽車產品界面框架效果 118
6.3.3 設計汽車產品文字修飾效果 120
第7章 活動推廣：互動投票的H5廣告設計 123
7.1 新春活動：掌握砸金蛋的H5頁面設計 124
7.1.1 設計砸金蛋新春背景效果 124
7.1.2 設計砸金蛋元素裝飾效果 126
7.1.3 設計砸金蛋文字按鈕效果 130
7.2 商場活動：掌握抽獎活動的H5頁面設計 133
7.2.1 設計抽獎活動轉盤底盤效果 134
7.2.2 設計抽獎活動獎品文字信息 139
7.2.3 設計抽獎活動頁面裝飾效果 144
7.3 營銷活動：掌握投票活動的H5頁面設計 147
7.3.1 設計投票活動背景效果 147
7.3.2 設計投票活動文字信息 149
7.3.3 設計投票活動點綴效果 154
第8章 互粉增粉：遊戲紅包的H5廣告設計 157
8.1 遊戲程序：掌握小遊戲的H5頁面設計 158
8.1.1 設計小遊戲背景底紋效果 158
8.1.2 設計小遊戲界面按鈕效果 159
8.1.3 設計小遊戲素材插件效果 164
8.2 攝影論壇：掌握旅行相冊的H5頁面設計 165
8.2.1 設計旅行相冊顆粒背景效果 166
8.2.2 設計旅行相冊文字信息效果 167
8.2.3 設計旅行相冊照片裝飾效果 169
8.3 微信增粉：掌握口令紅包的H5頁面設計 171
8.3.1 設計口令紅包頁面效果 171
8.3.2 設計口令紅包按鈕效果 174
8.3.3 設計口令紅包背景效果 178
第9章 人才招募：招聘求職的H5廣告設計 179
9.1 企業招聘：掌握專場招聘會的H5頁面設計 180
9.1.1 設計專場招聘會漸變合成背景效果 180
9.1.2 設計專場招聘會招聘信息邊框效果 183
9.1.3 設計專場招聘會的文字宣傳內容 184
9.2 實習招募：掌握校園招聘會的H5頁面設計 188
9.2.1 設計校園招聘會動感模糊背景效果 189
9.2.2 設計校園招聘會頁面主題宣傳信息 190
9.2.3 設計校園招聘會元素裝飾效果 194
9.3 應聘求職：掌握個人簡歷的H5頁面設計 197
9.3.1 設計個人簡歷舞臺揭幕效果 198
9.3.2 設計個人簡歷主題文字效果 200
9.3.3 設計個人簡歷光斑點綴效果 203
第10章 企業宣傳：品牌介紹的H5廣告設計 206
10.1 會議宣傳：掌握商務彙報的H5頁面設計 207
10.1.1 設計商務彙報頁面背景效果 207
10.1.2 設計商務彙報主題內容效果 209
10.1.3 設計商務彙報背景裝飾效果 211
10.2 公司簡介：掌握公司介紹的H5頁面設計 214
10.2.1 設計公司介紹背景色塊效果 214
10.2.2 設計公司介紹圖片文字效果 215
10.2.3 設計公司介紹文字裝飾效果 219
10.3 企業品牌：掌握品牌展示的H5頁面設計 220
10.3.1 設計品牌展示色彩搭配效果 221
10.3.2 設計品牌展示主題文字效果 223
10.3.3 設計品牌展示企業標誌效果 225
第11章 節日活動：電商購物的H5廣告設計 227
11.1 購物活動：掌握年中大促的H5頁面設計 228
11.1.1 設計年中大促漸變背景效果 228
11.1.2 設計年中大促底部裝飾效果 229
11.1.3 設計年中大促標誌文字效果 231
11.2 電商活動：掌握雙十二促銷的H5頁面設計 237
11.2.1 設計雙十二促銷紋理綠葉效果 238
11.2.2 設計雙十二促銷文字邊框效果 240
11.2.3 設計雙十二促銷產品佈局效果 242
11.3 七夕活動：掌握情人節的H5頁面設計 244
11.3.1 設計情人節浪漫星空背景效果 245
11.3.2 設計情人節漸變文字按鈕效果 246
11.3.3 設計情人節情侶裝飾效果 251
第12章 會議邀請：年會晚會邀請函的H5廣告設計 254
12.1 企業年會：掌握年會邀請函的H5頁面設計 255
12.1.1 設計年會邀請函歐式邊框效果 255
12.1.2 設計年會邀請函主題內容效果 257
12.1.3 設計年會邀請函底部裝飾效果 259
12.2 招商加盟：掌握招商邀請函的H5頁面設計 261
12.2.1 設計招商邀請函背景底紋效果 261
12.2.2 設計招商邀請函文字廣告信息 264
12.2.3 設計招商邀請函個性花紋效果 265
12.3 頒獎晚會：掌握頒獎典禮邀請函的 H5頁面設計 266
12.3.1 設計頒獎典禮邀請函旋轉背景效果 266
12.3.2 設計頒獎典禮邀請函內容效果 268
12.3.3 設計頒獎典禮邀請函裝飾效果 271
第13章 喜慶請柬：賀卡卡片的H5廣告設計 273
13.1 結婚請帖：掌握婚禮請柬的H5頁面設計 274
13.1.1 設計婚禮請柬主題背景效果 274
13.1.2 設計婚禮請柬文本矩形效果 276
13.1.3 設計婚禮請柬裝飾效果 279
13.2 新春賀卡：掌握新年祝福的H5頁面設計 281
13.2.1 設計新年祝福背景紋理效果 282
13.2.2 設計新年祝福文字信息效果 283
13.2.3 設計新年祝福新春元素效果 290
13.3 愛情卡片：掌握情侶表白的H5頁面設計 294
13.3.1 設計情侶表白浪漫背景效果 294
13.3.2 設計情侶表白文本內容效果 295
13.3.3 設計情侶表白元素裝飾效果 297
第1章 H5廣告設計入門 1
1.1 什麼是H5 2
1.1.1 H5是什麼 2
1.1.2 無處不在的H5 3
1.1.3 H5的主要功能 5
1.1.4 使用H5有哪些優勢 5
1.1.5 探索H5廣告的潮流和方向 8
1.2 H5頁面的類型 9
1.2.1 活動運營型 10
1.2.2 品牌宣傳型 10
1.2.3 產品介紹型 11
1.2.4 總結報告型 11
1.3 形式為功能服務 12
1.3.1 簡單圖文的H5頁面 12
1.3.2 禮物 賀卡 邀請函的H5頁面 12
1.3.3 問答 評分 測試的H5頁面 12
1.3.4 遊戲的 H5頁面 13
第2章 H5設計的常用工具 14
2.1 基於互聯網平臺的H5開發工具 15
2.1.1 APICloud：H5代碼編輯工具 15
2.1.2 Egret：提供開源的H5引擎 16
2.1.3 雲適配：一鍵PC網站轉移動網站 17
2.1.4 iH5：HTML5可視化編輯工具 18
2.1.5 人人秀：無代碼的H5製作工具 20
2.1.6 易企秀：H5場景定制工具 22
2.2 基於應用軟件的H5設計工具 24
2.2.1 Photoshop：圖形圖像設計工具 24
2.2.2 Illustrator：專業的矢量圖繪製工具 25
2.2.3 After Effects：製作酷炫的視頻特效 25
2.2.4 CINEMA 4D：專業的三維軟件工具 26
2.2.5 隨身錄音室：數碼音樂創作軟件 26
2.2.6 HYPE：HTML5動畫製作利器 27
2.2.7 其他：H5設計常用的輔助工具 27
2.3 選擇H5的工具組合形式 29
2.3.1 選擇開發類H5工具 29
2.3.2 選擇網站類H5工具 30
2.3.3 利用手機制作H5 30
第3章 H5設計的基本操作 32
3.1 如何“生產”H5 33
3.1.1 選擇平臺和進行登錄 33
3.1.2 選擇模板 33
3.1.3 佈局頁面 34
3.1.4 添加和編輯圖片 35
3.1.5 添加和編輯文本元素 36
3.1.6 添加動畫元素 36
3.1.7 添加音樂元素 37
3.1.8 添加視頻元素 37
3.1.9 添加交互元素 38
3.1.10 添加表單和組件 39
3.1.11 預覽作品 40
3.1.12 發佈作品 40
3.2 在H5頁面中添加各種元素 41
3.2.1 添加彈幕元素 41
3.2.2 添加地圖元素 42
3.2.3 添加倒計時元素 43
3.2.4 添加動畫文字元素 45
3.2.5 添加圖表插件元素 46
3.2.6 添加祝福賀卡元素 48
3.2.7 添加雷達掃描元素 49
3.2.8 添加語音留言元素 50
3.2.9 添加照片海報元素 51
3.2.10 製作長頁面H5 52
3.3 為設計加分的4個要點 54
3.3.1 細節與統一 54
3.3.2 熱點與話題 55
3.3.3 故事與情感 55
3.3.4 技術與互動 56
第4章 H5的視覺交互設計 57
4.1 H5頁面的版式設計 58
4.1.1 H5版式設計的原則 58
4.1.2 H5頁面的網格設計 59
4.1.3 H5頁面版式的突破 62
4.2 H5頁面的字體設計 62
4.2.1 設置H5頁面的字體 62
4.2.2 設置H5頁面的字號 64
4.2.3 設置H5頁面的字間距 64
4.2.4 設置H5頁面的行間距 65
4.2.5 H5字體設計的基本技巧 65
4.3 H5頁面的色彩設計 66
4.3.1 瞭解色彩原理 66
4.3.2 瞭解色彩三要素 67
4.3.3 實用H5配色技巧 70
4.4 H5頁面的交互設計 74
4.4.1 瞭解H5交互設計 74
4.4.2 製作H5交互設計 74
4.5 H5頁面的視覺流程設計 78
4.5.1 什麼是視覺流程設計 78
4.5.2 H5常見的視覺流程設計類型 78
第5章 H5的創意內容設計 81
5.1 創建H5活動營銷頁面 82
5.1.1 答題活動的H5頁面 82
5.1.2 問卷調查活動的H5頁面 84
5.1.3 微信紅包活動的H5頁面 86
5.1.4 VR全景的H5頁面 88
5.1.5 一鏡到底的H5頁面 89
5.1.6 快閃活動的H5頁面 90
5.1.7 砍價活動的H5頁面 91
5.2 創建H5趣味營銷頁面 92
5.2.1 互動遊戲設計 92
5.2.2 微信場景模擬 93
5.2.3 來電界面模擬 95
5.2.4 通知界面模擬 95
第6章 產品推廣：營銷展示的H5廣告設計 97
6.1 新品上市：掌握新品發佈的H5頁面設計 98
6.1.1 設計新品發佈背景形狀效果 98
6.1.2 設計新品發佈圖文信息效果 101
6.1.3 設計新品發佈圖層裝飾效果 105
6.2 數碼宣傳：掌握電商產品的H5頁面設計 108
6.2.1 設計電商產品雜色背景效果 108
6.2.2 設計電商產品主體佈局效果 110
6.2.3 設計電商產品信息點綴效果 115
6.3 品牌汽車：掌握汽車產品的H5頁面設計 116
6.3.1 設計汽車產品頁面背景效果 117
6.3.2 設計汽車產品界面框架效果 118
6.3.3 設計汽車產品文字修飾效果 120
第7章 活動推廣：互動投票的H5廣告設計 123
7.1 新春活動：掌握砸金蛋的H5頁面設計 124
7.1.1 設計砸金蛋新春背景效果 124
7.1.2 設計砸金蛋元素裝飾效果 126
7.1.3 設計砸金蛋文字按鈕效果 130
7.2 商場活動：掌握抽獎活動的H5頁面設計 133
7.2.1 設計抽獎活動轉盤底盤效果 134
7.2.2 設計抽獎活動獎品文字信息 139
7.2.3 設計抽獎活動頁面裝飾效果 144
7.3 營銷活動：掌握投票活動的H5頁面設計 147
7.3.1 設計投票活動背景效果 147
7.3.2 設計投票活動文字信息 149
7.3.3 設計投票活動點綴效果 154
第8章 互粉增粉：遊戲紅包的H5廣告設計 157
8.1 遊戲程序：掌握小遊戲的H5頁面設計 158
8.1.1 設計小遊戲背景底紋效果 158
8.1.2 設計小遊戲界面按鈕效果 159
8.1.3 設計小遊戲素材插件效果 164
8.2 攝影論壇：掌握旅行相冊的H5頁面設計 165
8.2.1 設計旅行相冊顆粒背景效果 166
8.2.2 設計旅行相冊文字信息效果 167
8.2.3 設計旅行相冊照片裝飾效果 169
8.3 微信增粉：掌握口令紅包的H5頁面設計 171
8.3.1 設計口令紅包頁面效果 171
8.3.2 設計口令紅包按鈕效果 174
8.3.3 設計口令紅包背景效果 178
第9章 人才招募：招聘求職的H5廣告設計 179
9.1 企業招聘：掌握專場招聘會的H5頁面設計 180
9.1.1 設計專場招聘會漸變合成背景效果 180
9.1.2 設計專場招聘會招聘信息邊框效果 183
9.1.3 設計專場招聘會的文字宣傳內容 184
9.2 實習招募：掌握校園招聘會的H5頁面設計 188
9.2.1 設計校園招聘會動感模糊背景效果 189
9.2.2 設計校園招聘會頁面主題宣傳信息 190
9.2.3 設計校園招聘會元素裝飾效果 194
9.3 應聘求職：掌握個人簡歷的H5頁面設計 197
9.3.1 設計個人簡歷舞臺揭幕效果 198
9.3.2 設計個人簡歷主題文字效果 200
9.3.3 設計個人簡歷光斑點綴效果 203
第10章 企業宣傳：品牌介紹的H5廣告設計 206
10.1 會議宣傳：掌握商務彙報的H5頁面設計 207
10.1.1 設計商務彙報頁面背景效果 207
10.1.2 設計商務彙報主題內容效果 209
10.1.3 設計商務彙報背景裝飾效果 211
10.2 公司簡介：掌握公司介紹的H5頁面設計 214
10.2.1 設計公司介紹背景色塊效果 214
10.2.2 設計公司介紹圖片文字效果 215
10.2.3 設計公司介紹文字裝飾效果 219
10.3 企業品牌：掌握品牌展示的H5頁面設計 220
10.3.1 設計品牌展示色彩搭配效果 221
10.3.2 設計品牌展示主題文字效果 223
10.3.3 設計品牌展示企業標誌效果 225
第11章 節日活動：電商購物的H5廣告設計 227
11.1 購物活動：掌握年中大促的H5頁面設計 228
11.1.1 設計年中大促漸變背景效果 228
11.1.2 設計年中大促底部裝飾效果 229
11.1.3 設計年中大促標誌文字效果 231
11.2 電商活動：掌握雙十二促銷的H5頁面設計 237
11.2.1 設計雙十二促銷紋理綠葉效果 238
11.2.2 設計雙十二促銷文字邊框效果 240
11.2.3 設計雙十二促銷產品佈局效果 242
11.3 七夕活動：掌握情人節的H5頁面設計 244
11.3.1 設計情人節浪漫星空背景效果 245
11.3.2 設計情人節漸變文字按鈕效果 246
11.3.3 設計情人節情侶裝飾效果 251
第12章 會議邀請：年會晚會邀請函的H5廣告設計 254
12.1 企業年會：掌握年會邀請函的H5頁面設計 255
12.1.1 設計年會邀請函歐式邊框效果 255
12.1.2 設計年會邀請函主題內容效果 257
12.1.3 設計年會邀請函底部裝飾效果 259
12.2 招商加盟：掌握招商邀請函的H5頁面設計 261
12.2.1 設計招商邀請函背景底紋效果 261
12.2.2 設計招商邀請函文字廣告信息 264
12.2.3 設計招商邀請函個性花紋效果 265
12.3 頒獎晚會：掌握頒獎典禮邀請函的 H5頁面設計 266
12.3.1 設計頒獎典禮邀請函旋轉背景效果 266
12.3.2 設計頒獎典禮邀請函內容效果 268
12.3.3 設計頒獎典禮邀請函裝飾效果 271
第13章 喜慶請柬：賀卡卡片的H5廣告設計 273
13.1 結婚請帖：掌握婚禮請柬的H5頁面設計 274
13.1.1 設計婚禮請柬主題背景效果 274
13.1.2 設計婚禮請柬文本矩形效果 276
13.1.3 設計婚禮請柬裝飾效果 279
13.2 新春賀卡：掌握新年祝福的H5頁面設計 281
13.2.1 設計新年祝福背景紋理效果 282
13.2.2 設計新年祝福文字信息效果 283
13.2.3 設計新年祝福新春元素效果 290
13.3 愛情卡片：掌握情侶表白的H5頁面設計 294
13.3.1 設計情侶表白浪漫背景效果 294
13.3.2 設計情侶表白文本內容效果 295
13.3.3 設計情侶表白元素裝飾效果 297
您曾經瀏覽過的商品
購物須知
大陸出版品因裝訂品質及貨運條件與台灣出版品落差甚大，除封面破損、內頁脫落等較嚴重的狀態，其餘商品將正常出貨。
特別提醒：部分書籍附贈之內容(如音頻mp3或影片dvd等)已無實體光碟提供，需以QR CODE 連結至當地網站註冊“並通過驗證程序”，方可下載使用。
無現貨庫存之簡體書，將向海外調貨：
海外有庫存之書籍，等候約45個工作天;
海外無庫存之書籍，平均作業時間約60個工作天，然不保證確定可調到貨，尚請見諒。
為了保護您的權益，「三民網路書店」提供會員七日商品鑑賞期(收到商品為起始日)。
若要辦理退貨，請在商品鑑賞期內寄回，且商品必須是全新狀態與完整包裝(商品、附件、發票、隨貨贈品等)否則恕不接受退貨。