《H5+行銷設計手冊：創意、視覺、實戰》是2020年3月人民郵電出版社出版的圖書，作者是蘇杭（小呆）。
基本介紹
- 書名：H5+行銷設計手冊：創意、視覺、實戰
- 作者：蘇杭（小呆）
- ISBN：9787115498519
- 頁數：224頁
- 定價：79元
- 出版社：人民郵電出版社
- 出版時間：2020年3月
- 裝幀：平裝
- 開本：小16開
內容簡介,圖書目錄,
內容簡介
本書是為H5的入門學習者編寫的，以“圖書”+“動態演示”+“視頻教榜驗奔熱程”+“社群交流”+“行業文章”的立體教學模式，系統講解H5設計的常擔套識和規範，以及製作方法和技巧。
全書共11章。第1～2章從認識H5開始講起，闡明其特徵和功能，詳細講解H5的設計規範與常用工具，並介紹如何為設計與製作做好高質量的素材準備工作；第3～9章圍繞H5的設計與製作的全流程，逐步講解H5的策劃，頁面設計，元素與文字設計，動態設計和音頻設計等內容，並闡述H5的數據分析與測試方法；第10章精選了翻頁類、長圖類、數據類和功能類等4個H5設計全流程案例，詳細講解了H5的設計思路和製作方法，幫助讀者鞏固前面所學的知識，提高讀者的套用能力。第11章介紹了進階專業級H5設計的方法，幫讀者搭好提高的台階。
為了讓讀者能更好地學習H5的製作，本書以二維碼的形式在書中植入了大量的動態輔助內容，包括動態演示、聲效演示、H5案例演示和全套的教學視頻。另外，通過本書作者的微信公眾號，讀者還能獲得行業“乾貨”文章，並能加入讀者社群進行討論。
除了從事設計工作的設計師外，本書還適合H5設計的初學者和H5設計的愛好者閱讀。
圖書目錄
第 1章 重新認識H5 13
1.1 H5是什麼 14
1.1.1 H5真的就是手機PPT嗎· 14
1.1.2 原來H5隻是一個“洋外號” 15
1.2 H5的各項特徵 17
1.2.1 H5現階段的套用領域 17
1.2.2 H5目前的應放巴拔用形式 20
1.2.3 H5能實現的功能 21
1.2.4 H5的優勢與不足 23
第 2章 了解H5設計的工具和規範 29
2.1 H5設計要經歷的流程 30
2.1.1 認真了解需求 31
2.1.2 做設計規劃 31
2.1.3 有計畫地設計 32
2.1.4 利用工具製作H5 33
2.1.5 體驗與測試 33
2.1.6 總結分析數據 33
2.2 關於H5，你不可不知的工具 35
2.2.1 製作H5的常用工具 35
2.2.2 製作H5最常用軟體 38
2.3 H5設計要特別注意的規範 41
2.3.1 選擇瀏覽器 41
2.3.2 常用設計尺寸 42
2.3.3 H5回響式特徵 43
2.3.4 頁面“安全區” 45
第3章 怎么獲得高質量的素材 49
3.1 H5案例素材在哪裡找· 50
3.1.1 資訊網禁員判站 50
3.1.2 資訊自媒體 53
3.2 獲得圖片與設計素材 53
3.2.1 綜合類素材庫 54
3.2.2 付費類素材庫 54
3.2.3 國外素材庫 54
3.2.4 圖示類素材庫 55
3.2.5 素材庫的素材庫 55
3.2.6 教你尋找圖片出處 56
3.3 H5字型素材 57
3.3.1 優質字型素材 57
3.3.2 特殊字型素材 58
3.3.3 實用字型推薦 59
3.4 H5音效素材 61
3.4.1 雲音樂搜尋平台 61
3.4.2 免費音效素材庫 62
3.4.3 著作權音效素材庫 63
第4章 H5的策劃技巧 65
4.1 了解移動端用戶習慣 66
4.1.1 畫面尺寸差異 66
4.1.2 閱企拒束讀習慣差異 66
4.1.3 場景習慣差異 67
4.2 根據兵臭閥用戶心理設計H5內容 求奔鍵台68
4.2.1 認同感 68
4.2.2 獎勵 70
4.2.3 熟悉度 71
4.2.4 製造意外 72
4.3 根據項目特徵選擇對應形式 74
4.3.1 邀請函 74
4.3.2 個人簡歷 75
4.3.3 企業幻燈片 75
4.3.4 電子宣傳冊 76
4.3.5 促銷廣告 77
4.3.6 問卷、信息收集 77
第5章 頁面設計技巧 81
5.1 繪製頁面原型圖 82
5.1.1 什麼是原型圖 82
5.1.2 H5設計的原型圖 82
5.2 把握頁面視覺氛圍 84
5.2.1 色彩是決定氛圍的關鍵 84
5.2.2 色彩的情感 85
5.2.3 色彩的4種風格 86
5.2.4 頁面的3階配色法 90
5.2.5 配色工具推薦 94
5.3 H5版面設計技巧 95
5.3.1 好的版式讓內容更清晰 95
5.3.2 創造畫面焦點 96
5.3.3 單個頁面的層級 99
5.3.4 多個頁面的層級 102
5.3.5 讓H5更有節奏感 103
第6章 元素與文字設計技巧 107
6.1 H5的視覺設計技巧 108
6.1.1 圖形永遠好過文字 108
6.1.2 頁面元素要儘量統一 108
6.2 H5的圖片設計技巧 109
6.2.1 儘量使用全圖 109
6.2.2 可營造空間感 110
6.2.3 多用特寫圖片 111
6.2.4 圖片版式要統一 112
6.3 H5的標題設計技巧 113
6.3.1 標題的空間 113
6.3.2 標題的層級 115
6.3.3 標題與圖形 116
6.3.4 標題與背景 116
6.4 H5的正文設計技巧 117
6.4.1 壓縮內容量 118
6.4.2 控制字號 119
6.4.3 字型及其顏色 120
6.4.4 字型裝飾 121
第7章 動態設計技巧 123
7.1 H5動態基本常識 124
7.1.1 正確理解動效的作用 124
7.1.2 動效要還原物理特徵 125
7.2 內頁動效設計 126
7.2.1 內容展示動態特徵 126
7.2.2 運動樣式的統一 128
7.2.3 動效展示的層級 129
7.3 轉場動效設計 130
7.3.1 最實用的轉場效果 130
7.3.2 轉場效果的時間 131
7.4 功能動效設計 131
第8章 音效設計技巧 135
8.1 如何看待音效 136
8.1.1 聽覺和視覺哪個更重要 136
8.1.2 聲畫對位關係 137
8.2 背景音效製作技巧 138
8.2.1 如何獲得合適的音效 138
8.2.2 儘量不要使用歌曲 139
8.2.3 音樂要短小 139
8.2.4 加入“淡入”與“淡出”效果 140
8.2.5 學會採集音效 141
8.3 背景音效製作流程 142
8.3.1 用GarageBand製作音效 142
8.3.2 用Audition製作音效 147
第9章 H5數據分析與測試 153
9.1 你要了解的數據常識 154
9.1.1 常規數據概念 154
9.1.2 數據的作用 156
9.2 你也可以做的H5測試 157
9.2.1 好友、朋友圈和社群測試 158
9.2.2 公眾號測試 160
第 10章 H5設計案例全流程實戰 161
10.1 翻頁類H5-線下門店案例 162
10.1.1 項目素材（模擬案例） 162
10.1.2 項目主題與內容框架 162
10.1.3 H5原型和設計構思 164
10.1.4 H5製作過程 166
10.2 長圖類H5-線下活動案例 176
10.2.1 項目素材 176
10.2.2 項目主題與內容框架 176
10.2.3 H5原型與設計思路 178
10.2.4 H5製作過程 179
10.3 數據類H5-模擬案例 186
10.3.1 項目素材（模擬案例） 186
10.3.2 項目主題與內容框架 186
10.3.3 H5原型和設計構思 188
10.3.4 H5製作過程 189
10.4 功能類H5-模版案例 197
10.4.1 投票模版類H5設計 197
10.4.2 抽獎模版類H5設計 204
10.4.3 小遊戲模版類H5設計 209
第 11章 H5的進階學習 215
11.1 普通級H5與專業級H5的差別 216
11.2 H5的更多可能性 217
11.3 專業級H5工具推薦 220
11.3.1 可製作專業級H5的工具 220
11.3.2 工具的幾個關鍵點 220
3.4 H5音效素材 61
3.4.1 雲音樂搜尋平台 61
3.4.2 免費音效素材庫 62
3.4.3 著作權音效素材庫 63
第4章 H5的策劃技巧 65
4.1 了解移動端用戶習慣 66
4.1.1 畫面尺寸差異 66
4.1.2 閱讀習慣差異 66
4.1.3 場景習慣差異 67
4.2 根據用戶心理設計H5內容 68
4.2.1 認同感 68
4.2.2 獎勵 70
4.2.3 熟悉度 71
4.2.4 製造意外 72
4.3 根據項目特徵選擇對應形式 74
4.3.1 邀請函 74
4.3.2 個人簡歷 75
4.3.3 企業幻燈片 75
4.3.4 電子宣傳冊 76
4.3.5 促銷廣告 77
4.3.6 問卷、信息收集 77
第5章 頁面設計技巧 81
5.1 繪製頁面原型圖 82
5.1.1 什麼是原型圖 82
5.1.2 H5設計的原型圖 82
5.2 把握頁面視覺氛圍 84
5.2.1 色彩是決定氛圍的關鍵 84
5.2.2 色彩的情感 85
5.2.3 色彩的4種風格 86
5.2.4 頁面的3階配色法 90
5.2.5 配色工具推薦 94
5.3 H5版面設計技巧 95
5.3.1 好的版式讓內容更清晰 95
5.3.2 創造畫面焦點 96
5.3.3 單個頁面的層級 99
5.3.4 多個頁面的層級 102
5.3.5 讓H5更有節奏感 103
第6章 元素與文字設計技巧 107
6.1 H5的視覺設計技巧 108
6.1.1 圖形永遠好過文字 108
6.1.2 頁面元素要儘量統一 108
6.2 H5的圖片設計技巧 109
6.2.1 儘量使用全圖 109
6.2.2 可營造空間感 110
6.2.3 多用特寫圖片 111
6.2.4 圖片版式要統一 112
6.3 H5的標題設計技巧 113
6.3.1 標題的空間 113
6.3.2 標題的層級 115
6.3.3 標題與圖形 116
6.3.4 標題與背景 116
6.4 H5的正文設計技巧 117
6.4.1 壓縮內容量 118
6.4.2 控制字號 119
6.4.3 字型及其顏色 120
6.4.4 字型裝飾 121
第7章 動態設計技巧 123
7.1 H5動態基本常識 124
7.1.1 正確理解動效的作用 124
7.1.2 動效要還原物理特徵 125
7.2 內頁動效設計 126
7.2.1 內容展示動態特徵 126
7.2.2 運動樣式的統一 128
7.2.3 動效展示的層級 129
7.3 轉場動效設計 130
7.3.1 最實用的轉場效果 130
7.3.2 轉場效果的時間 131
7.4 功能動效設計 131
第8章 音效設計技巧 135
8.1 如何看待音效 136
8.1.1 聽覺和視覺哪個更重要 136
8.1.2 聲畫對位關係 137
8.2 背景音效製作技巧 138
8.2.1 如何獲得合適的音效 138
8.2.2 儘量不要使用歌曲 139
8.2.3 音樂要短小 139
8.2.4 加入“淡入”與“淡出”效果 140
8.2.5 學會採集音效 141
8.3 背景音效製作流程 142
8.3.1 用GarageBand製作音效 142
8.3.2 用Audition製作音效 147
第9章 H5數據分析與測試 153
9.1 你要了解的數據常識 154
9.1.1 常規數據概念 154
9.1.2 數據的作用 156
9.2 你也可以做的H5測試 157
9.2.1 好友、朋友圈和社群測試 158
9.2.2 公眾號測試 160
第 10章 H5設計案例全流程實戰 161
10.1 翻頁類H5-線下門店案例 162
10.1.1 項目素材（模擬案例） 162
10.1.2 項目主題與內容框架 162
10.1.3 H5原型和設計構思 164
10.1.4 H5製作過程 166
10.2 長圖類H5-線下活動案例 176
10.2.1 項目素材 176
10.2.2 項目主題與內容框架 176
10.2.3 H5原型與設計思路 178
10.2.4 H5製作過程 179
10.3 數據類H5-模擬案例 186
10.3.1 項目素材（模擬案例） 186
10.3.2 項目主題與內容框架 186
10.3.3 H5原型和設計構思 188
10.3.4 H5製作過程 189
10.4 功能類H5-模版案例 197
10.4.1 投票模版類H5設計 197
10.4.2 抽獎模版類H5設計 204
10.4.3 小遊戲模版類H5設計 209
第 11章 H5的進階學習 215
11.1 普通級H5與專業級H5的差別 216
11.2 H5的更多可能性 217
11.3 專業級H5工具推薦 220
11.3.1 可製作專業級H5的工具 220
11.3.2 工具的幾個關鍵點 220
