饿了么:不在意外里翻车,就在意外里翻身

案例演示,请长按/扫描以下二维码 ->
识别图中二维码
完整欣赏此案例大约需要4分钟
案例:不在意外里翻车,就在意外里翻身
品牌:饿了么
亮点:
1.创意上
本案例由“饿了么”出品,以美女王宝宝新换工作环境遇到一系列小麻烦展开故事,用“视频+横向长图场景”的形式展现各种职场小意外,最后用“饿了么”化险为夷的小故事。3.8女神节活动,“饿了么”这一波操作很666。
2.策划上
① 故事带入:加载页面是一个印有“饿了么”标志的警报灯,下方是一段解说文字,点击警报灯就会出现一个小视频。② 视频讲述了主人公王宝宝在新公司的故事,视频讲述过程中有两次“横向长图”交互场景——同事们面对本宝的内心戏和塑料姐妹花中午吃饭,左右滑动,可以点击人物头上对话框,进入人物内心活动的小视频,播放完毕后自动回到长图界面;点击屏幕下方的“往下看”故事继续。③故事完成后是一段饿了么的宣传广告视频,播放完毕后的结束页出现了“饿了么3.8女王节”的活动宣传海报,再次点击蓝色警报灯,直接跳转至“饿了么38女王节”的活动页面。
3.设计上
反转小视频加上戏精剧场和长图交互场景,非常符合年轻人的职场日常。
4.体验上
横向长图场景加上内心小剧场,十分惊喜,视频的表现形式和第一人称的表达方法让人更有真实感,饿了么反转剧情的加入也十分的自然流畅。移动端和PC端都适配,更能提高用户参与度。
技术实现: jQuery+createjs+Video
标签
关注微信号:h5-share,获取更多创意H5案例分享!也可访问H5案例分享网站www.h5anli.com,搜索查阅~

微信扫一扫
关注该公众号