Search form

Main menu

Heather Craig focuses her work on the connections between interactive media and community engagement. At the Center for Civic Media, Heather works on projects related to civic data collection and interactive storytelling and co-organizes the DataLore Hackathon.

Exploring video storytelling tools at #netstory hack day

This past weekend the Networked Storytelling group hosted our first story-hack day at the Center for Civic Media. The Networked Storytelling group, based out of the Berkman Center, explores new forms of storytelling with digital media. During the story-hack day, we formed small groups and each group explored a different approach to audio-visual storytelling. One group created an experimental, audio narrative experience, another used impress.js to create a browser-based presentation, and others explored video tools and information architecture challenges.

My group experimented with creating stories on various video platforms. We started with a list of video storytelling platforms - including Korsakow, Mirocommunity, and Pixorial - but narrowed our scope to PopcornMaker, Popcorn.js, and Zeega. Here’s the breakdown of our experience with each tool:

PopcornMaker:PopcornMaker, released by Mozilla in 2012, allows users to create interactive video using content hosted around the web. PopcornMaker is an extremely intuitive web application, allowing users to insert video from YouTube or Vimeo and do basic video edits like cutting and re-ordering clips. The amazing feature of PopcornMaker is the ability to add “Events” to the video track, which could be a simple text popup or content curated from such sources as Wikipedia, Flickr, or GoogleMap. The events are triggered at specific timecodes on the video track, so the events can add context and interactivity to video content. We tried experimenting with inserting YouTube comments as events on a video track, so the comments are integrated into the video viewing experience. Based on our experience, PopcornMaker is a very intuitive platform for interactive video editing.

Popcorn.js:Popcorn.js is also a part of Mozilla’s Popcorn project but, unlike PopcornMaker, it’s catered toward developers and enables more advanced interactive web videos. Popcorn.js is a javascript library that allows for time-based events in a web browser. For instance, you can embed a YouTube video in a website and have photos, maps, or text dynamically appear on the site based upon the timecode of the video. It’s a powerful library, which is why it powers the interactivity behind NFB’s One Millionth Tower web documentary (part of the Highrise Project). We experimented with using popcorn.js to trigger text in a web browser alongside a YouTube video. While creating a full web documentary with popcorn.js would take more than an afternoon, based on our initial tinkering this javascript library is an effective tool for online video interactivity and allows users to create their own plugins.

Zeega:Zeega allows users to create stories using content curated from around the web (Flickr, Soundcloud, Tumblr, etc.) and content uploaded by users. It’s fairly intuitive to create a “Zeega,” as it’s a drag and drop interface that allows you to create a story in minutes and Zeegas can be shared directly to Facebook and other social media sites. While we found the process of creating a multimedia story fairly easy using Zeega, the platform doesn’t lend itself to complex narratives or a polished story. For instance, while you can pull in one long audio track, Zeega doesn’t allow you to edit the audio. Zeega offers an accessible storytelling experience with the trade-off of limited customization. In our group, Aimee Corrigan spent much of the afternoon experimenting with Zeega and concluded that she would consider Zeega for a presentation or for an audio-visual project that requires a very quick turnaround, but not for a complex story.

The Networked Storytelling group will continue exploring new forms of narrative and we plan to host future #netstory hack days focusing on new forms of narrative.