网易文创/哒哒×Carlsberg:测一测你的性格pH值

2022-07-04 H5案例分享 H5案例分享
网易文创/哒哒×Carlsberg:测一测你的性格pH值


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

识别图中二维码

测一测你的性格pH值-查阅二维码

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


案例:测一测你的性格pH值

品牌:网易文创/哒哒×Carlsberg

技术实现: HTML5

亮点:

1.创意定位

网易文创/哒哒联合Carlsberg品牌推出的创意H5作品,以“测一测你的性格pH值”为主题,通过8道题,测试用户的性格pH值,过程和结尾都有Carlsberg啤酒植入,从而形成品牌曝光和最后的销售转化。

 

2.策划逻辑

大致流程:Loading → 主题页 → 答题测试 → 输入姓名 → 生成海报。

 

Loading:文案+图片引入,并搬出古希腊的医学之父希波克拉底提出的「体液学说」作为理论支撑,让用户了解:人的性格与体内的pH值有一定的关联性。

 

主题页:品牌露出+主题露出。测一测你的性格pH值,点击开始测试,解锁你的酸碱人格。配图为嘉士伯研究实验室的科学家——瑟伦·索伦森。

 

测试答题:共8道题,每题3个选项。题目关于:跳完《本X纲目》后的反应,下午醒来有老板3个未接电话,周末更倾向于放松的方式,前任突然在街角出现,你认为自己是哪种吃货,尴尬家庭聚餐时有人让你表演才艺,捡到天上飘落的1000亿中奖彩票,成为了游戏中全场的MVP,从第2题开始,设置了“返回上题”按钮,答完后,进入输入姓名环节。

 

输入姓名:根据引导,点击输入框,输入受试者姓名,点击“提交”,进入分析过程动画,有试纸色带、文案和和进度条提示。

 

生成海报:海报包含pH值,姓名,荣誉称号,性格分析,以及跟pH值相关的配图,底部是联合品牌的Logo露出。点击“不算再来”,再次体验,点击“碱直要买”,直接跳转京东嘉士伯购买页面。

  

3.设计交互

以灰色为主要背景,用pH值对标卡颜色配色,从红到紫,整体页面五颜六色,视觉交互突出,艳丽而不凌乱。交互方式采用了:点击、输入和长按。

 

4.用户体验

小五体验了几遍,整体结论是“宜喝酒体质”,赶快下个单,整一件嘉士伯尝尝,哈哈哈~ 





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

标签

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

相关推荐:

网易文创/哒哒:你的投喂说明书

珠江啤酒X网易云音乐:打开心声

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

阅读原文

微信扫一扫
关注该公众号

收藏

微信极速登录/注册

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

微信公众号

提交案例

请pc端输入网址

"h5anli.com"

下载截图压缩包~

标签已提交成功

小编正在审核

请等待一下下啦

哎呀

标签已存在

换个新的呗~