动画H5|网易H5—越过山丘

案例:越过山丘

品牌:网易有道词典

玩法:动画

整理:蓝橙H5开发


1.详情内容上:

网易有道词典为品牌宣传,以“人生山丘”为主题出品的动画H5,让用户点选/定义人生重要节点事件,根据节点事件的正面、负面影响,唤起用户对过往的回忆和思考,最后生成“人生山丘”曲线图,启发人们“人生可以有无限可能”引发共鸣和裂变转发。用交互文案和富有启发的简洁动画,展开关于“人生山丘”的讨论。“hey,陌生人,每个人一生都在攀登,在人生山丘见到你真开心。关于你的人生,不同的人,有不同的建议。”妈妈觉得应该是这样的,老师觉得应该是那样的。在我自己的眼里,我的人上山丘有多种可能性。用户“点击绘制”进入下一部分。以高考为界,把人生分为两部分,高考前,选择三件事,高考后,选择三件事。节点事件以便签条的方式呈现,选中后有选中提示,还有选中列表,如果第一批的便签中没有和用户吻合的事件,还可以点击“换一组”更换便签,多次更换仍没有找到与用户相匹配的事件时,用户可以选择“自定义一件事”,每件事不超过8个字。

为选中的6件事分别打分,积极影响和消极影响,每题只能选一个方面一个分数,打完分,点击“确定。调起键盘,输入姓名,使最后生成的海报跟你有一定的关联性。点击“确认”,会出现一个“绘制中...”的转场动画。生成命运海报:包含用户微信头像、输入的昵称,以及根据用户选择的六个人生节点事件正负影响的“人生山丘”曲线图。海报中部包含:用户是第多少位参与用户,以及中英文双语金句文案。海报底部是品牌露出以及回流访问二维码。


2.页面设计上:

采用扁平清新色块设计。背景分别用淡色系的绿蓝黄粉色块,即代表了生命的丰富多彩,又不抢镜,很好的为故事及情节推进渲染了气氛。


3.用户体验上:

对于小白用户,交互过于复杂;对于被吸引的用户,会耐心完成每一步操作,最后生成的曲线,会是一个直观的小惊喜/小惊吓,你选的事件如果都是正面积极5分,你的人生山丘就跟小五一样了:一条直线,想想也够吓人的。


521421412.png


扫描二维码查看


2142421421.png


注:如果你还想了解更多的H5精品案例,可点击右侧“方案咨询”在线联系,或者微信搜索“蓝橙互动”公众号获取案例。

 

相关链接:H5制作|小程序定制|节日H5|H5玩法|H5设计

更多疑问 全面解答

全面解答全面解答全面解答全面解答

了解更多

方案咨询

价格咨询

工期咨询

联系电话

电话

17723342546

扫一扫

扫一扫

回到顶部