马蜂窝:地球日快乐
案例演示,请长按/扫描以下二维码 ->
识别图中二维码
完整欣赏此案例大约需要1分30秒
案例:地球日快乐
品牌:马蜂窝
亮点:
1.创意定位
这是马蜂窝在世界地球日推出的重要节点营销类H5,邀请用户通过一系列的图像选择测试,测试出用户的地球观。
2.策划上
①进入H5后,封面展示了标题:你真的见过地球吗,点击按钮进入下一页开始自动播放动画。②动画内容是对地球的介绍,这部分包括地球的概况、面临的环境问题和地球上著名的景点等。③动画结束后,出现一段引入测试的导语,并邀请用户跟随自己的心意探索自己的地球观。④探索部分,用户需要根据提示上、下划或左、右滑动屏幕,选择小球的前进方向,最后再按提示拖动白球。完成测试后,用户需要填写昵称以揭晓答案。⑤答案页也是尾页,用非常抽象的文字和线条讲述了用户的地球观,并邀请用户长按保存分享。
3.设计上
抽象派的风格,以黑色为背景,白色的线条和形状为内容。
4.技术上
动画采用gif和CSS3的自定义动画animation。
5.体验上
这是一个逼格比较高,看起来很深奥的H5,加载速度快,操作流畅,页面酷炫也很有设计感。问题主要出在不接地气儿,小编玩下来会觉得有点懵。此外,关于地球的介绍部分,自动播放的有点快,用户可能会来不及看完。
技术实现: html2canvas.js
标签
关注微信号:h5-share,获取更多创意H5案例分享!也可访问H5案例分享网站www.h5anli.com,搜索查阅~
微信扫一扫
关注该公众号