netmagFeature

Storytelling conventions on the web

In this excerpt from A Practical Guide to Designing the Invisible, which goes on sale today, Robert Mills looks at storytelling conventions that help us design stories relevant to our target audience and explains how we can learn from other media to improve our online stories

This excerpt is Chapter 22 of A Practical Guide to Designing the Invisible by Robert Mills.

In the last chapter we defined story and narrative, looked at why it’s such a valuable  communication tool, and how it works on a subliminal level. Now it’s time to talk about  storytelling conventions that will help us design stories relevant to our target audience.

Media studies textbooks usually discuss narrative theory as it relates to film. We can also use it  on the web, but we need to keep in mind that:

"Narrative theory suggests that stories share certain features, regardless of media and culture.  Particular media are able to ‘tell’ stories in different ways."
(Branston and Stafford. The Media Student’s Guide)

This means that while we can learn from the narrative theory of other media, we have to  modify it to suit the web. Our goal – engaging an audience with our story – is the same, but we must tailor our stories to suit the media we’re telling them with.

Advertisement

Narrative theory

Traditional narrative theory came from studies into folk tales and fairytales. These types of  stories are primarily concerned with character function and plot development. We can’t just  take these and apply them to the web: when would we ever design a website with a clearly  defined hero and villain?

What we can take from these stories is how a set of conventions exist for each media. This  consistency will help audiences engage with, and understand your story.

For example, if you  go to see a disaster movie you probably know enough about that genre to have certain  expectations about what will happen. Similarly, many users these days know different types of websites, and so will have a level of expectation about how they will function.

Learning from other media

Narrative is evident in many media including photography, comic strips, and films. We can  learn from these to improve our online stories.

Photography

Narrative is usually thought of in relation to movies and books. But it is also present in photos.  A photo captures a moment of time, but a great photo makes us imagine what happened  before the moment was captured, or what happened soon after.

Image credit: www.officeforward.com/the-moment-just-before-the-pain-begins/

Narrative is signalled here, depending on the content of the photograph. Don’t underestimate  the power of imagery as a contributor to your story.

Film

The power of film is how much it can communicate at once through visuals, costume,  cinematography, dialogue, character function and story.

Films can teach us the art of slowly revealing a story, piece by piece. They can also teach us the value of deciding what to show (and not to show), what adds to the story, and what is
simply ‘noise’. Like film, the web is really visual storytelling. A great example of visual  storytelling in film is the Disney Pixar production, Wall.E. The movie has relatively little  dialogue, with emotion conveyed through expressions and gestures.

The Director of Wall.E, Andrew Stanton, knew the story had to be engaging for the film to work  without dialogue. He says “action is more generally understood than words. The lift of an  eyebrow, however faint, may convey more than a hundred words” (The Art of Wall.E, Tim Hauser).

Online, we don't even have the luxury of expressions and gestures. That means we have to  focus on the details. Great storytelling doesn’t come from dialogue alone.

The lack of dialogue in silent movies, Wall.E and on the web, forces the creator to tell the story  in other ways: through visuals, colour, hierarchy of information, content and so on. As Stanton says, “simplicity and clarity give the visual storyteller room to grow”.

On the web we can’t just throw in some dialogue to explain everything. It has to be inferred and  laid out by carefully choosing:

  • Imagery
  • Tone of voice of the copy
  • Symbols, icons and colours
  • Hierarchy of information
  • Navigation

As you can see, we need to bring together a number of elements to tell stories online. The lack of dialogue is also a limitation of the web as a storytelling medium. We need to consider what  the web can do that other media cannot, as it will have a significant impact on our story and how we tell it.

Storytelling constraints online

In many ways the web is an ideal storytelling platform because it’s largely concerned with  presenting information. But there are some constraints you need to be aware of when  storytelling on the web.

Truncated communication

Sometimes the web restricts the amount of information we can give. This, along with it needing to be scannable so users can find the information they need, means we need to tell our stories quickly and efficiently.

Non-linear narrative

There’s no guarantee that users will land on your site’s homepage. They could land anywhere  on your site, which means they may be joining the story partway through. Your site need clear  signposts and well-considered navigation to let them know not only where they are, but also  where they can move to next (and how they can get there).

You need to decide where your story begins. This will have a profound impact on the story that  follows. Thinking back to Little Red Riding Hood, imagine how different the story would be if it began with the wolf eating Little Red Riding Hood.

Communicating the tone of voice

You can achieve tone of voice through the words you choose – informal or formal, full or jargon or easy to read. Even the sentence structure can influence the tone and pace of the voice.

Finding your story

Before you can know what conventions will help you tell your story, you need to know what that story is and, just as important, who it’s being told to. Once you understand that, you can start applying the conventions. Who are the characters? What codes will be useful? What will the  tone of voice be? Learn from other media, but don’t forget to adapt the conventions to suit the  online environment.

Log in to Creative Bloq with your preferred social network to comment

OR

Log in with your Creative Bloq account

site stat collection