抖音：美好生活喵斯卡

2018-05-09 H5案例分享 H5案例分享

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

识别图中二维码

美好生活喵斯卡-查阅二维码

完整欣赏此案例大约需要1分30秒

案例：美好生活喵斯卡

出品：抖音

亮点：

策划上，视频类，这是抖音以“在抖音记录美好生活”为主题的宣传H5。加载完成后，下拉幕布，进入到喵斯卡颁奖典礼。点击翻页，长按屏幕抬起，选择获奖影片（获奖的类型：最佳组合奖、最佳特效奖、最佳喵演员奖和最佳服装奖）；接着长按屏幕，开始喵星人获奖影片的播放；四个获奖影片都播放结束后，引导用户进入“喵斯卡”颁奖环节，用户参与活动，进入抖音客户端体验。
设计上，“喵斯卡”——喵星人的奥斯卡，模拟颁奖典礼现场的场景，搞笑的画风，吸引用户的注意；视频中喵星人的表演，抖音一贯的画风，活泼搞笑，吸引用户参与其中。
交互上，方式：长按屏幕+点击+向下滑动。
体验上，整个H5模拟电影颁奖典礼的流程，嵌入了喵星人的四段表演，自然流畅；影片中喵星人搞笑夸张的动作表演，让用户对抖音的表现形式有了更多的了解。

技术实现： jQuery+canvas+video+jsmpeg

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

标签