第1章 认识H5与广告 4
1.1 传统广告怎么了？ 4
聊点传统广告的事儿 4
传统广告如今还是行业大佬么？ 6
那么，传统广告会被打败么？ 8
1.2 H5究竟是什么？ 10
“H5=HTML5”是否可以成立？ 12
“H5＝微信网页”是否可以成立？ 13
“H5＝移动PPT\APP”又是否可以成立？ 14
那么H5究竟是什么？ 15
了解定义的作用 17
1.3 H5与未来数码设计 18
超媒体是什么？ 19
那么超媒体的“非线性”又是什么样子？ 21
超媒体的具体特征 22
超媒体实现的4个条件 23
H5是超媒体么？ 25
1.4 一个水果的比喻，让你认识H5的优势 27
水果是否有营养价值 27
水果是否新鲜，好吃 28
水果的成熟周期 30
水果是否物美价廉 32
第2章 设计流程与规范技巧 32
2.1 H5的设计流程 36
目前H5在设计方法上可以笼统地划分为三大类型 36
了解需求，选好方向 38
确定表现形式 40
设计表现 42
开发执行阶段 43
数据总结分析 45
2.2 H5常用设计工具箱 48
H5设计师使用工具 48
H5动效展示工具 51
H5设计生成工具 53
H5常用辅助设计工具 57
2.3 H5页面尺寸设计注意事项 58
第3章 H5的设计方法 58
3.1 认识H5的原型图 66
什么是原型图 66
H5的原型图 67
H5原型图应具备的因素 70
原型图存在的作用 72
3.2 把握好H5设计的表现力 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，我们可以实现哪些动效？ 139
动效在H5的一些实际运用 146
3.6 H5的声效设计 154
你一直在忽略声音 154
声音的3个类别 156
H5的背景音效 157
H5的辅助音效 164
一些采样常识 166
第4章 H5的精品案例 176
精品案例4.1 大众点评—我们之间就一个字 176
精品案例4.2 LPI—梦幻H5 189
精品案例4.3 寻龙诀一起来寻龙摸金，活蒸大粽子 202
精品案例4.4 腾讯游戏—众粉丝哭倒？吴亦凡圆寸疑为入伍做准备 214
精品案例4.5 阿迪达斯—罗斯绝不凋零 228
精品案例4.6 大众点评—你一身的渴望，我们从头开始满足你！ 239
工具类精品案例4.7 工具类精品案例—手机有话对你说 252
第5章 H5的内容访谈鱼脸互动 265
Fish Face专访内容（节选） 265
UID WORKS专访内容（节选） 268
LxU专访内容（节选） 270
LPI良品互动专访内容（节选） 272
W上海专访内容（节选） 274
腾讯TGideas专访内容（节选） 278
搜狐新闻专访内容 280
万达集团专访内容 283
iH5专访内容 286
甲本专访内容 290
致谢 293