Brookstone 博克斯通:穿越乐世界
案例:穿越乐世界
出品:Brookstone 博克斯通
亮点:
- 策划上,交互视频类H5,横屏观看。进入案例点击按钮,画面出现一位帅气小哥哥,将手机向不同方向晃动能进入不同的主题,向左晃动选择“一起去泳池派对吗”,向右晃动选择“走,跟我搞事情去”。
向右晃动,进入一个会议室场景,场景中有两拨人,正因为策划方案的事情争执不休,男主劝和失败,于是拿出手机,同时画面提示用户选择故事走向,可以让原本争吵的二人开始弹奏乐曲,或是进行说唱 battle。结尾还有一个清洁工小彩蛋。
向左晃动,男主会进入泳池派对,此部分是720°的全景视频,用户可以上下左右转动手机,即通过手机自身陀螺仪,观看视频。泳池派对分为几个视频,须通过用户点击屏幕来过渡。
- 设计上,均为真人拍摄。会议室部分,黑色大背景,突出会议本身。用户如果选择弹奏乐曲,画面会变为山水场景,并且产品会嵌入画面中,二人漂浮于音响之上,云雾环绕,山水风画面,悠扬的琵琶+二胡背景乐,和科技感十足的产品相互碰撞,产生了强烈的视觉反差;若选择搞事情,背景依旧是黑色,产品音响会变成舞台,二人化身 Rapper,在音响之上进行说唱 battle,歌词充满火药味儿,编曲也同样动感十足,一个回合之后,灯光打开,画面变亮,气氛升级,更加激情四射。
无论选择哪个,最后都会穿越回会议室,留下非常喜感的结尾,同时突出“穿越乐世界”的主题。
泳池派对也是H5的最大亮点之一,全景+VR的视频让用户仿佛身临其境。场景中,男主点击音响上的按钮,乐队便出现在身边,在渲染狂欢气氛的同时,又表现出音响的音质和音乐还原效果很棒。用户在这部分停留时间,恐怕会很长呢哈哈哈,对,说的就是你,快擦擦口水吧!
- 体验上,感觉交互形式非常丰富,除了点击选择选项,还有重力感应晃动手机、全景+VR视频,视频除了旋转手机,还能滑动屏幕查看,这些交互让H5提升了用户的参与感。同时,案例很好地突出了“穿越”和“乐世界”,将故事和产品本身也很好地结合在一起。
案例还将产品的功能也无痕地融入其中,比如泳池派对,暗含着产品本身的防溅水性能,再比如会议室场景中,男主点击手机屏幕按键时,两道光束射向两台音响,这个镜头表现出了产品的 Pair2 技术......总而言之,是一个互动性很强又蛮有趣的H5。
技术实现: Krpano + PreloadJS + jQuery
案例演示,请长按/扫描以下二维码 ->
识别图中二维码
标签
关注微信号:h5-share,获取更多创意H5案例分享!也可访问H5案例分享网站www.h5anli.com,搜索查阅~
微信扫一扫
关注该公众号