Hacking Complex, Ongoing Stories

Summary: a joint post with Tim Davies reflecting on our learning from a recent Berkman Center Network Stories hack-day

There are hundreds of different digital tools for building online stories, and myriad ways to use them. Building stories online often requires creating alternative production and distribution paths for stories, in the context of networked, online communities.

The choice of tools affects the way a story is told and experienced. When starting a new project it can be challenging to work out which tools to use, how to use them and whether they work together.

Over the last few months the Network Stories group at the Berkman Center has been exploring different approaches to storytelling in digital media. This Saturday around 20 of us got together at the MIT Media Lab’s Center for Civic Media for a full day, hands-on exploration of different digital storytelling approaches. We were a diverse group: coders, journalists, data scientists, theorists, filmmakers, scholars and artists.

Our starting point was Global Voices special coverage of the #Shahbag protests in Bangladesh. This story has unfolded over the past year around the contentious issue of justice for war crimes from Bangladesh’s 1971 war of indendependence, in cycles of protest and counterprotest. It is a complex, multi-layered narrative that has received little coverage in the mainstream media in relation to its importance for the future of Bangladesh. We had built an archive of Global Voices and related content, including explainers, mass media coverage of the event, and a selection of tools, so that all participants were starting with the same material. This blog post reflects on our engagement with that content.

Reworking special coverage
The Global Voices special coverage pages are based around a list of content posts on the site, with a brief introduction. The #Shahbag page lists 23 posts, from December 2012 to December 2013, centered around the main period of protests in February 2013, as well as a collection of Global Voices Advocacy posts related to #Shahbag, links to archives of photos, videos, music, social media sites, and platforms and communities dedicated to supporting and documenting the protests.

We set out to address the challenge of how to design an interface for a complex, ongoing story with many sources, incorporating
* ongoing chronicle of stories
* analysis of the data inside those stories (hyperlinks, worldclouds, categories, tags, people)
* databases of participant-generated and witness content (images, sound, video, social media, blogs, maps, etc.)

Much of the day was spent shifting between the whiteboard and laptop screens, experimenting with different ways to organize the post content already on the Global Voices site, while also thinking more broadly about the issues involved in communicating multifaceted stories.

Narrative and technical challenges
Developing a digital interface into a story involves addressing both narrative and technical challenges. On the narrative level, we need to consider:

How to delimit the story. With complex, ongoing stories it can be hard to identify the start or end of a story. The web is littered with platforms and projects that simply fade away or cease to be updated, without a clear point of closing.
Different layers of engagment for different levels of interest. Allowing a reader to enter the story at different points, whether for a quick overview or to explore a story in depth.

Navigation and discovery features. Storytelling platforms and projects use many search and discovery protocols, drawing on images, tags, maps and different archive structures. These influence how readers will find a way into the story.

There are also technical issues to overcome. With hosted tools available for collating and organizing content their stability is in question over the long term. If such platforms shut down or make backward incompatible upgrades, a well curated story can quickly fall apart. It’s important to consider the reliability of platform and plugins,so the story doesn’t break and/or need endless maintenance. We also wanted to consider how a story interface could be kept lightweight in terms of bandwidth and load time, and could function well for a range of different kinds of stories.

Digging in: tactics
We took a number of approaches to look at how interfaces and routes into the story might be created – quickly iterating through a variety of different tools.

Experiment 1: WordPress, Auto-tagging and Impress.js

First up, we grabbed a collection of the Global Voices blog posts related to Shahbag as an RSS feed.

Because Special Features in the site are not currently collected together in any particular tag or category (the curation takes place by adding links to the Special Coverage post) we used RSS feed output from the search for this . (Tip: To fetch the second page of search results on the feed add /page/2/ to the wordpress URL such as in http://globalvoicesonline.org/page/2/?s=shahbag&feed=rss2).

Using the RSS Import module in a WordPress.org install  (Note: own server needed) we set up a copy of all the Shahbag posts in an environment where we could experiment with them.

We first tried using the Impress.js WordPress Plugin to see if we could display posts in a more dynamic and interactive way. It quickly became clear that we’d need to spend a lot more time learning to use the plugin and potentially adapting it for our needs. Knowing another group were experimenting with impress.js we moved on.

We next tested whether automatically applied tags might provide a way into the story – adding to the manual categories that Global Voices already gives to stories. For this we used WordPress plugins which runs post text through Open Calais – a natural language processing tool from Thomson Reuters that identifies people, places and themes within text. The result was an ability to drill down into posts by many more tags and categories, but the set of tags were shaped by the entities already in Thomson Reuters knowledge base. We wanted to compare these tags with the Global Voices curated categories, but found these had not imported properly through the RSS feed.

At this point, we took a step back from Experiment #1 to head back to the whiteboard and think about how we wanted to display posts, and whether the autotagging was really supporting that.

Experiment 2: Filtered post list

We began to explore a simple idea to allow users to reorder posts based on their own interests. Global Voices special coverage pages currently show newest posts first. For a new reader, reading oldest the newest might be more natural. In the current listing, different themes within the story are not brought to the surface. Looking at interfaces like shuffle we started to think about the different themes and threads within the #Shahbag narrative.

Ideally these might be captured within WordPress, but by this point we’d switched to a handcoded approach to get a prototype ready for the end of the day. We made an abortive attempt to scrape data from the Global Voices site using import.io to get at the author names and key images for each post which are included in the RSS feeds. We then fired up a Google Spreadsheet to manually add extra annotations to each of the posts, including thematic classification, key images and author details. On a mirrored copy of a Global Voices page grabbed using wget we used this information to update the web page mark-up to show featured images and headlines rather than just straight post listings. With jQuery it was possible to then add interactivity, so that a reader could pick a theme, and just see the posts related to that them, either in reverse or forward chronological order.

Building on this, we also started to explore how showing all the posts from a given author might provide a route into the stories – displaying the authors profile picture against each story.

We also made a Screencast of the process.


We made progress in thinking about how to build an architecture that allow users to order a series of stories for themselves, based on their interest and prior familiarity. The core idea is to encourage localized search paths within a landing page for the story, controlled by the reader. The goal for the design is to ease entry into complex stories, but be lightweight and functional within a WordPress or other popular CMS platform. The procedure we designed will reorder the content on the page based on different functions, such as timelines, themes, characters, and media types, employing a simple tagging structure. More advanced implementations might allow multiple category sorting, a dynamic visualization of categories along a timeline, a sorting of images from relevant databases based on categories, or tagging images and stories by geolocation, using maps as interfaces. Another alternative might be to allow internal search based on natural language processing tools such as Calais.

This event will hopefully be the first of several in which we will explore different paths and processes in the building of online stories. Other participants have posted their reflections as well, including some thoughts from Matthew Battles on the Metalab site and Heather Craig on the Center for Civic Media blog.