Told Like a Story: 4 Great Examples of Natively Digital Experiences

August 05, 2014 Kayla Silverstein

With so much digital content being produced – and so many new devices, channels and other opportunities for browsing – marketers today are adapting to a new era of content marketing: creating natively digital experiences. Thinking about your brand and its content digital first gives you the best chance of designing something that truly takes advantage of all that interactive has to offer.

I recently attended my first #1NWebinarBuilding Relationships through Interactive Storytelling. In this webinar, One Northerners Kalev and Jessica discussed interactive storytelling, one of the hottest new trends in digital marketing. Some highlights include a brief history of storytelling as a humankind tradition, as well as several fine examples of digital storytelling on the web today (but we’ll get to those later). I found great value in the webinar, and thought I would take a moment to recap some of the key takeaways highlighted by Kalev Peekna, Managing Director, Strategy and Jessica DeJong, Art Director. I should also note that this presentation was the topic of Kalev's Experience Lab presentation in 2013. 

In the webinar, Kalev notes that storytelling is an effective marketing tool. In order to fully understand its power, we'll have to read the following as sort of an A = B and B = C therefore A = C kind of thing:

  1. Stories share an experience – Whether it is to make someone laugh, cry or flinch, stories provide the opportunity to share in an experience.
  2. Shared experiences form and build relationships – Family vacations, work outings, first dates...etc.
  3. Relationships drive success – Relationship Cycle, anyone? Work that loyalty loop.

Makes sense, right? Stories share experiences, experiences build relationships, relationships drive success...so stories are success! Voila!

Digital provides organizations with an opportunity to tell these stories in a unique and immersive fashion. Kalev outlined two common approaches to storytelling, linear and associative. Lets explore some examples of how businesses have been able to elevate their stories by turning them into amazing natively digital experiences.

LINEAR STORYTELLING
Linear stories take your users from a clear start to a defined end. They must capture early interest and build engagement, through questions or open-ended interactions, to encourage users to continue scrolling through your site. Let's check out some examples:

nytimes_toldlikestory

This New York Times site, which was leveraged in the webinar,  is a perfect example of linear storytelling. Notice how scrolling allows the user to progress through the story, and the use of full-width panels draws visitors in with an emotionally engaging image.

Techniques at play:

  • Strong "Next Action" Interactions - When you get into this site, there aren't many directions you can go. There is an arrow directly encouraging you to scroll and, when you do, the actions on the page encourage you to continue scrolling. The navigation is simplistic and minimal: three dots on the right-side of the screen, pointing down the page, further prompting this interaction.
  • "Snackable" Content Lengths - Throughout this piece, the content length is very controlled. Speaking specifically of the moving scroll text floating over the images, no word is without purpose. It's short and to-the-point (i.e. good for munching).

aquatilis_toldlikestory

The Aquatilis site is another fine example. You can see how even the beginning scrolling feature – the icon reading “Inhale” – encourages the user to dive in.

Techniques at play:

  • Narrative Arc - What could be a better subject for linear storytelling than an expedition? From the start, you "inhale" at the surface and dive deep into the page. And the conclusion? A kind suggestion to donate as the page ends on the sea floor.
  • Mixed Content Types - There are scrolling interactions, hover interactions, expanding images, text overlaying video clips and more -  all of which add to the multiple content types on this page that help color the linear storytelling techniques on the site.

ASSOCIATIVE STORYTELLING
Associative stories arrange content in an inter-related network. The structure of these stories allows users to move from piece to piece along their own path. Almost like a "choose your own adventure" novel, the real goal of these sites is to give the user a true, immersive experience while exploring. Here are some examples of associative storytelling:

intothearctic_toldlikestory

Greenpeace’s Into the Arctic site uses immersive imagery and video to draw the user in. This site is a great example of the power of visual depth in associative storytelling – the story is told by the images behind the text, and the user has several navigational tools to further explore the site at their leisure.

Techniques at play:

  • Audio - The narration in the background of this site helps set up the users to do their own exploring on the site while still highlighting the thematic elements of the design. That audio narration draws the user in and warns him or her to "enjoy the view while you can because it's disappearing fast."
  • Strong Transitions - These aren't your average "scroll down to keep reading" icons; these are large, big picture scrolling icons that slide you to entirely new panels. It is dramatic and all-consuming.

getgoing_toldlikestory

The Drexel University Get Going site is another example of associative storytelling. The navigation is guided with arrows, but they’re merely suggestive – the user chooses whether to click forward, back, within the image, etc.

Techniques at play:

  • Immersive Imagery & Video - This is a consistent technique used in both associative and linear storytelling, but I think this site does it particularly well. The combination of the images and the video add so much depth to the picture, and truly draws the user in.
  • Limited Content Weight - There isn't a lot to the different pages on the Get Going site - a few images with text overlay, but that's about it. The images are consistently thematic, though, and work together to convey a message.

As you can see, the layout and design of content differs between linear and associative stories, but both are effective marketing techniques. Convinced by the idea of storytelling but don't know where to start? Take a stab at telling the story of your culture or history in a natively digital way. Marquee case studies are also great candidates.

Any other examples come to mind? Please share in the comments! We'd love to check them out too.

In the meantime, check out some other inspiring sites and articles on current digital trends in our Best of June post, or view a recording of Kalev & Jessica's webinar to get a full download of all the topics covered as it relates to Interactive Storytelling.

Subscribe

The One North Ideas Update delivers each month’s latest posts on digital for PSOs—including industry trends, news and our latest research—directly to your inbox. Although it’s our goal to always include thought-provoking and compelling content, you can unsubscribe at any time. 

See our Privacy Policy to learn more about how we protect and manage your submitted data.

Kayla Silverstein

At the time of publishing, Kayla was a Marketing Coordinator at One North.

One North Interactive 
222 North LaSalle St, #1500
Chicago, IL 60601

+1 312.469.1740