体验了100多个H5，总结出这份最全H5分类！(附50+案例资料)
体验了100+个H5，我从类型和内容两方面总结出这份最全H5分类！不懂技术的瓶子酱，分类依据全凭个人经验，不一定科学，但值得参考借鉴，给大家一些创意灵感启发。
前几天腾讯团队又推出了一款刷屏的H5，腾讯动漫APP的“薛之谦史上最疯狂的广告”，这款H5集人气“段子手”薛之谦和动漫二次元元素以及炫酷的H5技术于一体，一经推出就迅速刷爆业内人士及薛之谦粉的朋友圈。
点击查看案例：http://www.digitaling.com/projects/19655.html
只是在刷屏之后再去看就会发现，其实这款看似“狂拽炫酷叼炸天”的H5是一个“下拉触发视频播放+隐藏了视频进度条+竖型显示”的视频H5。
与其说它是一款H5，不如说它是一支创意TVC更恰当，只是这支TVC的投放载体从传统的视频网站渠道改为了“搭载到H5上”，在微信朋友圈传播。
自从H5在朋友圈流传开来，从最初的围住神经猫、别踩白块等H5小游戏，到后来刷屏的陌生人来电、吴亦凡入伍，再到今年火爆的“腾讯NEXT IDEA ×故宫：穿越故宫来看你”、韩寒说唱H5和薛之谦最疯狂广告，H5的内容和形式特点也在逐步发现变化。
瓶子酱翻查了100多个H5，从中总结出了一些规律，下文将以其中最具代表性的H5作为示例进行简单说明。
一、H5分类:以类型划分
抛开H5的具体内容创意，单看其表现形式，可以粗略分为以下5种。
1、技术型H5
“技术型H5”的定义也许不够精准和恰当，这只是瓶子酱为了便于说明而取的，意思是那些以技术优势取胜、运用炫酷的技术作为卖点的H5。技术流的H5因运用技术的不同，还可以细分为以下几种。
（1）全景/VR
（2）3D
（3）重力感应
（4）双屏互动
为了更好地理解瓶子酱的划分，先简单解释一下3D、全景、VR的概念。
3D即三维，长、宽、高三个坐标维度，换句话说，3D就是立体的、空间的概念。
全景又被称为3D实景，把相机环360度拍摄的一组或多组照片拼接成一个全景图像（把三维图片模拟成真实物体的三维效果图），浏览者可以拖拽从不同的角度浏览真实物体的效果。
广义的全景分为虚拟现实（VR）和3D实景两种，VR是利用计算机软件制作出来的模拟现实的场景，3D实景是利用相机拍摄实景照片，经过特殊处理制作成的现实场景。
（1）全景/VR型
随着H5技术的日渐成熟和发展，全景/VR型H5成为行业流行趋势之一，最近刷屏的这类H5有今年双11前的天猫“穿越宇宙的邀请函”。
点击查看案例：http://www.digitaling.com/projects/19272.html
这支虚拟的宇宙全景H5非常炫酷，画面的立体感很强，滑动拖拽可控制环视方向，可左可右可近可远，是典型的全景/VR类H5。
除了天猫双11的宇宙邀请函，淘宝造物节邀请函、本田的2016广州车展线上VR展厅、有道云笔记的星际探索之旅等也都是全景/VR类的H5。
扫描二维码，立即体验！（数英网 App 用户需点击放大二维码后，长按识别）
（2）3D型
3D型的H5是在全景H5流行之前火爆了一段时间的三维立体画面H5，即将原来的二维图片、文字换成三维的立体形象制作的H5。
这种H5比现在流行的全景/VR类H5要“低级”一些，画面的炫酷感也弱一些，但比起其他的二维画面H5还是更酷。
点击查看案例：http://www.digitaling.com/projects/14604.html
3D型H5的代表有“杜蕾斯美术馆”、“Nike：每双球鞋都有一个故事”、百度钱包“百付宝邀请函”等。
点击查看案例：http://www.digitaling.com/projects/15214.html
（3）重力感应型
重力感应是指通过对力敏感的传感器，感受手机在变换姿势时，重心的变化，使手机光标变化位置从而实现选择的功能。
应用重力感应的手机游戏很多，比如我们熟悉的一些赛车类的游戏，可以通过左右倾斜手机实现方向改变。现在也有不少H5结合这一技术功能，在H5中加入了重力感应互动，使H5的可玩性和趣味性大大提高。
这类H5的典型案例是Juice Up的“你敢在办公室瘦吗？”，拿着手机跟着H5画面做相应运动即可点亮图标，最后还可以用手机倒一杯果汁分享给好友。（这是瓶子酱觉得可玩性最高的一支H5）
扫描二维码，立即体验！（数英网 App 用户需点击放大二维码后，长按识别）
伊利的H5“为最爱的Ta倒一杯好奶”在最后一步也应用了重力感应——倾斜手机，H5画面上即倒一杯牛奶。
扫描二维码，立即体验！（数英网 App 用户需点击放大二维码后，长按识别）
（4）双屏互动型
技术流派H5最后一类是双屏互动型，即两部手机通过扫码等方式实现一起互动。
典型案例有杜蕾斯五一劳动节的“双屏互动定制动动节避孕套”H5。两人一起摇手机，生成一组词，定制套套。
点击查看案例：http://www.digitaling.com/projects/14340.html
Kappa在2015年春节期间推出的“天生一对”H5也利用了双屏互动，两人一起玩这支H5即可生成一副对联。
点击查看案例：http://www.digitaling.com/projects/13724.html
二、视频型H5
除了技术型的H5，现在最火爆的当属视频型H5，文章开篇说的薛之谦广告就属此类。
最初刷屏的视频型H5是宝马的“该新闻已被BMW M2快速删除”——
点击查看案例：http://www.digitaling.com/projects/17261.html
后来腾讯旗下团队先后制作的“穿越故宫来看你（大明皇帝除了会唱Rap，还能有多魔性？）”、“使命召唤Online韩寒代言说唱H5”、“腾讯视频x咪蒙：好时光是做爱做的事”等都是视频型H5。
点击查看案例：http://www.digitaling.com/projects/19315.html
点击查看案例：http://www.digitaling.com/projects/19425.html
无一例外，这几支视频型H5都是刷屏的爆款，当然这其中不乏腾讯团队的推动作用，不过确实也有视频型H5令人惊艳的缘故。
三、场景型H5
在技术型和视频型H5流行之前，最热门的H5当属场景型H5，即营造某种特定场景的H5。这类H5又可以分为陌生人来电型、某人/品牌朋友圈型和模仿报纸型。
（1）陌生人来电场景
说起H5，大家一定还记得当时刷屏的“这个陌生来电你敢接吗？”以及“吴亦凡疑似入伍”。
点击查看案例：http://www.digitaling.com/projects/14521.html
点击查看案例：http://www.digitaling.com/projects/15349.html
这两支H5分别是福斯点评和TGideas（TG即Tencent Games，腾讯游戏）推出的，两支H5中都使用了“模拟来电/视频”的场景。
（2）某人/某品牌 朋友圈场景
模仿某人或某品牌朋友圈的H5也十分普遍，这类H5的特点是模仿朋友圈/聊天场景，进行内容呈现。
典型案例有“《小时代4》：时代姐妹花，邀你来撕逼”、“本田丰范：薛之谦的朋友圈”、“欧莱雅的明星朋友圈”等。
点击查看案例：http://www.digitaling.com/projects/18516.html
（3）模仿报纸场景
还有一类模仿报纸的H5也可以算作是场景型H5，即整个H5是模仿某种经典报纸形象展现的。
这类H5出名的有支付宝之前推出的模仿哈利波特中魔法报纸的支付宝《太误事报》、京东的《社会主义建设成果大字报》、淘宝x今日头条的《万能邮报》和中国平安的《第一财惊周刊》等。
点击查看案例：http://www.digitaling.com/projects/15039.html
点击查看案例：http://www.digitaling.com/projects/16183.html
四、游戏互动型H5
游戏型的H5有测试题、选择题类的，也有动作游戏类的。
最初流行的围住神经猫和别踩白块等小游戏都属于动作游戏类H5。里约奥运会期间，网易推出的画小人H5、泳池大乱斗H5等也属此类。
点击查看案例：http://www.digitaling.com/projects/18445.html
测试题类的游戏型H5，比如凤凰资讯曾推出的“星战这些梗你接得住吗？”其中利用星球大战电影的知识形成题目，让网友参与互动答题。
点击查看案例：http://www.digitaling.com/projects/16381.html
五、纯信息展示型H5
技术型、视频型、场景型、游戏型H5之外，还有最常见、最普通的信息展示型H5，即什么特别形式都没有采用，只是简单的图文H5。这类H5中最出名的当属福斯点评的“我们之间就一个字”。
点击查看案例：http://www.digitaling.com/projects/13596.html
这支H5利用单纯的字体设计和gif作为内容，最后还形成了小规模的刷屏，实属不易。
二、H5分类：以内容划分
撇开表现形式，从各种热门H5的内容来看，也可以总结出以下五个常见内容分类。
（1）IP型
（2）节日型
（3）热点型
（4）情感型
（5）测试型
以节日和热点为内容的H5很好理解，无论是传统的端午、中秋、春节，还是醒醒的情人节、圣诞节，每一次节日到来都会有很多H5应时而生；对于热点事件也是如此，比如奥运会期间各大品牌推出的各类奥运相关H5。
情感型H5是指以情动人，打情感牌的H5。除了亲情、友情、爱情之外，还有一些利用怀旧元素制作的H5。比如京东的“妈妈再打我一次”H5和百度钱包的“出来种太阳，迟早要还的”H5。
测试型H5是指以性格测试、新年签等测试类小游戏为主的H5，由于微信平台的监管，现在这类H5已经不多见了。
从H5的内容来看，瓶子酱最想说的是IP型H5。这类H5内容丰富，且创意源泉取之不尽。
（1）古代IP
（2）影视剧IP
（3）游戏IP
（4）国外艺术文化IP
……
以古代IP为内容载体的H5最多使用的是故宫、皇帝类IP的，比如腾讯的“穿越故宫来看你”、华为荣耀的“老佛爷圆明园直播”、小米的“如果清朝有手机”。
点击查看案例：http://www.digitaling.com/projects/18026.html
此外，孔子、李白等文化名人，西游记、红楼梦等四大名著，财神、鬼怪等神话人物也是热门H5常用的古代IP元素。
敲黑板！民国人物、诸子百家等古代IP内容还没有人用过，以后在构思时可以考虑一下！
除了古代IP，影视剧和游戏IP也是热门H5常用的内容，比如百度地图的“护路娃”（葫芦娃）H5，in x大鱼海棠的“大鱼海棠奇遇记”，福斯点评的“拼出你爱的魔兽”以及腾讯游戏的“我的魔兽我主演”H5等。
点击查看案例：http://www.digitaling.com/projects/17765.html
当然，国内的IP内容可用，国外的艺术文化IP也可以用，例如上海米兰国际家居展推出的“意大利名流沙龙”H5就是用了国外名画名人元素。
点击查看案例：http://www.digitaling.com/projects/19579.html
除了瓶子酱上述提到的这些，还有很多品牌以明星名人为内容元素制作的H5同样十分受欢迎，毕竟明星名人自带光环，有海量粉丝关注，前面提到的吴亦凡、韩寒和薛之谦H5皆是如此。
很多优质的刷屏H5都融合了以上分类中的多个元素，最典型的莫过于腾讯NEXT IDEA的“穿越故宫来看你”。它既是一款视频型H5，又营造了皇帝朋友圈、皇帝后妃聊天群等场景，同时在内容上采用的是故宫和皇帝IP。
作为不懂技术的策划，本文完全基于瓶子酱在日常接触和观察的近百个H5后总结的经验，这些分类有交叉重合，也不够全面和严谨，但是对于需要构思H5的朋友会有一定的启发作用。
【壹便士】微信公众号，ID：vpenny关注后，后台回复瓶子酱，加个人微信
