互动动画H5案例大合集

H5动画在H5页面的众多类型中,一直是内容展示丰富性而著称,并且H5动画的适用性十分广泛,不管什么行业什么品牌都可以利用H5动画来开展营销活动。但是H5页面经过这么多年的发展,其用户对于H5页面已经十分熟悉了,这也就导致用户会产生一定的抵触情绪。那么,有没有具备创意的H5动画形式呢?当然有,那就是互动动画H5了。互动动画H5的意思就是,H5动画的页面效果会随着用户的选择而产生变化。蓝橙H5开发团队给大家总结了以下互动动画H5案例:


H5案例名称:对“艾”say no

H5背景策划:艾滋病科普H5


H5内容策划:广州市海珠区疾病预防控制中心官方出品的互动游戏H5,通过让用户来选择一系列和艾滋病有关危险形式,从而来呼吁人们关注艾滋病健康,做好预防工作。


加载完成进入H5进入首页封面页,页面上方是疾病控制中心的官方标识,用户可以点击右上角查看互动游戏的详细规则,页面背景图是一个拿着拳头挥击艾滋病毒的动画小人,页面中间的“对艾say no”是此次H5的标题,用户可以点击页面下方查看此次和艾滋病相关的健康知识,点击开始进入互动测试页面。测试的主题形式为场景选择形式,用户需要在和艾滋病相关的危险行为中选择正确的行为,随着用户选择进度条的推动,画面中的动画人物也会改变。五道测试题的内容分别为:在KTV里朋友给摇头丸应该怎样、激情时刻、身边没有安全套应该怎样、最近茶饭不思,失眠多梦身体不舒服应该怎样、发生高危行为后应该怎样、朋友感染艾滋病应该怎样对待。用户回答完所有题目以后,系统会根据用户回答的问题情况生成一张专属的海报,显示用户的防艾等级,最后可以点击将H5分享给他人,也可以点击领取奖励来参与抽奖。


12421451.png


1111252142141.jpg


H5案例名称:丈母娘的这笔账,我记下了

H5案例品牌:滴滴出行H5


H5内容策划:滴滴出品的趣味动画测试H5,旨在通过测试来宣传自身的产品品牌。用户开篇点击“翻旧账”正式进入H5,H5总共分为三个动画场景,分别是:①她总爱“刺”我的刺,我总爱和她抬“杠”,用户可以滑动页面选择是挑刺还是抬杠,动画展现丈母娘帮我挑鱼刺,我给丈母娘麻将点“杠”。②她总给我“添油加醋”,我就给她“火上浇油”,用户滑动选择,动画展示丈母娘给我选购醋,我给丈母娘做饭加油。③她总给我“挑三拣四”,我就给她“指指点点”,用户滑动选择,动画展示丈母娘给我挑选水果,我给丈母娘在手机上“指指点点”。


随后用户可以点击“女婿在点啥”进入下一页面,随后出现滴滴打车的页面,画面中点击“代叫”,最后出现滴滴的宣传页面,用户点击“让身边的人都当好女婿”可以分享。


252142142.png


2222214214215.jpg


H5案例名称:看熊猫 欢乐吃

H5玩法设计:成都广播电视台


H5内容策划:成都市广播电视台出品的活动宣传答题测试H5,旨在通过H5宣传5月15日-5月22日在各大酒店和餐厅灯等地开展的成都熊猫亚洲美食节。这款H5分为个部分:

第一部分:关于成都美食的2个答题小测试。①好不容易适应996了,老板突然宣布从今天开始007!苍天呐!此时最想吃什么抚慰自己的内心呢?选择成都火锅和泰式火锅。②你在天府绿道上跑完了5公里,以下哪种声音可能会让你放弃减肥计划?选择爆炒小龙虾和韩国铁板烧。

 

第二部分:是一个趣味的吃面小游戏。面对日本交换生提出的乌冬面大挑战,人称“乌冬面小王子(公主)”的你敢应战吗?用户通过向上快速滑动屏幕来“吃面”,根据用户吃面的长度来判断用户是“学霸型吃货”还是“学渣型吃货”。

 

第三部分:关于成都美食的5个答题小测试。①新加坡肉骨茶是不是茶?②宫保鸡丁的宫保是官衔还是人名?③鱼香肉丝里面有没有鱼?④夫妻肺片和夫妻有没有关系?⑤冷dna杯中的dan是淡还是啖?

 

第四部分:关于成都美食的2个问题选择。接到母上大人以死相逼的相亲饭局,你会选择在哪里和对方见面?选择成都小茶馆或者香港奶茶店。

 

第五部分:H5最后会根据用户在以上游戏中的选择,测试出用户是什么美食的代言人,用户还可以点击“传递美食”来将H5分享给他人。


31521421421.png


33333351421421.jpg


注:如您需要咨询本案例的详细信息,或者需要了解更多案例,可点击右侧“方案咨询”在线联系,或者微信搜索“蓝橙互动”公众号获取案例。

 

相关链接:H5制作|H5玩法|小程序定制|H5技术资讯|H5课件

更多疑问 全面解答

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

了解更多

方案咨询

价格咨询

工期咨询

联系电话

电话咨询

17723342546

扫一扫

扫一扫

回到顶部