本書會從廣告行業(yè)背景說起, 讓讀者了解H5廣告的來龍去脈, 并且學會快速的運用工具制作H5廣告, 包括一些必要的設計方式和規(guī)范, 同時引導受眾不要盲目跟風, 客觀和理性的使用H5廣告。
小呆的公眾號,已是H5業(yè)界內容的風向標。鑒于H5突出的互動特性,我們意識到平媒根本無法滿足其對創(chuàng)意、技術、動效、聲效的解讀,于是我們設計了圖書網站,并在書中植入大量二維碼作為連接;使得公眾號、圖書網站、紙質書三者形成互補關系,滿足了內容演示、更新、互動的多重功能,這在國內是難得的創(chuàng)新;H5本身還帶有技術、設計、藝術、廣告、營銷等多重屬性,所以,對于在職讀者來說,需要了解大量信息和業(yè)界動態(tài),才能在H5領域游刃有余,這些信息又往往非常凌亂和不系統(tǒng)。作者在本書不僅總結了系統(tǒng)的方法論,還為讀者提供了實時更新的內容社群,可以說,你買到的不是一本,你買到的是一套會升級的行業(yè)寶庫!
01 認識H5與廣告
1.1 傳統(tǒng)廣告怎么了?\ 4
聊點傳統(tǒng)廣告的事兒 \ 4
傳統(tǒng)廣告如今還是行業(yè)大佬么? \ 6
那么,傳統(tǒng)廣告會被打敗么? \ 8
1.2 H5究竟是什么? \ 10
“H5=HTML5”是否可以成立? \ 12
“H5=微信網頁”是否可以成立? \ 13
“H5=移動PPT\APP”又是否可以成立? \ 14
那么H5究竟是什么? \ 15
了解定義的作用 \ 17
1.3 H5與未來數碼設計\ 18
超媒體是什么? \ 19
那么超媒體的 “非線性” 又是什么樣子? \ 21
超媒體的具體特征 \ 22
超媒體實現(xiàn)的4個條件 \ 23
H5是超媒體么? \ 25
1.4 一個水果的比喻,讓你認識H5的優(yōu)勢\ 27
水果是否有營養(yǎng)價值 \ 27
水果是否新鮮,好吃 \ 28
水果的成熟周期 \ 30
水果是否物美價廉 \ 32
02 設計流程與規(guī)范技巧
2.1 H5 的設計流程 \ 36
目前H5 在設計方法上可以籠統(tǒng)地劃分為三大類型 \ 36
了解需求,選好方向 \ 38
確定表現(xiàn)形式 \ 40
設計表現(xiàn) \ 42
開發(fā)執(zhí)行階段 \ 43
數據總結分析 \ 45
2.2 H5 常用設計工具箱 \ 48
H5 設計師使用工具 \ 48
H5 動效展示工具 \ 51
H5 設計生成工具 \ 53
H5 常用輔助設計工具 \ 57
2.3 H5 頁面尺寸設計注意事項 \ 58
03 H5 的設計方法
3.1 認識H5 的原型圖 \ 66
什么是原型圖 \ 66
H5 的原型圖 \ 67
H5 原型圖應具備的因素 \ 70
原型圖存在的作用 \ 72
3.2 把握好H5 設計的表現(xiàn)力 \ 73
視覺氣氛(傳遞情感) \ 73
形式感(打動用戶的重要方法) \ 79
參與感(H5 設計的爆點) \ 82
3.3 H5 頁面的版式設計要領 \ 86
H5 與平面設計的版式到底哪里不同? \ 86
要如何應對H5 版面設計? \ 89
3.4 H5 的文字設計 \ 103
設計師!你需要重新認識文字 \ 103
改變你的排版習慣 \ 112
H5 的標題設計 \ 115
3.5 H5 的動效設計 \ 124
關于動效,你要清楚一些事情 \ 124
在H5 ,我們可以實現(xiàn)哪些動效? \ 139
動效在H5 的一些實際運用 \ 146
3.6 H5 的聲效設計 \ 154
你一直在忽略聲音 \ 154
聲音的3 個類別 \ 156
H5 的背景音效 \ 157
H5 的輔助音效 \ 164
一些采樣常識 \ 166
04 H5 的精品案例
精品案例 4.1 大眾點評—我們之間就一個字 \ 176
精品案例 4.2 LPI—夢幻H5 \ 189
精品案例 4.3 尋龍訣一起來尋龍摸金,活蒸大粽子 \ 202
精品案例 4.4 騰訊游戲—眾粉絲哭倒?吳亦凡圓寸疑為入伍做準備 \ 214
精品案例 4.5 阿迪達斯—羅斯絕不凋零 \ 228
精品案例 4.6 大眾點評—你一身的渴望,我們從頭開始滿足你! \ 239
工具類精品案例 4.7 工具類精品案例—手機有話對你說 \ 252
05 H5 的內容訪談
魚臉互動Fish Face 專訪內容(節(jié)選)\ 265
UID WORKS 專訪內容(節(jié)選)\ 268
LxU 專訪內容(節(jié)選)\ 270
LPI 良品互動 專訪內容(節(jié)選)\ 272
W 上海 專訪內容(節(jié)選)\ 274
騰訊TGideas 專訪內容(節(jié)選)\ 278
搜狐新聞 專訪內容\ 280
萬達集團 專訪內容\ 283
iH5 專訪內容\ 286
甲本 專訪內容\ 290
致謝/ 293