港汇恒隆广场&&POP MART：港汇恒隆广场

2018-02-22 H5案例分享 H5案例分享

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

识别图中二维码

港汇恒隆广场-查阅二维码

完整欣赏此案例大约需要2分10秒

案例：港汇恒隆广场

出品：港汇恒隆广场&&POP MART

亮点：

策划上，游戏类，Loading完毕，进入游戏主页，介绍规则——即在30s时间内，找出每一关的天使Molly，完成的关卡越多，获得的奖品越多；回到主页，点击“START”，开始游戏。游戏结束后，进入抽奖页面，引导用户登录注册后才可进行抽奖。
设计上，界面清新可爱，以嫩粉色为主色调，通过简易耐玩的小游戏调动用户的参与性。界面设计紧紧抓住了目标消费群体，满足目标用户的少女心。
交互上，小游戏类H5，互动比较多。
技术上，使用了js组件，实现了页面中游戏规则框的弹出；页面的切换使用了Swiper Animate插件，实现了游戏界面关卡切换的动画效果。
体验上，小五体验过后，对该H5的画面印象深刻，满屏的的嫩粉色，游戏时页面上方不断变化的时间，也增强了游戏的紧迫感。

技术实现： jQuery.js+swiper.js+howler.js+layer.js

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

标签