內容簡介
《H5移動行銷:活動策劃 設計製作 運營推廣 套用案例》共分12章,通過“兩條線”來幫助讀者快速成為H5行銷和運營高手。條是技巧學習線,對H5的學習入門、引流活動、行銷活動、製作工具、設計流程、開發技術、視覺風格、內容設計、運營技巧、行銷推廣、廣告和場景案例等進行了詳細的敘述,讓學習者一本在手精通H5的設計製作與行銷推廣。第二條是案例實戰線,該書通過160多個案例,對新媒體、汽車、電商、餐飲、網際網路、App、遊戲、房地產、音樂、數碼電子等多個經典案例進行了解讀,提供“一站式”行銷解決方案。 《H5移動行銷:活動策劃 設計製作 運營推廣 套用案例》結構清晰、語言簡潔,適合所有H5設計的學習者,特別是H5初級設計人員、H5網站設計的學習者、對H5移動行銷感興趣的普通用戶、傳統紙媒體設計師以及新媒體廣告美工等人員,同時也可以作為培訓中心、中職中專、高職高專等院校的輔導教材。
圖書目錄
第1 章 H5 學習入門:了解H5 的設計基礎 1
1.1 H5 七問:全面了解H5 2
1.1.1 H5 的概念 2
1.1.2 H5 行銷的概念4
1.1.3 H5 行銷的特點4
1.1.4 推廣H5 的原因 5
1.1.5 H5 與超媒體的關係7
1.1.6 H5 場景有利於行銷8
1.1.7 H5 行銷的潮流和方向 11
1.2 H5 五種類型:H5 的分類 14
1.2.1 信息展示型H5 14
1.2.2 動畫互動型H5 15
1.2.3 遊戲互動型H5 16
1.2.4 技術驅動型H5 19
1.2.5 場景模擬型H5 20
1.3 兩大界面:H5 的設計尺寸 24
1.3.1 iOS 設備主要螢幕解析度 25
1.3.2 Android 設備主要螢幕解析度 27
第2 章 H5 引流活動:為門店招徠大量顧客 29
2.1 線上線下:H5 的深入行銷 30
2.1.1 線下互動:鼓勵用戶線下二次消費 30
2.1.2 線下引流:輕鬆打造H5 引流利器 32
2.2 新客進店:H5 的吸粉能力 33
2.2.1 投票活動:吸引用戶,推廣品牌 33
2.2.2 紅包邀請函:立竿見影的引流效果 34
2.2.3 抽獎活動:帶動門店產品銷量增加 37
2.2.4 砍價預售活動:大幅增加線下引流 40
2.3 顧客留存:H5 的留客能力 42
2.3.1 優惠券活動:增加線下門店的熱度 42
2.3.2 H5 小遊戲:延長顧客線下消費時間 43
2.3.3 等位活動:用H5 活動減少等位流失 44
2.4 現場互動:H5 的互動能力 47
2.4.1 線下會展活動:吸引更多人流 47
2.4.2 會議現場活動:豐富會議環節 48
2.4.3 連續性現場活動:沉澱大量冬粉 49
2.5 分享傳播:H5 的傳播能力 50
2.5.1 禮品活動:顧客贏福利,門店得利潤 50
2.5.2 裂變紅包:消費者推薦好友送紅包 51
2.5.3 分享後抽獎:快速擴散門店促銷訊息 53
第3 章 H5 行銷活動:為品牌擴大知名度 55
3.1 微信吸粉:H5 的裂變式傳播56
3.1.1 強制關註:簡單高效暴力吸粉 56
3.1.2 裂變增長:分享活動快速吸粉 58
3.1.3 保持互動:有效增強冬粉黏性 64
3.2 品牌引流:輕鬆打造流行品牌 68
3.2.1 H5 模板:讓引流變得更加簡單 69
3.2.2 自定義兌獎碼:讓引流更具吸引力 71
3.2.3 聯繫客服,通過激勵用戶引流 71
3.3 品牌推廣:全面傳達品牌調性 72
3.3.1 VR 全景+紅包:瞬間提高品牌知名度 72
3.3.2 語音紅包:迅速打響品牌標語 75
3.3.3 植入廣告:全方位地擴散品牌 75
3.4 品牌認同:提高顧客品牌認知度 77
3.4.1 答題紅包:讓用戶了解品牌知識 77
3.4.2 品牌調性:用H5 打響品牌知名度 78
3.4.3 線上傳播:讓品牌深入人心 79
3.5 品牌維護:鞏固品牌市場地位 79
3.5.1 品牌促銷:有效提高品牌口碑 79
3.5.2 日常維護:增加品牌曝光度 80
第4 章 H5 製作工具:移動H5 的設計與製作 81
4.1 設計方法:3 種途徑設計H5 頁面 82
4.2 元素設計:H5 的圖形、圖像、影音 83
4.2.1 Adobe Photoshop:強大的綜合套用軟體83
4.2.2 Adobe Illustrator:便於線框圖的繪製84
4.2.3 Sketch:矢量圖設計工具 85
4.2.4 Adobe After Effects:圖形視頻處理軟體85
4.2.5 CINEMA 4D:製作酷炫的3D 效果 86
4.2.6 Final Cut Pro:進行後期製作86
4.2.7 Garage Band:數碼音樂創作軟體 86
4.3 動畫設計:為H5 製作吸人眼球的動畫 87
4.3.1 Keynote:設計吸引人的PPT 87
4.3.2 HYPE:做出悅目的動畫效果 88
4.4 技術實現:H5 的定製與開發88
4.4.1 FWA:設計領域的前沿標桿88
4.4.2 W3school:學習H5 的基本代碼知識 89
4.5 快速套用:提供H5 模板的各大平台 90
4.5.1 人人秀:快速上手製作H5 90
4.5.2 易企秀:海量的H5 場景模板 93
4.5.3 兔展:專注H5 技術實現 95
4.5.4 MAKA:簡單強大的線上創作平台 97
4.5.5 初頁:音樂照片情感工具98
4.6 創意設計:靈活進行H5 開發 99
4.6.1 互動大師:線上編輯互動內容 99
4.6.2 意派Epub 360:專業的H5設計功能101
4.7 組合使用:選擇H5 的工具組合形式 103
4.7.1 開發類H5 的工具選擇 103
4.7.2 網站類H5 的工具選擇 104
4.8 省時省力:H5 設計常用的輔助工具 104
4.8.1 格式工廠:音頻視頻的格式轉換104
4.8.2 PS Play:手機端的PS 瀏覽工具105
4.8.3 tinypng.com:壓縮過大圖片檔案105
4.8.4 草料:生成二維碼 106
第5 章 H5 設計流程:移動H5 的策劃與開發 107
5.1 前期準備:讓H5 設計行銷有備無患 108
5.1.1 定目標:精準定位用戶 108
5.1.2 找熱點:進行火爆行銷 109
5.1.3 寫策劃:全面把握H5110
5.2 程式設計:製作精美吸睛的H5 111
5.2.1 選擇模板:快速製作H5 作品 112
5.2.2 互動設計:讓用戶參與互動 113
5.2.3 視覺設計:讓H5 頁面錦上添花115
5.3 測試分析:H5 的升華與完善 120
5.3.1 程式測試:及時完善H5121
5.3.2 活動上線:快速推廣H5122
5.3.3 效果分析:分析行銷效果 123
第6 章 H5 開發技術:移動H5 熱門開發技術 127
6.1 “黑科技”:讓H5 人氣爆炸 128
6.1.1 720 度全景:展現三維立體空間感 128
6.1.2 3D 旋轉:讓H5 畫面更具動感128
6.1.3 人臉識別:實現H5 趣味行銷129
6.1.4 物理引擎:創建一個虛擬世界130
6.1.5 重力感應:提升用戶互動體驗131
6.1.6 手指跟隨:產生幻燈片效果132
6.2 H5 AR/VR/AI:多種手段全新體驗 133
6.2.1 AR 技術:實現線上、線下相結合 133
6.2.2 VR 技術:生成虛擬動態場景134
6.2.3 AI 技術:讓H5 擁有人工智慧135
6.3 技術運用:展現酷炫H5 畫面 138
6.3.1 快閃視頻:讓你的H5更吸睛 138
6.3.2 粒子特效:讓你的H5更酷炫 139
6.3.3 視頻互動:更好地展示品牌形象141
6.3.4 多屏互動:輕鬆打造互娛模式142
6.3.5 GIF 動畫:讓你的頁面栩栩如生142
第7 章 H5 視覺風格:移動H5 視覺風格設計 145
7.1 五大原則:H5 設計的精髓要點 146
7.1.1 設計原則:多創意,少抄襲 146
7.1.2 設計風格:H5 的風格要統一147
7.1.3 H5 原型圖:繪製與構思方法148
7.1.4 視覺氛圍:著眼於情感傳遞149
7.1.5 真實體驗:讓用戶身臨其境150
7.2 12 種風格:H5 設計的不二之選 151
7.2.1 扁平視覺風格設計 151
7.2.2 插畫視覺風格設計 152
7.2.3 手繪視覺風格設計 152
7.2.4 動漫視覺風格設計 152
7.2.5 水墨視覺風格設計 154
7.2.6 復古視覺風格設計 155
7.2.7 寫實視覺風格設計 155
7.2.8 科技視覺風格設計 156
7.2.9 極簡視覺風格設計 157
7.2.10 拼貼視覺風格設計 157
7.2.11 攝影視覺風格設計158
7.2.12 小清新視覺風格設計159
7.3 6 種表現手法:H5 設計的視覺特效 160
7.3.1 來電特效:使H5 頁面更加真實160
7.3.2 擦除特效:讓H5 頁面充滿神秘163
7.3.3 動畫特效:讓H5 頁面妙趣橫生163
7.3.4 SVG 特效:讓H5 更加靈活 164
7.3.5 拍立得特效:使H5 互動性更強165
7.3.6 碎玻璃特效:讓H5 頁面更加酷炫166
第8 章 H5 內容設計:打造爆品的不二法門 167
8.1 版式設計:帶來絕佳視覺體驗168
8.1.1 視覺動線:合理布局,減少疲勞168
8.1.2 畫面焦點:著重突出行銷重點168
8.1.3 頁面層級:主次分明,井然有序169
8.2 活動設計:吸引用戶的有力形式 170
8.2.1 砍價活動:裂變式引爆產品熱度170
8.2.2 抽獎活動:吸引更多用戶參與172
8.2.3 問卷調查:及時收集用戶反饋172
8.2.4 投票活動:拉票機制,快速吸粉174
8.2.5 卡券活動:更好地進行推廣促銷175
8.3 動效設計:讓用戶產生濃厚的興趣 176
8.3.1 動效設計知識:事先了解,有備無患176
8.3.2 動效設計:主要類型和實現方法177
8.3.3 轉場動效:承上啟下,切換效果178
8.3.4 內容類動效:展現豐富多彩的內容178
8.3.5 輔助性動效:有效提升H5趣味性 179
8.3.6 功能性動效:引導用戶的操作179
8.4 音效設計:塑造氛圍,感受真實 180
8.4.1 重要性:為用戶帶來沉浸式體驗180
8.4.2 注意事項:確保聲音為內容服務181
8.4.3 音效選擇:與畫面相輔相成 181
8.4.4 音效分類:常見的3 種H5音效182
8.4.5 如何獲取:4 個有效的採集方法182
8.5 互動設計:實現信息的有效傳播 183
8.5.1 彈幕評論:實時互動,營造火熱氛圍183
8.5.2 點擊觸發:深度參與,以求更好的行銷效果 184
8.5.3 互動遊戲:“蝴蝶效應”的行銷效果186
第9 章 H5 運營技巧:著眼於用戶做好行銷 191
9.1 五大思維:幫你做好H5 行銷 192
9.1.1 流量思維:大面積+多渠道 192
9.1.2 借勢思維:借勢每一個社會熱點193
9.1.3 獎勵思維:重賞之下,必有勇夫194
9.1.4 眾籌思維:一滴水匯聚成海洋195
9.1.5 生活思維:從民眾中來,到民眾中去 196
9.2 三點一線:引發共鳴,讓人動容 196
9.2.1 淚點:催人淚下,讓用戶記憶深刻197
9.2.2 痛點:戳中“痛點”,滿足用戶需求198
9.2.3 觸點:觸景生情,讓用戶為之動容199
9.2.4 故事線:增強H5 的代入感200
第10 章 H5 行銷推廣:實現有效的移動行銷 203
10.1 H5 +超級IP:讓H5 引爆文化核心 204
10.1.1 古文化大IP:使傳統文化煥發生機 204
10.1.2 人氣公知IP:速度吸引冬粉關注 205
10.1.3 人氣偶像IP:具有強大的號召力 205
10.2 流量渠道:高流量、高轉化、高回報 205
10.2.1 微信朋友圈:藉助社交為H5 吸粉205
10.2.2 微信群:精準推送行銷信息 205
10.2.3 微信好友:從身邊的人開始行銷 206
10.2.4 App:實現內容的跨界傳播 207
10.2.5 新媒體:實行“泛娛樂”戰略 208
10.2.6 二維碼:線上、線下,打通電商閉環 209
10.2.7 線下活動:針對小的用戶群體 210
10.3 專業推廣:精準靈活地鎖定用戶 210
10.3.1 戳中“痛點”:讓用戶衝動起來 211
10.3.2 數據:實現H5 的精準投放 211
10.3.3 微信設定:方便快速,實現一鍵投放 212
第11 章 H5 廣告案例:給用戶帶來全新體驗 213
11.1 產品推廣案例:有效實現變現 214
11.1.1 小米:MIUI 12.5 214
11.1.2 COCO 奶茶:啡行日記濾掛咖啡 215
11.1.3 凱迪拉克:XT4 燃戰G7公路 217
11.1.4 博士倫:裸感,仿若天生 219
11.1.5 穩捷One Touch:你有多久沒給爸媽打電話了220
11.1.6 UR:虛擬綠洲劇本殺 222
11.2 品牌宣傳案例:打響品牌名聲 223
11.2.1 中國平安:人生真相詩 224
11.2.2 網易雲音樂:遇見時光里的自己 225
11.2.3 咪咕圈圈醬:你有一封面試邀請函 227
11.2.4 餓了么:這是什麼神仙外賣 228
11.2.5 建發房產:湖悅江南,重構山水東方 229
第12 章 H5 場景案例,全新視角的全新思維 231
12.1 商業場景案例:現象級的刷屏事件 232
12.1.1 企業招聘:同學,還在等什麼?快上車 232
12.1.2 活動預熱:生活與你 一起升級 233
12.1.3 活動報名:在大唐,看未來 235
12.1.4 活動邀請函:關於未來空間的新物種集會即將啟幕,等你來玩 236
12.1.5 微商引流:驚!職場打工人揚眉吐氣的終極秘訣竟是238
12.2 生活場景案例:個性化記錄生活的美好 239
12.2.1 紀念相冊:青春紀念冊239
12.2.2 個人簡歷:畢業生求職簡歷 240
12.2.3 結婚請柬:清新簡約手繪婚禮邀請函241
12.2.4 節日賀卡:雙語包粽子242
12.2.5 情侶表白:你有一封情書待開 244
12.2.6 店鋪開業:盛大開業活動邀請函 245
12.2.7 公益活動:二十四節氣——驚蟄 246