腾讯公益:分手游戏
案例演示,请长按/扫描以下二维码 ->
识别图中二维码
完整欣赏此案例大约需要2分钟
案例:分手游戏
品牌:腾讯公益
技术实现: JavaScript
亮点:
1.创意定位
腾讯公益推出的关爱阿尔茨海默家庭的H5,以分手游戏为主题,设定不同的场景和问题让用户选择“分手”还是“不分手”,如果选择分手,就弹出“阿尔茨海默症”的真实故事,让大家了解和关心这个特殊人群,可以捐款,也可以分享传播。
2.策划逻辑
① Loading完毕显示主题:分手游戏。引导交互:点击屏幕开始。
② 角色选择页:(女生)我要跟男朋友分手;(男生)我要跟女朋友分手。点击后,进入“长腿”对象界面,点击“开始分手”,进入题目交互页。
③ 第一关:爱情耐力赛。对象又在沙发瘫了,还一直重复些烦人的问题。(关卡弹层提示)
点击/关闭弹层后,切换画面,展示问题:宝贝,我袜子在哪?选项A:沙发下面,啾咪。选项B:我要分手。
点击5遍A选项,每一遍选项和题目都有动态局部动画,最后进入下一题。如果点击B选项,进入公益宣传界面。
第二关:为爱吃苦。今天是你们的纪念日,对象做了一桌菜,点击揭盖尝尝。(关卡弹层提示)
点击/关闭弹层后,切换界面,为从5个碟子揭盖:台球丸子汤、数据面线、吸管炸薯条、药丸蛋糕、臭袜子炒蛋。点选一个碟子后,出现两个选项,选项A:咽下这桌爱情的苦。选项B:我要分手。点击A,进入第三关。
第三关:前任危机。点击通话按钮,接听爱的来电。(关卡弹层提示)
对方的前女友/前男友语音接通,要约会,选项A:好吧,我帮你约。选项B:我要分手。点选A,进入第四关。
第四关:被爱冤枉。你开开心心打开朋友圈,却发现有人在骂你...(关卡弹层提示)
点击/关闭弹层后,切换到朋友圈界面,面对冤枉的朋友圈信息,点击评论,有两个选项,选项A:我要回复解释,选项B:我要回复骂人。之后继续选择:A-再委屈也不分手;B-我要分手。选A进入第五关。
第五关:消失的记忆。推开家门,对象一脸疑惑地看着你,开口问道...(关卡弹层提示)
点击/关闭弹层后,你是谁啊?我怎么...什么都不记得了...选项A:你忘了我,我也爱你。选项B:我要分手。点击A,进入结果页面:这么难也不分手,你真是个大好人。然后展示阿尔兹海默症家庭的真实故事,呼吁大家捐款和分享关注这个特殊人群。
3.视觉交互
用蓝粉作为主视觉,背景多变,风格统一,主要以黑白灰为主。主题文案、交互文案,清晰突出。交互引导明确,虽然运用多种交互方式,但明了易懂。
4.用户体验
真实故事的反转,引发小五停下来思考,是不是自己太没有耐心了。一个有爱的家庭,出现阿尔兹海默症患者,大家会把爱化作耐心,把所爱的人照顾好。即使没有病患的家庭,也深受启发。
标签
关注微信号:h5-share,获取更多创意H5案例分享!也可访问H5案例分享网站www.h5anli.com,搜索查阅~
微信扫一扫
关注该公众号