搜狗：一个框的秘密

2018-01-24 H5案例分享 H5案例分享

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

识别图中二维码

一个框的秘密-查阅二维码

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

案例：一个框的秘密

出品：搜狗

亮点：

策划上，视频类，加载完成后，进入一段1分36秒的视频，视频内容：石头上痕迹—>长城的烽火—>信鸽—>电报—>电话—>手机网络，从人类文明诞生开始，信息传递方式不断变迁，信息的载体也在更新，搜索和表达让人类不断进步。从而引出搜狗在中国搜索、文字输入方面的地位，起到宣传作用。
设计上，颗粒度漫画风格，视频画面显示在输入框里，贴合“一个框的秘密”这一主题，有自己的特色。界面以黑白两色为主，搭配少量鲜艳的颜色，使得整体不过于单调，特征鲜明。每个时代的内容之间都有联系，衔接很流畅。
交互上，没有太多的交互，点击页面，视频便开始播放。
技术上，运用了pixi.js技术进行动画特效的展示。
体验上，无论设计还是创意，感觉都很有特点，视屏内容在输入框形状里展现，与策划的主题“一个框里的秘密”对应，展现秘密的内容。小编很喜欢这种动画风格，不会花哨，简单又不失特色。此H5需要锁屏竖屏播放，页面横屏观看。

技术实现： Pixi.js+video

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

标签