digital strategy icon

Do's and Don’ts of Digital Storytelling

Brandon Morrison, Senior Developer
#Creative | Posted

How do you tell a good story?

Conventional wisdom tells us to address the 5 W’s: who, what, when, where, and why. After that, how you tell your story varies dramatically depending on the medium you’re using. Telling spooky ghost stories around a campfire takes a flashlight and a flare for the dramatic, while directing a film takes a good eye and an obsession over details.

In many cases, there are basic conventions around the best storytelling methods around various mediums. In film, you have transitions, storyboarding, narrations, etc, while book authors have chapters, footnotes and vivid descriptions.

This gets tricky when you tell stories online. Because the web is such a new medium, many of the basic patterns and conventions haven’t quite shaken out. It’s easy to get lost in the variety of options you have around the formatting, design, and interactivity of your material. With different UX trends proliferating and fading into obscurity every other week, what are the concrete “dos and don’ts” of digital storytelling?

In this blog, we explore several great examples from NPR and the New York Times, examining what makes them effective and how you can apply similar concepts to your own work.

Structure Stories within Given Constraints

Theoretically, the sky’s the limit when it comes to digital storytelling. But technological advances can be both exhilarating and distracting. It has become too easy for us to get swept up in the display, prioritizing the gilding over the actual object (for us, the narrative).

In this context, constraints provide the necessary structure to prioritize what’s actually essential to your story. Organizations regularly deal with constraints around budget and resources (particularly the availability of an in-house development team). Timeliness is another important constraint – for news organizations in particular, the turnaround time of developing and publishing content has a major impact on how that story can (and should) be told.

NPR worked around two specific constraints when producing this digital story on deforestation in Brazil. First, an audience constraint: they needed to mirror the radio-style story expected by NPR’s listeners. Second, a resource constraint: sophisticated video segments require enormous human capital to produce. Working with photographs instead of video, NPR managed to tell an even more powerful story, using a slideshow format that had the feel of a radio segment.

Screen shot of NPR  screen

It would have been easy to go nuts with dramatic videos of the diminished Amazon rain forest. But working within their given constraints, the team at NPR managed to create a digital story that stayed true to the intended narrative. The striking photography slides structured the message in a way that would ring true for the chosen audience.

My point – learn to appreciate your constraints as excuses to exercise a little restraint and a lot of creativity.

Rethink Your Maps

For this section, I borrow some data visualizations from Danny DeBelius of NPR, who said, “nothing is certain in this life but death, taxes, and requests for geographic data to be represented on a map.” No truer statement has ever been written.

So, your typical map of the United States looks something like this…

image of map

A nice looking map, but it doesn’t do a very good job of telling the story it’s meant to tell. While it represents the states geographically, this map fails to give proper visual weight to states small in size but large in population. Because the key message of the visualization has to do with population density, not geography, this map is ineffective at best, misleading at worst.

To correct this issue, consider using a cartogram, a map where geography is distorted to correspond with the more appropriate variable. In the map below, Adam Cole of NPR created a cartogram in which states are sized according to electoral votes and ad spending:

image of united states sized according to electoral votes

A tile grid map is another option that allows each state to have exactly equal weight. This one was created by the NPR Visuals team to explore the idea of a hexagonal tile grid map:

hexagon tile grid map

Like all visual elements, maps should serve your greater story arc, not detract from it. Don’t be afraid to move away from traditional geographic maps if your narrative would be better served with cartographs or tile grids.

Take Advantage of Intuitive Interactivity

The New York Times has digital storytelling down to a science. The news outlet, which recently acquired one million digital subscribers, makes a point to take advantage of the natural way its readers interact with stories on the web. This is most evident in the scrolling mechanism used in many of its long-form interactives.

“Greenland is Melting Away” is an amazing recent example. As you scroll down, the story unfolds automatically, each element revealed through the intuitive mechanism of scrolling. There is an element of guided discovery; the reader gets the feeling of interaction without the interruption of clicking. But although the reader controls the pace of discovery, the streamlined structure of the interactive serves as a tour guide, walking them through the narrative one step at a time.

image of glacier in Greenland

 

The zooming map in this story is not only an impressive technological achievement, it is an intriguing storytelling mechanism. The zooming-scroll effect gives readers a relevant geographic perspective, while at the same time drawing them into the story and giving them that feeling of discovery. By taking a common pattern (zooming map) and twisting it with the interactive element, the storytellers have created a powerful new engagement tool.

Of course, most digital teams do not have the capability to seamlessly fuse a satellite image with a local photograph to create a zooming map. But the concept of intuitive interactivity is widely applicable and extremely useful for captivating audiences.

Learn from your Software Team

At the end of the day, creating a digital story is a project… a project not so unlike a software implementation project. Writers are contributing to the product from a story perspective, while art directors and designers are contributing from a visual perspective. Each group has a different skillset, but it’s crucial that you all come together under a singular vision of the story. To do this, take a few hints from your software development team.

Software teams embrace an agile project methodology, which involves incremental and iterative steps towards a shared goal. Developers are constantly unit testing, iterating, and prototyping collaboratively. The idea is that with each step forward, we check in with our team to ensure we’re still on the same page. I’d recommend reading more about agile development and modeling your own process in a similar way.

Brandon Morrison

Senior Developer