I often see our customers making pretty cool interactive videos using the timeline module of our online video platform. Most of our customers use the standard features, but a lot more is possible if you have some basic knowledge of JavaScript, CSS and HTML5.

By using these timeline features in combination with our player API you can do some pretty cool things. For example, increase your customers’ video watching experience by letting the video interact with the page it is embedded on.

With our timeline module you can easily call JavaScript methods on the page the video is embedded on from certain user actions or even just by reaching a certain point in the video. These JavaScript methods can do anything you want including toggling CSS classes (toggle the lights in the demo) or add, show or hide other elements on the page which are relevant to the current topic in the video. For example showing a map of the location the video is shot, or providing extra background information on that topic from another source like Wikipedia.

Some other useful things you could do with interactive video in combination with JavaScript:

  • Add a “buy now” button on any product shown in the video which integrates with your e-commerce system
  • Track your visitor and show different form elements based on what point your user is in his or her costumer journey
  • Show ads on the surrounding page about keywords from the video
  • Keep score of a quiz or game within the video
  • Show related video’s about the current topic at any moment in the video
  • Show related twitter feeds, Facebook comments etc.
  • The possibilities are endless. If you can think of it, it’s probably possible.