最美H5 酷站欣赏 UI素材 专题 设计导航

两大门派七大绝招,高逼格H5要这样玩!

作为去年独领风骚的当红炸子鸡,H5经过一年的摸(ge)爬(zhong)滚(de)打(se),不仅没有过气,反而新招百出,玩出逆天新高度。TOP君一路追踪,拎出最酷炫的两大派别七种玩法,给您嘚啵嘚啵。

一、手机场景模拟派

首先登场的是手机场景模拟派。因为H5主要在移动端打开,所以涌现出了一大波“虚拟”手机功能的案例,企图以假乱真。具体玩法如下:

高逼格之手机场景模拟一:未接来电

早在两个月前,一个挑衅味十足的这个陌生来电你敢接吗?”H5就曾让无数小伙伴大跌眼镜。江湖味十足的“伙计们,他在这儿”“见鬼”“恶战一触即发”和酷炫的全黑背景让人以为错进了复仇者联盟游戏界面,逼真的砸屏效果出来后,相信无数误打误撞进来的小伙伴都慌张的不知道点哪个按钮。可到了最后,尼玛,最后居然定格在“大众点评19.9元《复仇者联盟2》看电影,底下还有个风火轮一样旋转的“立即抢票”。

项目:《大众点评:这个陌生来电你敢接吗? 移动网站》 

扫一扫,体验逼真砸屏

这种用未知来电开启画面将用户引入到与自己有关联的故事里,最后引出品牌广告的巧妙构思,从策划到画面设计到互动整个流程天衣无缝,TOP君只想大喊:谁做的,我给你跪了。

同一路数的,还有《爸爸去哪儿3》播出前夕推出的“一个神秘视频邀请,你敢接吗?”,这哥们玩儿得更狠,不只出特效,连视频都链接过来了。

高逼格之手机场景模拟二:朋友圈

说起微信朋友圈,相信各路看官都熟悉到骨子里,那可是每天刷个上百次,打发一切有聊无聊时间的地方。而戛纳电影节期间,脑洞大开的欧莱雅自己做了一个可以互动的朋友圈:进入需要进行微信登录,登录后,不仅可以透过欧莱雅的明星朋友圈看戛纳期间各路明星的动态,还可以点赞评论,十分逼真。纵然是见多识广的TOP君,当时都忍不住前去点了个赞。

项目《欧莱雅的明星朋友圈 移动网站
 

高逼格之手机场景模拟三:微信整蛊红包

当你打开微信,看到这样一幅”香艳“的画面,第一反应是什么?拆开!

binggo,可是,啊哦,拆开后,钱没领到,手机裂屏了,估计你要大呼“尼玛”了。

然而,这还没完,居然可以分享给好友,呵呵,我看到了你脸上的坏笑。就这样,今年愚人节前未来应用推出的”微信整蛊红包“火出新节奏。
据“始作俑者”未来应用提供的数据显示,这个案例在上线的一段时间后获得了800万UV/日的效果而且裂变效果惊人,直逼得微信把它”和谐’掉了。

二、技术派

除了很心机婊地制造手机使用场景来抓住低头党们的眼球,之所以说今年H5玩得高逼格,还因为它的技术水准不知道提升了几个level。

技术逼格升级一:全景三维空间

杜蕾斯开美术馆了,你造吗?不是买了多大的地皮,而是用全景三维空间技术打造了一个网上美术馆。设计点线面及飘渺的音乐渲染出绝对的艺术感,随着手机滑动,一间间三维立体、构思精巧的房间进入视野,走在里面,感觉天花板缓缓移动,时光静静流走。

项目:《杜蕾斯的第一座美术馆 移动网站》

这个H5应用重力感应技术、动画技术和全景技术,不论是技术执行,还是手机适配,难度都不是一般的大。

扫一扫,逛不一样的美术馆

技术逼格升级二:GIF和cinemagragh  

”爱就一个字,我只说一次。“额,跑偏了,TOP君其实想说的是W公司今年用GIF为大众点评推出的“我们之间就一个字”


 项目:《大众点评:我们之间就一个字 微信活动》 

是“金”字就要发光(还真得从黑色变成了金色);不管走多远,都不能忘了本心(看到本字中间正在跳跃的心脏,TOP君忍不住摸了下右心房),欠嘛,就要挨揍(看到欠字两角不停的炮弹攻击,TOP君觉得还是要管住这张嘴); 梦想就是希望之光在的地方(看到梦字中间不断闪烁的微光,有点小激动呢);过子,就要经风雨(看到不断被风雨洗礼的日”字“,TOP君风中凌乱)……最后多个笔画小蝌蚪找妈妈般化成的”聚“字差点成功逼出TOP君的眼泪。不用看下面的长文案,就能从gif动图中了解每个字的真谛,这种玩法,当真玩出了新境界。

扫一扫,图解文字真谛

除了GIF,今年cinemagraph也应用进了H5。代表作是支付宝的”太误事报”。


项目:《支付宝:<太误事报>蓝色报告 品牌和传播》 

这份报纸不仅内容不(ge)拘(zhong)一(qi)格(pa),更是使用cinemagraph将一维、静止的报纸变成了三维”鲜活“的动画,那大笑的情侣,不断穿梭的飞机,忽然出现的手指,让TOP君不觉想起哈利波特中会动的报纸。

扫一扫,阅读奇葩报纸

技术逼格升级三:双屏互动

 

哐当当,把手机里的冰块倒到电脑上的杯子里,这个近乎玄幻的场景,就是今年动壹科技进行技术升级后运用双屏互动推出的新玩法。

扫一扫,体验玄幻的双屏互动

看到这个电脑和手机间的双屏互动,有些小伙伴开始吐槽了:自娱自乐,幼稚。别急,马上上两个人互动才能玩起来的——动壹科技为贵人鸟做的“发光吧兄弟”。看完打上感叹号的游戏规则后,就要邀请小伙伴通过扫码加入,一起奔跑,最后,两人合力,根据奔跑速度和里程赢得优惠券。这节奏,让TOP君瞬间有种组团打dota的感觉。

扫一扫,一起发光吧!

技术逼格升级四:重力感应

“你敢在办公室瘦吗?”这个挑衅夹杂诱惑的问题不知让多少小伙伴拿起手机,在办公室里跟着屏幕中的小人互动,从滑屏体验到整体运动体验;末了还邀请朋友加入,将自己手机里的“橙汁”倒给朋友,完成“瘦身接力”。

你敢瘦吗?扫一扫

这互动味十足的小游戏就是运用重力感应做出来的。这种技术去年还只是局部的滑屏体验,今年已经进步到整体运动体验,看似微小的变化,却给H5带来更多可能。

听TOP君嘚啵到这儿,相信深(lao)谋(jian)远(ju)虑(hua)的看官们都开始琢磨H5的新趋向了。为了填补看官们的脑洞,贴心的TOP君特别请教了多家神级H5公司。从“微信整蛊红包“中尝到甜头的未来应用主推流量放大和转化,而双屏互动玩儿得不错的动壹科技认为3D视频会成为H5展示手段,原生功能单一的APP将被H5;跳跳糖则用公式说话,H5+动画技术+全景技术+三维技术+智能硬件+移动支付+大数据平台,打造H5体系;KAMA 大胆预言,H5会延伸到广告营销和用户生活的各种应用场景。

H5未来还会玩出什么新花样,TOP君和你一起,骑驴看账本,走着瞧。

 

来源:TopMarketing(微信号:TMarketing)
作者:TOP君
数英网DIGITALING 已对原文进行编辑