html5课堂之H5案例精选！

随着html5的发展，很多公司都把html5技术运用到了宣传上面，因为H5天生具有迎合热点的基因！第一，制作成本非常低，第二，制作速度可以很快，对于当下的热点稍纵即逝有非常大是优势。第三，对用户体验和画面交互效果非常棒！Html5从体验上开始让用户有了参与感，因为参与感的提升，用户的分享指数也带来了进一步提升。最典型的两个例子就是：

地球上的另一个你，会在哪里？

魂斗罗归来，好友拉你入群聊并肩通过！

地球上的另一个你，会在哪里？

5月23日，天猫在上海宣布成立以来最大规模的品牌升级，从“上天猫,就购了”升级为“理想生活上天猫”。

本周内，天猫上线两个精品H5以为年中618狂欢节预热，其中一款便是这则『地球上的另一个你』，凭借其独到的创意与突出的技术，惊艳众人，透过手机屏幕感受身处同一个地球上的另一个你。

虽之前曾有不少双视频同屏类H5案例，但其交互方式均以长按屏幕切换为主，互动性略显单调。而这款H5将双视频同屏+滑动比式交互加以融合，完美诠释“融合创新”一词！

这也是第一个通过重力感应实现“一屏双频”切换互动的Html5 ！屏幕前的你借助重力感应，上下晃动手机，即可在画面间进行无缝切换．感受不同人生。

当手机向下倾斜时，感受围绕现实转动的生活，同时搭配低沉的“转转歌”现实生活各类压力透过屏幕传递出来。

当手机向上倾斜时，轻松欢快的理想画面就被拉下来，“转转歌”也随之变换曲调。

当手机处于一个相对平衡的位置时，理想与现实的生活也能同台演绎~这种向上是理想向下是现实的设计不经让人联想到当初那组犀利的图片<理想在上面，现实在下面》。

人物与场景的遴选是基于现实生活提炼与浓缩，使得更多人可以感同身受！理想与现实的创意对比体验能够吸引更多消费者。

此款H5通过帧动画的方式搭载双“视频”，以保证用户快速晃动手机时还能流畅体验~重力感应、帧动画与音频同步结合的完美之处，也正是此H5最大的课程亮点。这次618天猫与京东的猫狗大战，我投天猫一票！

魂斗罗归来，好友拉你入群聊并肩通过！

记忆里童年的夏天，除了有无尽重播的还珠格格和西游记，自然还有快搓坏的手柄和印在脑海中挥之不去的魂斗罗。

单是听到游戏开场那夹杂着枪声的阴郁音乐响起，就足够让不少人热血澎湃。  “水下八关”、  ”骑着一匹马打魂斗罗“、“乘着直升飞机追杀到宇宙“等传闻更是为这款儿时经典增添了不少神秘色彩。

魂斗罗归来，重燃英雄梦！点开这款H5的瞬间，一度以为是被拉入群聊，拉你的人竟然是……父母、兄妹、亲友、同事！他们居然聚在一起向你发出sos信号？？坐标加鲁加群岛！

像素画的方式复刻出经典魂斗罗六个关卡的场景，每个场景代入一位好友开启花式作死模式，各种玩家才懂的梗穿插于各场景之间。

曾经跟兄弟起在这里战斗一现在死的死、残的残，小兵不像是小兵、boss不像是boss．正处恍惚之际在游戏起点场景处邂逅比尔，一起“借命复活”召唤诸兄弟~并引出手游新角色。

魂斗罗归来，召唤好友并肩通关~这手情怀牌打的实在666！

Html5越来越成为未来移动互联网的趋势！赶紧来郑州丰泽参加html5培训吧！