案例:职场变形图鉴
品牌:脉脉
玩法:答题测试
整理:蓝橙H5开发团队
1.详情内容上:
脉脉出品的答题测试H5,旨在通过趣味的和职场相关的题目来测试用户的职场图鉴,从而来宣传自身品牌。加载完成进入封面页,首页是一群动物的头像快速切换,同时显示加载进度百分比数字;完成Loading后先获得微信授权,后自动播放。页面上方是自动的带着声音的小漫画格式,分别有猴子,兔子和狗三种代表不同职场人群的动物,下方写着“职场变形图鉴,毕业多年后的我们,现在变成了什么模样”,点击“开始测试”按钮进行测试。用户需要分别回答4个回到毕业前的问题,3个来到工作后的问题,总共7个问题,分别为:
1:毕业聚会时,暗恋的对象坐你旁边,你会怎么样?
2:选择职业时,你会听从谁的意见 ?
3:当你听室友跟现任有暧昧,你会怎么做?
4:你跟同学做好了毕业旅游攻略,有人临时提出改变路线,你会怎么办?
5:当你被同事叫去参与年会表演时,你会怎么做?
6:想给你升职的老板和想跟你分手的伴侣同事掉水里,你会救谁?
7:当你作为参会者,会议内容跑偏并且超出时间,你会怎么做?
用户回答完毕后会自动生成一张“职场变形图鉴”,图鉴上包括:用户毕业前和毕业后最匹配的两种动物,和他们的最佳cp,还有个职场能力描述。长按可保存图片到相册。还有“重新测试”和“查看成长秘籍”,最下方有脉脉的Logo和slogan“成就职业梦想”。点击“查看成长秘籍”就会跳转到脉脉的一个关于“你是如何在职场中一步步成长起来的?还有哪些职业梦想等待实现?”的论坛产品页面。点击“重新测试”按钮,再重新玩一遍。
2.策划设计上:
策划上选用了答题测试和海报生成的玩法形式,题目的选择上十分的贴近于职场生活;设计上采用了手绘漫画风格,背景鲜艳的宝石蓝色,突出了色彩饱和度较低的人物,画风使故事更风趣。
3.用户体验上:
作为脉脉的品牌宣传H5,整体上采用了答题测试和海报生成页十分吸引用户关注,H5整体加载速度快,画风流畅,右下角有音乐标识可静音浏览。回到毕业前和来到工作后的两种时间段的答题体验让人很容易察觉到从青春一下跳入职场的差距。
扫描二维码查看
注:如果您还想了解更多的H5营销案例,可点击右侧“方案咨询”在线联系,或者微信搜索“蓝橙互动”公众号获取案例。
相关链接:H5制作|H5技术资讯|小程序开发|H5案例|H5玩法