Improving HTML5 Video: Popcorn Maker for Journalists


As we’ve written about in another Office of Digital and Design Innovation (ODDI) Innovation Series blog post, “HTML5 Video & Next Gen Journalism”, HTML5 video refers to a specification set by the W3C committee and the tools used to display and play video within a web page.

The HTML5 video spec is an open-standard, like CSS and JavaScript.  Since the HTML5 video spec is based on open web standards, application programmers have been able to develop, modify and adapt new frameworks that can enhance video presentations on the web. Popcorn.js is a JavaScript library that is able to make a variety of calls to available web services and integrate them with a video file during playback offering a tool for journalists to connect with their audiences in new ways.

Why should journalists use Popcorn?

– To provide additional context tied to the video timeline
– To present enhanced display options
– To add ‘real-time’, dynamic, social context
– To include editorially-selected text and visual elements from across the Web that bring in additional details and value to a story
– To offer the audience a more compelling experience


According to Adam Martin, ODDI’s Manager of Technology Services, ODDI began the Popcorn project in effort to solve two problems faced by BBG video producers and their audiences:

  1. “How to extend and enhance the life of video content on digital platforms.”
  2. “How to give the audience an opportunity and a reason to engage with content beyond the traditional daily news peg.”

While traditional video packages may capture individual news events at the time they happened, “the supporting contextual data and social content brought in through the Popcorn framework provides a continuation of the story behind what is (just) presented in the video,” Martin sums up.  “This offers audiences a deeper level of engagement as well as a reason to interact with that content even after the original news event has passed.”

How can journalists get started?

An easy step-by-step resource can be found here: How to enhance HTML5 video by synchronizing content with Popcorn.js

For more info:


To contact Adam Martin: OR @adamjmartin

- – - – -

(Thank you to Adam Martin for his contributions to this post.)

(The foregoing commentary does not constitute endorsement by the US Government, the Broadcasting Board of Governors, VOA, MBN, OCB, RFA, or RFE/RL of the information products or services discussed.)

The following two tabs change content below.
April Deibert

April Deibert

April Deibert is the Multimedia Blogger/Producer for the Office of Digital & Design Innovation. Follow her on Twitter: @BBGinnovate and @AprilDeibert.

Leave a Reply

Your email address will not be published. Required fields are marked *

* Copy This Password *

* Type Or Paste Password Here *