鲁商置业:孔子出道2567年个人EP首发,竟然是为了…

2016-08-17 H5案例分享 H5案例分享
鲁商置业:孔子出道2567年个人EP首发,竟然是为了…

案例:孔子出道2567年个人EP首发,竟然是为了…

出品:鲁商置业

亮点:

  1. 策划上,视频类,①H5的开头,孔子亲自解锁,随着音乐响起的瞬间,金链墨镜加身,开始中式说唱音乐:《奥运我撑你》;②而后巧妙地用谷歌地图的导航,让孔子坐飞机来到里约,以真实的地图界面配合有里约特色的场景,魔性十足;③ 孔子把和中国队合影的照片Po上Instagram,并且小心机的将活动主题“奥运我撑你”的作为标签植入,然而更多的惊喜在于Ins下面的留言;④ 在说唱音乐结尾处将鲁商置业巧妙融入歌词,视频结束,点出活动内容,不易引起用户反感。
  2. 设计上,中国风漫画+rap歌词,超级魔性啊。
  3. 技术上,主要采用的是html5的video,视频预加载是否完成是用video的canplay事件来判断的。
  4. 体验上,视频比较大,而且是用video的canplay事件是可以判断视频是否已准备好播放,但不能够预计指定的音频/视频在不停下来进行缓冲的情况下持续播放,事实上这个视频确实在播放的过程中容易卡顿。



技术实现: jQuery + TouchJs


案例演示,请长按/扫描以下二维码 ->

识别图中二维码

孔子出道2567年个人EP首发,竟然是为了…-查阅二维码




以上为“H5案例分享”团队原创文章,转载请注明出处!

标签

分享:
海报
案列链接
下载截图
收藏案例
已收藏
分享到微信朋友圈
打开微信,点击底部的“发现”,
使用“扫一扫”即可将网页分享至朋友圈。

相关推荐:

腾讯:Next Idea x 故宫

小米科技:如果清朝有手机

关注微信号:h5-share,获取更多创意H5案例分享!也可访问H5案例分享网站www.h5anli.com,搜索查阅~

阅读原文

微信扫一扫
关注该公众号

收藏

微信极速登录/注册

对汉语支持不错,别对小五说英文

微信公众号

提交案例

请pc端输入网址

"h5anli.com"

下载截图压缩包~

标签已提交成功

小编正在审核

请等待一下下啦

哎呀

标签已存在

换个新的呗~