诛仙手游：双11阻击战

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

案例：双11阻击战

出品：诛仙手游

亮点：

策划上，游戏类。这是由诛仙手游官方在双十一来临之际所打造的一款宣传h5。主要分为三个阶段。① 选择游戏阶段。页面中男主角正在阻止面对双十一促销、优惠活动时要拿刀剁手的女主角。页面末尾处有两个选择按钮：“阻止败家”、“我要败家”。用户可选择进入自己喜欢的游戏场景。② 游戏阶段。在限定的时间里，用手快速滑动商品。在阻止败家的场景中，商品是滑出购物车。在我要败家的场景中，商品是滑入购物车。③ 游戏结束阶段，诛仙手游的logo挂在屏幕上。屏幕中文案显示的是用户阻止老婆败家或者是自己败家所花费的费用和诛仙手游的广告宣传语。末尾有两个按钮，一个是可以用作分享的“邀请好友来仍”按钮，另一个是重新开始游戏的“没扔够？”按钮。
设计上，插画风格。① 首屏中，人物夸张的表情和动作形象展示了双十一“剁手节”。② 采用亮色渲染局部内容，用暗色作为背景色，起到了凸显内容的作用。
技术上，页面中货物和文字的动画特效采用了CSS3中的Animation技术实现。

技术实现： jQuery

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

识别图中二维码

双11阻击战-查阅二维码

完整欣赏此案例大约需要1分钟

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

标签