广汽丰田：2017，什么词让你最扎心？

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

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

识别图中二维码

2017，什么词让你最扎心？-查阅二维码

完整欣赏此案例大约需要40秒

案例：2017，什么词让你最扎心？

出品：广汽丰田

亮点：

策划上，视频类，Loading完毕，出现主题页面，“2017我最扎心的年度关键词”，回答问题生成大片，进入扎心四连问，对工资、游戏、动力、目标做出合适的回答，之后根据问题生成相应的年度大片，点击按钮开始播放视频，视频总长29秒，前部分为关键词的描述，后边是对雷凌汽车的相关宣传。视频播放完成后，进入网易新闻视频列表，点击返回后，可看到个人的关键词，可选择分享，或者进入雷凌官网。
设计上，以蓝色为主体，简约大方。
交互上，主要是视频的播放，但是在进入的扎心四连问时，指示不明确，“回答问题”的按钮无法点击，会默认进入关键词“忙”的相应视频。
技术上，使用了AnnieJS引擎实现了动画中数据的交互，使用jQuary实现了关键词与视频的绑定。

技术实现： jQuery.js+Video

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

标签