京东超市 + 创造营2020：京东超市发光能量站

2020-06-13 H5案例分享 H5案例分享

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

识别图中二维码

京东超市发光能量站-查阅二维码

完整欣赏此案例大约需要55秒

案例：京东超市发光能量站

品牌：京东超市 + 创造营2020

技术实现： Zepto + TweenMax + CreateJS

亮点：

1、创意定位

京东超市和创造营2020联合出品的H5，流量与品牌的结合，与综艺节目相关的问题，尾页中露出品牌和推荐的商品信息。

2、策划上

① 首先是一段14秒的视频，一个披着斗篷的小姐姐，看不到小姐姐的脸，总是背影，走进一个神秘的屋子，出现选择列表（问题是：你心目中的发光本命），一共6个人名，选择一个点击“next”按钮；

② 点击屏幕提示“点亮沉睡的发光本命”，一共6个问题，有WINK（眨眼示意）、歌曲风格、造型等，中间有两个问题互动是将心图标拖到问题选项上，除了第一个问题是4个选项，其他都是3个选项；每次选择后，需要点击下方的“next”按钮进入下一屏；

③ 最后生成海报，里面有微信的头像和昵称（微信授权后自动获取），有开始选择的发光本命的姓名，与C位本命匹配指数的百分比，雷达图，和品牌方的推荐商品。

3、设计上

粉色调为主，配合紫色，都是甜美的小姐姐卡通局部造型。

4、体验上

首先了解了创造营2020节目，引导用户了解更多；对于已是用户创造营2020的粉丝，看了H5，会去京东超市了解更多自己喜欢的爱豆。

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

标签