提升H5页面转化率的十种交互形式

 

随着互联网的不断发展,广告形式也发生了翻天覆地的变化。传统的广告主要是展示给用户观看,而现在的广告伴随着更多的交互,让用户与产生交互行为,也就是很多人常说的“互动”。其实,随着行业发展和细分,这个“互动”早就不简单了,他往往会关系到打开率、用户留存、购买转化这些非常重要的信息。下面,蓝橙互动会为展现10种最常见,营销交互方式在H5页面的运用,希望能为你带来新的思考和启发!

  

1、滑页交互- 交互类型

 

1.jpg

 

转场- 留存率:高滑动页面交互,是H5中最常见的交互方式,主要作用是转场,因为大家比较熟悉这类操作。所以,在滑页时,观看者流失率比较低。

 

又因为这类交互方式单一,所以,行业中有一个5-8页最佳滑页数上线的说法。但其实,同样的滑页转场,如果能够有不同的转场花样,就能弥补呆板。

 


2、长滑页交互- 交互类型


1585121559894458.jpg


转场- 留存率:较高和滑页不同,长页面交互在转场时,不会有那种不连贯的感觉,从而能够减少流失率。

 

但通常说,页面内容也不合适设计过长,这很容易造成观看者乏味。

 

而且,除上滑动外,其实我们可以设置左右互动,这样也许能带来更强的新鲜感。


3、长按交互- 交互类型

 

1585121584317101.jpg


转场- 留存率:较高长按交互是指,通过长时间按压屏幕,来达到内容播放和转场的互动方式,通常说,有提升注意力的效果。

 

但和长页面交互特征一样,不适合长时间按压,而且在长按时,最好能够有相关进度参数,像是《1分钟漫游珠港澳大桥》中的公里数显示。


4、视差滚动动画交互- 交互类型


1585121631115372.jpg


转场- 留存率:极高可以说,这是目前最常用,又具备极高留存率的页面交互,和长页滑动不同,视差动画因为在页面运动时,页面元素能够呈现出不同的运动轨迹,所以,能更好提升观看者关注度。

 

而且,视差动画的形式也比较多样,容易制作出极为特殊的效果。

 

5、行为引导交互- 交互类型

 

 

1585121658178840.jpg


内页操作- 留存率:适中行为引导类交互,通常在关键内容步骤时出现,用于提醒观看者进行操作,可一旦使用不适当,就会有非常差的体验感。

 

这类交互也是H5中比较难使用的一种,看似简单,但其中要考虑的用户行为因素却非常的多。

 

6、选择类交互- 交互类型


 

1585121688121715.jpg


内页操作- 留存率:适中选这类交互看似简单,但其实难度是众多交互方式中最高的,因为自由度较大。

 

所以在设计时,要考虑到内容主题特征。像是《蓝月》中,为突出紧迫感,在选择时,专门设计了选择进度条,效果非常理想。

 

7、3D空间类交互- 交互类型


1585121737790149.jpg


内容展示- 留存率:较低3D场景类交互,在国内营销H5中比较少见,主要原因是因为技术门槛和用户习惯造成的,一方面开发成本高,而另一方面是因为国内用户又普遍没有类似习惯,以此导致了这类交互方式留存率较低。但随着5G时代的到来,这种情况应该会有所改善。


8、手势书写类交互- 交互类型


1585121760615569.jpg

 

辅助类- 留存率:适中因为操作复杂,所以这类交互在营销H5中出现较少,就算出现,也通常会简单化来进行设计,在案例中,也主要起锦上添花的作用。

 

如果不是主题的特别需要,通常不建议加入这种操作方式,必定有些过于复杂了。

 

9、重力交互- 交互类型


1585121816945752.jpg


辅助类- 留存率:较高通常说,我们可以利用一些小交互,来增添页面关注度与趣味性,例如,手机陀螺仪的调用和重力交互的加入。

 

可别小看了这个小小的重力交互,很多人就是因为这点细节才最终留存下来的。

 

10、 360度滚动交互- 交互类型

 

 

1585121909127645.jpg

内页操作- 留存率:适中不同于3D场景类交互,360度滑动交互,并不一定需要3D技术,而主要目的是能够呈现立体场景。

 

这类交互方式非常适合应用在空间性较强的展览、活动、室外等场景。当然,操作往往也都比较复杂,设计这类交互其实是要尽量做减法,而不是加法。

 

 

以上就是蓝橙互动这次给大家分享的10个最常见的营销H5设计交互了。对于品牌们来说,简单的互动形式并不一定就不好用,复杂并不一定就真正有效,真正的设计还是需要根据品牌自身的情况来操作了。


蓝橙互动,是一家专业的h5游戏开发公司,为上百家品牌提供H5开发服务,值得你的选择和信赖!



注:想要查看更多的H5案例,可以加我们QQ:3513138755,我们会把最新的案例发给你哟

 

相关链接:H5制作|微信小程序|微信小游戏|H5开发|行业H5制作

更多疑问 全面解答

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

了解更多

方案咨询

价格咨询

工期咨询