腾讯体育：2017特步企鹅派对跑

2017-05-26 H5案例分享 H5案例分享

案例：2017特步企鹅派对跑

出品：腾讯体育

亮点：

策划上，视频 + 一镜到底类，① 弹幕乱入，女神降临，双击爱心，看女神，王丽坤邀您一起来参加2017特步企鹅派对跑，长按指印，和女神一起点亮企鹅跑北京之旅；② 而后采用一镜到底的方式，将女神跑北京之旅生动形象的展现了出来，滑动女神可帮她助跑，一路嗨跑，来到尾屏，以小视频形式展现特步企鹅派对跑盛况，想一起跑的小伙伴可点击嗨起，参加派对。
设计上，都市激情风格，采用紫红色作为主色调，黄色作为辅色调，色彩艳丽张扬，画面充满活力。
交互上，采用上滑滑动，来控制场景是向前还是先后，并根据滑动的幅度控制女神跑步的速度。
技术上，视频主要是采用带有webkit-playsinline，playsinline等属性的Video来实现的，女神跑步画面主要是采用Canvas + ThreeJs + TweenJS（CreateJS 套件的一部分）来实现的。

技术实现： Video + ThreeJs + TweenJS

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

识别图中二维码

2017特步企鹅派对跑-查阅二维码

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

标签