英菲尼迪:英菲尼迪斯巴达小勇士训练营

2019-11-18 H5案例分享 H5案例分享
英菲尼迪:英菲尼迪斯巴达小勇士训练营


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

识别图中二维码

英菲尼迪斯巴达小勇士训练营-查阅二维码

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


案例:英菲尼迪斯巴达小勇士训练营

品牌:英菲尼迪

技术实现: html5

亮点:

  1. 创意定位

英菲尼迪与网易新闻联合出品,通过问答题检测家里小朋友各方面的能力,生成能力值与宝宝类型海报,最后还可以参与抽奖赢门票的活动,以此推广“英菲尼迪斯巴达小勇士训练营”,提高训练营和网易新闻的知名度。

 

  1. 策划逻辑

作品主要有三个环节

 

①主题导入

标题下是一排孩子的小脚印,根据提示滑动屏幕,经过木头小路,来到选择界面,可点击“开始吧”开始测试,也可以点击“先看彩蛋”查看训练营的三重好礼活动详情,或点击“获奖名单”。

 

②问答测试

滑动页面,在每个题目中点击出符合自己孩子日常行为的选项,包括孩子的左右脑发育状况,在小团体中的角色定位,喜欢什么颜色的车,上车后的第一举动,遇见水坑会怎么办,以及最喜欢哪个卡通角色。

 

③海报生成

回答完毕后,输入孩子姓名,选择性别即可,海报包括标题“原来XX(宝宝名字)小朋友是一位XXXX(怪力博士,天才侦探等)”,以及宝宝的双商,创造力和行动力值示意图,一段对宝宝的解读话语,用户可以点击“晒娃”分享结果,也可点击“戳这儿赢门票”参与抽奖活动。

 

  1. 设计上

跳跃的黄色象征了孩子的活力和挑战精神,搭配绘制的卡通宝贝图,让界面看起来活跃可爱。

 

  1. 交互上

每一题的选项样式各不相同,用户选择后被点击的选项会呈现一定的变化,变颜色,变跳动,字体变流动等,用户更换答案的话直接点击另一个选项即可,答卷未提交前可滑回前方问题更改答案。





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

标签

分享:
海报
案列链接
下载截图
收藏案例
已收藏
分享到微信朋友圈
打开微信,点击底部的“发现”,
使用“扫一扫”即可将网页分享至朋友圈。

相关推荐:

INFINITI 英菲尼迪:点亮人生竞技场

王者荣耀X浙江小百花越剧团:王者荣耀X越剧皮肤抢先体验

关注微信号:h5-share,获取更多创意H5案例分享!也可访问H5案例分享网站www.h5anli.com,搜索查阅~

阅读原文

微信扫一扫
关注该公众号

收藏

微信极速登录/注册

对汉语支持不错,别对小五说英文

微信公众号

提交案例

请pc端输入网址

"h5anli.com"

下载截图压缩包~

标签已提交成功

小编正在审核

请等待一下下啦

哎呀

标签已存在

换个新的呗~