白酒品牌长图滑动H5案例分享


2023.10.16

长图滑动H5的形式非常简单,其操作流程就是让用户滑动屏幕浏览长图,因此十分看重页面设计,通过优秀的排版设计将需要宣传的信息传递给用户。下面,蓝橙互动就给大家分享一个长图滑动H5案例,看看实际效果如何。

 

案例名称:梦见嫦娥

 

案例品牌:洋河股份

 

1、创意定位

 

早第五个中国航天日之际,梦之蓝百万航天合伙人计划正式开启,洋河股份以梦见嫦娥为主题,用长图滑动H5的方式进行活动宣传,引导用户助力,参与活动,购买产品。

 

2、活动流程

 

主要流程:①主题页 →②长图页 →③落地页

 

长图滑动H5


①主题页:进入H5案例,Loading部分一枚火箭在不断升空,展示文案:嫦娥五号发射中...加载进度完成,进入主题页。主题页有品牌Logo,活动主题清晰露出,梦见嫦娥-梦之蓝M6百万航天合伙人登月计划,邀请大家加入百万航天合伙人,一同助力“嫦娥五号”回家。点击“开启回家之旅”,几片祥云交叉过渡动画,进入长图页。

 

②长图页:嫦娥形象一直微颤,用户向下滑动,出现文案和视觉差效果,直到遇到航天舱,用户需要“按轨迹”滑动屏幕,使嫦娥进入返回舱,继续上滑屏幕,返回舱带着嫦娥返回地球,然后一个碰杯动画,引出活动跳转线索:送梦出发的你,别忘了带梦回家。然后再次露出主题,引导用户“助力”跳转。

 

③落地页:点击“助力”按钮,用户跳转京东APP商品详情页面,可以直接下单购买洋河蓝色经典绵柔白酒。

 

3、设计策划

 

H5以唯美的手绘嫦娥和祥云为主元素,配合品牌蓝色变色为底衬,让用户在滑屏过程中,有所期待,看看最后嫦娥是如何回归的。整体视觉唯美,操作流畅,互动形式,除了向上滑屏,还有沿引导线互动,交互形式有变化,又不太难,让用户体验流畅。

 

以上就是本次为大家分享的长图滑动H5案例,这个案例是采用的单长图的形式,除此之外长图滑动H5还有多长图的玩法,大家可以点击咨询我们的客服,获取更多H5案例进行体验。