Moxy Hotels:Moxy酒店 创世开玩

2022-07-24 H5案例分享 H5案例分享
Moxy Hotels:Moxy酒店 创世开玩


案例演示,请长按/扫描以下二维码 ->

识别图中二维码

Moxy酒店 创世开玩-查阅二维码

完整欣赏此案例大约需要2分钟


案例:Moxy酒店 创世开玩

品牌:Moxy Hotels

技术实现: HTML5

亮点:

1.创意定位

Moxy酒店推出的以“Moxy酒店 创世开玩”为主题的创意H5,通过让用户DIY破次元3D人物形象、装饰等,让品牌有更大范围内的曝光,让潜在消费者了解Moxy酒店的场景、好玩以及调性,引发兴趣,进而形成到店转化。

 

2.策划逻辑

大致流程:主题页 → 活动规则 → 旅行装备DIY → 打卡心仪酒店 → 生成海报。

 

主题页:直接露出品牌和主题。Moxy Hotels的个性Logo在顶部,第一视觉重心是主题:创世开玩——Moxy酒店 等你来玩。

 

活动规则: 主题页加载完成,即弹出“创世开玩”活动规则页,需要用户阅读并勾选“我已阅读活动规则”才能点击“解锁开玩”。对于收集用户交互行为的H5,只有完成了这一步才算合规,大范围传播时避免不必要的法律风险。点击“解锁开玩”进入旅行装备DIY部分。

 

旅行装备DIY:默认是酒店房间背景,破次元的卡通人物形象站立于房间中,用户可以通过屏幕下方的“配置栏”对卡通人物进行装饰。配置栏包含:头型、发饰、胡须、帽饰、上衣、裤子、鞋子、眼镜等8类,每类包含若干种可选的颜色、款式,点击后,即可显示在3D卡通人物对应的身体部位。该卡通形象3D可交互,在水平方向随着左右滑动人物可以360°旋转查看已配置上身的各种装备。考虑到有些用户嫌麻烦,配置栏还设置了“随机”按钮,点击“随机”按钮,即可给卡通人物随机搭配一套旅行装备。点击右下角的双箭头指示,即进入下一部分。

 

打开心仪酒店:首先选择“创始ID”,即从若干称呼中选一个符合自己喜好的名字,例如:熬夜团长、创世邻居、你的驴友、打卡狂人等。选定完创始ID后,还有两项好玩的操作,一是换姿势,二是换背景。点击“姿势图标”,每点击一次,上一部分打扮好的酷酷的卡通人就“活动”起来换个姿势,大约有4-5种姿势循环;点击“地标图标”,每点击一次,即更换一张酒店背景。点击页面右下角的“相机图标”,生成“拍照”海报。

 

生成海报:海报包含你按下“相机图标”瞬间卡通人物及背景的“照片”,还包含用户选的创始ID,以及“创始开玩”主题和品牌Logo。这么好玩的酒店,如果想入驻,还可以直接点击页面底部的“立即预定”,即弹出官方小程序码,可以长按识别二维码转入官方站点。

 

3.视觉交互

整体视觉很酷,超现实的3D破次元卡通形象,无限多的排列组合效果,吸引着用户一试再试,真是很会玩。配合上酒店实际房间、背景,不仅不违和,还有一种数字科技感,穿越感。交互上,主要运用了:点击、滑动、长按三种。

 

4.用户体验

有机会去深圳,一定要体验一下Moxy酒店,太酷了! 不知道有没有像小五的用户,点“随机”按钮超过100次,无限搭配啊!如果住进酒店,猜一下你的房间会不会有一个这么酷的虚拟服务员,为你服务呢?





以上为“H5案例分享”团队原创文章,转载请注明出处!

标签

分享:
海报
案列链接
下载截图
收藏案例
已收藏
分享到微信朋友圈
打开微信,点击底部的“发现”,
使用“扫一扫”即可将网页分享至朋友圈。

相关推荐:

希尔顿欢朋酒店:给走南闯北的你

Xiaomi:Redmi Note 11 Series Showroom

关注微信号:h5-share,获取更多创意H5案例分享!也可访问H5案例分享网站www.h5anli.com,搜索查阅~

阅读原文

微信扫一扫
关注该公众号

收藏

微信极速登录/注册

对汉语支持不错,别对小五说英文

微信公众号

提交案例

请pc端输入网址

"h5anli.com"

下载截图压缩包~

标签已提交成功

小编正在审核

请等待一下下啦

哎呀

标签已存在

换个新的呗~