2017年爆款刷屏H5案例,入选的竟是他们…

原创 1 收藏 评论
举报 2017-12-24

来源:型科科技(公众号ID:xingkec)
 作者:兔纸

距离2018还有7天

元旦假期又更近了一步

在期待放假的同时

你的年度总结写好了吗?

今天小编盘点了15个2017年的刷屏案例,看看都有哪些超级爆款H5,你能想到的刷屏H5又有哪些?一起来盘点一下吧!


H5排名以时间为序:

1月

案例1:淘宝年货节

图文展示类

品牌主:阿里巴巴 - 淘宝

长按扫描(复制链接需打开淘宝查看)

亮点:阿里祭出的H5开年大戏「淘宝年货大街」,将过年氛围引入清明上河图中呈现,新颖的展现形式也是大家刷屏的原因之一。H5画面整体有种魔性美,内容丰富。进入页面后,画面会自动慢慢向下移动展示内容,背景是街上店家吆喝声,带入感十足。用户也可以上下滑动屏幕来查看。滑动完毕停留在某处时,会出现一个个小的闪动弹出层,简单介绍当前画面中的各店铺,用户点击店铺会有大的弹出层跳出,来详细介绍,最后可“关注”,也可以“进店逛逛”。


2月

案例2:首个手机话剧团开张了

交互视频类

品牌主:阿里 天猫

长按扫描立即体验

亮点:这是一支脑洞清奇画风更清奇的H5,以话剧的形式,将身体的不同部分拟人化,通过讲述故事的方式,用诙谐的语言表达出无忧购的各种亮点,很耐看。 果不其然,此视频类H5刚上线就在广告圈火了;用视频类内嵌的方式,话剧团的神秘感与观者的代入感皆为十分!话剧部分,超级魔性、逗比,演员很有表现力,场景就直接在器官里,视觉冲击感很强。整个H5制作精良,形式新颖,体验时间长却很有吸引力。


案例3:向天再要500话

视频类

品牌主:腾讯动漫

长按扫描立即体验

亮点:以“腾讯动漫催更神曲”为主题,用H5嵌入视频的形式,用歌剧来讲一个“动漫编辑被催做神梦”的故事。画面很美很有想象力,故事跌宕起伏,很有创造力。用搞笑及魔性的视频故事性呈现,来进行品牌营销,不仅引发刷屏还吸引用户广泛传播。


3月

案例4:穿过手机屏幕,去看我的国

图文展示类

品牌主:搜狐

穿过手机屏幕,去看我的国02.gif

 

长按扫描立即体验

亮点:案例模拟搜狐App首页面展开,结合当时全国人大五次会议的热点,从而引发刷屏。击Banner页进入,使用画中画一镜到底的方式,对交互体验加以创新,中间还还使用了横屏滑动,纵向滑动多种交互方式融于H5体验之内。通过不同的画面反应不同阶层的中国人现状,通过交互手势设计将众多的画面构成一镜到底的场景!策划、视觉、交互、声乐俱佳。


5月

案例5:地球上最美的H5

3D展示+视频

品牌主:腾讯

Uploads-2017-05-23-5923bafd3015d.gif

test.png

长按扫描立即体验

亮点:深色太空背景,背景中有星星不停闪烁,地球模型表面还浮着一层云,用户可360度无死角拨动旋转欣赏地球之美,通过上下左右滑动来控制地球的转动。“地球”上设有5处景点,长按按钮时,圆圈会自动对准景点,屏幕上方出现经纬度坐标,画面会由一段过场动画,“到达”该景点,并以短视频的形式展示景点,松开按钮则返回主界面。H5在视觉上,它的运动与地球的运动有视差效果,这让本身就很精致的画面,表现得更加细腻。转动时环境声音的播放和转换,让案例代入感十足,画面表现很精美,3D模型与视频的结合也让案例充满了活力。


6月

案例6:魂斗罗归来

视频类

品牌主:腾讯游戏


长按扫描立即体验

亮点:魂斗罗归来,重燃英雄梦!以魂斗罗主角的身份进入游戏,像素风格 + 3D类型,途中碰到各个boss以及以前战友(微信好友,自动调取头像及昵称)有趣的对话以及搞笑的死法,像素画的方式复刻出经典魂斗罗六个关卡场景,每个场景代入一位好友花式作死,各种玩家才懂的梗穿插其中。带着主角等人进入新的魂斗罗世界,每个人物都讲述了新魂斗罗的优势与可玩点,末页回归点明主题,可跳转下载链接以及再看一遍。


7月

案例7:穿上军装

上传照片类

品牌主:穿上军装

长按扫描立即体验

亮点:一直刷屏了很久的一款H5,建军90周年。踩90周年大阅兵热点,让用户上传照片,利用人脸识别技术,生成属于用户的不同年代的军装照片,并引导用户分享出去。简单易操作的方式,加上接地气、圆军装梦、传递爱国热情等多重因素的叠加,又节日热点又抓得刚刚好,从而造就了这支H5的成功。


案例8:世界名画抖抖抖起来了

动画+短视频类

品牌主:抖音


长按扫描立即体验

亮点:抖音这次恶搞世界名画,实现了一种年轻品牌与传统文化IP的碰撞。名画梗其实已经被玩过很多次,但这一波“动起来”的嘻哈效果,还是引起了朋友圈的刷屏。案例加载完成后是蒙娜丽莎神秘的微笑,搭配着魔性的背景音乐,抖动的标题吸引人去"一探究竟",长按随机选择不同的名画进行体验。用户交互部分,黑灰墙纸作为画面背景,而播放视频时,视频模拟了抖音App的界面,H5也为四幅名画的行为动态赋予了抖音APP的专属特色。


案例9:飞跃淘宝奇市

动画+3D视频

品牌主:淘宝

0.gif

(案例已下线)

亮点:淘宝造物节主题之“飞越淘宝奇市”,通过一支风筝穿越的时空的方式,进行展现造物节的丰富。用交互动画+3D建模视频来完成体验VR视觉,一共四个场景,每个场景串场动画为一只风筝穿梭于五彩斑斓的时光隧道,进入奇市江湖 4 大街区系列的3D品牌视频展示。利用重力感应来完成交互,然后播放东、西、南、北四个方位进入的3D视角视频。淘宝又一次在H5上,做了一次单点爆破,奉上了一场视觉和创意都兼具的奇观。


8月

案例10:一起享受嘻哈小食光吧!

视频+双屏互动

品牌主:麦当劳

微信图片_20171219235149.gif

(已下线)

亮点:结合当时超火爆的综艺节目《中国有嘻哈》。使得这款炫酷的多屏互动H5的案例刷爆了屏。一个可单人又可多人都可以体验的H5,单人体验时,用户手滑过屏幕,会有颜色跟着手势变化。而多人体验时的上限是3个设备,3个设备并排浏览可以看到完整的动画播放。整体效果非常炫酷,还将《中国有嘻哈》元素与麦当劳自身产品元素相结合。


案例11:“小朋友”画廊

插画+公益类

品牌主:腾讯公益

长按扫描立即体验

亮点:来自腾讯公益的1元购公益画。腾讯公益与一起爱为帮助“小朋友”乐享之旅而制一款H5案例,采用带有浅浅涂鸦的灰白纸张做背景,里面展现的画作有抽象风、卡通风等等,H5呈现的是“小朋友”作品展示,用户左右滑动屏幕来选择喜欢的作品;每张画作均可去聆听作者心声,使这支H5内容更加的饱满生动。


9月

案例12:找一找10年前你用的手机

海报生成类

品牌主:网易


长按扫描立即体验

亮点:网易严选出品的H5,结合iPhone8上线的时间点,发布这款H5,一上线,就引发刷屏。简单的展示性页面,选择十年前的手机,选择手机品牌后,会有详细的手机型号,选中后会有特定的手机铃音勾起你的回忆。


案例13:深夜男同事问我睡了吗

视频类

品牌主:有道翻译官

长按扫描立即体验

亮点:这支H5主要用了视频的方式,标题就极具诱导性《深夜,男同事问我睡了吗......》吸引人忍不住点开一探究竟。讲述戏精上身的女同事在同样戏多的姐妹群里上演一出关于男同事的内心剧,非常符合大众心理期许的对话和出乎意料的结果同样精彩。而决定它刷屏的最重要原因,还是因为表现形式。这种创新的手法也让用户对案例的主体和所要表达的意图有更加深刻的记忆。


11月

 案例14:双11“鬼故事”

视频展示类

品牌主:阿里巴巴

长按扫描立即体验

亮点:双十一特别版,图文版视频+声音,模拟通话场景。用了字幕叙述的风格来介绍人工智能设计师鲁班,同时内容也十分幽默搞怪,提高了用户的注意力和兴趣,从而达到良好的宣传效果的目的。


12月

案例15:寻找【梦想】的旅程

文字动画类

品牌主:网易云音乐

长按扫描立即体验

亮点:文字动画交互案例,长按屏幕任意地方向前走,点击屏幕任意地方向前跳。用户需要通过长按和点击的交互,控制文字“你”,来开始一段“寻找梦想的旅程”。H5除了触达内心的内容外,“寻找梦想的旅程”H5也通过 新的创新形式,为用户提供了不少 全新体验。在整个H5中,用户始终是深度参与的,这也是促使大家刷屏的原因。


小结:

纵观今年的刷屏案例,可以看出2017年的爆款H5中,它们都有一些相似的共同点,就是能够引起大众集体意识和共鸣,容易理解,传播方式简单。还有创造惊艳的体验感!无论是内容的短、快的,还是复杂化,繁琐的都能够让人感受到不一样的刺激和视觉上的非凡体验。当然,能够引刷屏的作品,背后隐含着非常多的因素,每一个好的作品,都值得肯定和学习。那么2018年将会有怎样的H5呈现出来呢,一起期待吧!

    评论

    文明发言,无意义评论将很快被删除,异常行为可能被禁言
    DIGITALING
    登录后参与评论

    评论

    文明发言,无意义评论将很快被删除,异常行为可能被禁言
    800

    推荐评论

    暂无评论哦,快来评论一下吧!

    全部评论(0条)