臻迪：PowerRay小海鳐闪耀登场

2017-01-09 H5案例分享 H5案例分享

案例：PowerRay小海鳐闪耀登场

出品：臻迪

亮点：

策划上，视频类，① 首屏以朋友圈的形式引出臻迪PowerRay小海鳐发布信息；② 点击快速晃动的首屏页面，海水从底部涌入，水下机器人PowerRay小海鳐闪耀登场，以视频的形式展现了小海鳐寻鱼+诱鱼的可视化钓鱼功能；③ 想了解更多小海鳐信息的小伙伴，可点击尾屏“LEARN MORE”，跳转到PowerVision官网去了解更多信息。
设计上，微信朋友圈风格，首屏的朋友圈设计增添了真实感，而后的视频画面清新自然。
技术上，首屏快速晃动的动画采用的是CSS3的animation，而后的动画画面采用的是Video视频，视频格式采用的是mp4格式。

技术实现： jQuery + HammerJS

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

识别图中二维码

PowerRay小海鳐闪耀登场-查阅二维码

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

标签