抖音:陈奕迅情绪治疗所
案例演示,请长按/扫描以下二维码 ->
识别图中二维码
完整欣赏此案例大约需要40秒
案例:陈奕迅情绪治疗所
品牌:抖音
技术实现: RequireJS
亮点:
1.创意定位
为陈奕迅在抖音平台2020年11月21日直播线上造势传播H5作品。以“陈奕迅情绪疗愈所”为主题,用五道题互动,给出陈奕迅情绪疗愈诊断书,在互动的同时,把Eason的粉丝引流到抖音平台。
2.策划逻辑
① Loading页面即露出主题:陈奕迅情绪疗愈所,抖音限时营业中。
② 文案带入,引导用户输入自己的姓名,跟陈奕迅聊聊天。点击“好”即进入答题环节。
③ 共5题,都是关于心情的问题,每题三个选项,选完画面自动切换进入下一题。答完有一个阅卷过渡动画,之后出“疗愈单”海报。
④ 海报主题:陈奕迅情绪疗愈所诊断书,品牌露出:抖音,根据答题情况,给出相应文案,并露出关键引流信息:11月21日晚8点 Eason直播。可以长按保存海报,也可以点击“约见陈医生”按钮,弹出引流弹层:进抖音,搜陈奕迅。
3.视觉交互
低饱和度配色,以淡米黄为底衬,以淡粉和淡蓝为主视觉配色,很是舒服。答题互动过程中,有按钮交互特殊音效和场景局部动画,生动不枯燥。
4.体验上
五道题设置在用户没有厌烦时,已经完成;每道题入场和转场都有细腻动效,每个交互都有及时反馈。好像真的在跟Eason交互,感觉很舒服,最后跳转如果不是平台显示,如果直接能入抖音直播间,就更棒啦~
标签
关注微信号:h5-share,获取更多创意H5案例分享!也可访问H5案例分享网站www.h5anli.com,搜索查阅~
微信扫一扫
关注该公众号