Go to content Go to sidebar

Give Your Users A Hollywood Experience

I love the movies.

Going to the cinema is one of those experiences that can truly feel like you’re being transported to another time and place. When combined with a big bucket of popcorn and a choc-ice, a trip to the movies is one of those rare moments that borders on magical.

Except, of course, when the story sucks.

No amount of special effects or great acting can save a poor story. In his book Story: Substance, Structure, Style and the Principles of Screenwriting, Robert McKee suggests that the story is the single most important factor in determining the quality of a movie (or novel, or play, or whatever really). I would agree.

Cover image of the book Story by Robert McKee

It turns out there’s a real science to storytelling, and in his book, McKee references hundreds of classic (and not so classic) movies in order to distil the essence of what makes a good story into a set of guidelines. I first read Story over 10 years ago, when I was harbouring ideas for writing a novel. It was a truly enlightening read, and I highly recommend it for any budding novelists or screenwriters.

Telling Stories To Our Users

How does this relate to User Experience Design? Well, when someone visits your website, you are in fact telling them a story, whether you intend to or not. So you better make it a good one.

An image demonstrating that a website owner is a director in a movie of their making

Oh, and those visitors to your site? They’re not passive viewers, munching away on popcorn. They’re part of the story. They’re the protagonists, and you are the director.

I believe that, as designers, we can learn a lot from Hollywood’s finest.

Bringing Hollywood To The Web

Here are a few tips that McKee touches on in his book. He says:

  1. know your protagonist
  2. stick to the genre, and
  3. create gaps for the protagonist between their expectations and the result.

Let’s take a look at how we might apply each of these to the world of user experience design.

Know Your Users

McKee advocates really getting to know your protagonists, so that you can paint an interesting backstory and really get inside their heads. The same applies, of course, to the users of your website. In The Silence of the Lambs, Clarice Starling was the protagonist, and we come to learn quite a bit about her over the course of the movie. A lot of what we learn is courtesy of Hannibal Lecter, who asks her a lot of questions — about her past, her goals, and what keeps her up at night.

In the UX world, we call this data gathering exercise user research, and we use it to create personas, which are representations of our users. Here’s what one for Clarice might look like:

An image showing what a persona of Clarice Starling might look like if she was a representative user of our website

We’ve got her name, her age, occupation, hobbies, and most importantly her goals for using our product, and when and where she’s likely to use it.

There are a few different techniques for collecting this information.

  • We can ask our users, like Hannibal did (“Quid pro quo, Clarice!”)
  • We could also run a survey
  • We might perform some one-on-one interviews
  • We may even run some focus groups

The problem is, people don’t always do what they say they do. A more reliable way to collect data is to actually observe people using your site.

The Tools of Observation

We can do this in a number of ways:

  • We can look at website analytics
  • We can run an eye tracking study
  • We can do some contextual inquiry, where you sit with someone and ask them questions as they work
  • We can do some good old user testing

Stick To The Genre

The next tip that McKee gives in Story is to stick to the genre. Let’s consider another great movie — Se7en.

The DVD cover of the movie Se7en starring Morgan Freeman and Brad Pitt

The reason it’s such a great movie is because it doesn’t try to be anything but a crime movie. There’s no unnecessary love interest, no supernatural element, no superfluous subplot. The director stuck to the conventions for that genre.

So what genre is your website? And do you stick to the conventions for that genre?

  • If it’s a Corporate site, does it use the right colour palette?
  • If it’s a Community site, are there tools that help people connect?
  • If it’s a Content site, does the design support the content or does it get in the way?
  • If it’s a Commerce site, does the design complement the products or compete with them?

Here’s an example of a website that I think does a good job of sticking to its genre:

A screenshot of the website Foodzie.com

Foodzie is a site for ordering gourmet food online in the US. It uses this lovely grassy green throughout, with rough edges and a home-made paper texture in the background. There’s a lot of earthy, organic imagery, which is a good fit for the stuff it sells.

Here’s a similar site, operating in Australia:

A screenshot of the website foodo.com.au

When you look at the foodo site, what stands out? Those cutsie, colourful illustrations that my 5-year-old daughter would love. But this isn’t a kids’ site! It’s for ordering expensive rhubarb juice and blue cheese! There’s a disconnect there — the site doesn’t follow the rules of its genre.

Mind The Gaps

Lastly, McKee talks about creating gaps between a protagonist’s expectations and the result. The theory here is that the protagonist is going about his business, them bam something happens which throws his or her world out of balance, and the story lies in the journey that the protagonist takes to get that balance back.

We can represent this in a diagram, like this:

A diagram demonstrating the gaps between a protagonist's expectations and the result, which form a quest.

Let’s look at Star Wars as an example. Luke is cleaning a rusty old droid, when unexpectedly, a hologram of Princess Leia appears. This is the first gap. It kickstarts his journey to find Obi Wan, who then tells him that his father was a Jedi knight who was killed by Darth Vader … another gap in expectations. Towards the end of this epic quest, when Vader tells Luke “I am your father” there’s another gap that needs resolving. You can see how this series of gaps forms a quest for our protagonist, as he continues towards his object of desire (presumably, to defeat the Empire).

Translating this to websites, each of those gaps occurs when our website does something that our user wasn’t expecting, usually not in a good way. So we want to minimise these gaps and avoid surprising our users. We don’t want them to feel the anguish that Luke feels when he learns who his father is — quite the opposite.

A diagram demonstrating the gaps in expectations that occur for users of a website.

One way we can do this is to use mental models, which is a fancy word for how our users think our website should behave. The key is to make sure we design based on those mental models, and not on the underlying technology. Which is basically what user-centred design is all about.

Summary

To recap, we looked at a bunch of storytelling principles and how they can be applied to designing more compelling online experiences.

Those principles were:

  1. know your users
  2. stick to the genre, and
  3. minimise the gap between a user’s expectations of your website and how it actually works.

I definitely recommend you check out Robert McKee’s book, Story, and I encourage you to embrace some of the techniques I’ve mentioned here if you’re not using them already, to avoid your website becoming the Battlefield Earth of websites.

DVD cover of the big budget Scientology flop, Battlefield Earth, starring John Travolta.

This post is based on a presentation I gave at Ignite Melbourne on November 31st, 2011. Thanks to Mark Mansour for the opportunity!

Ignite Melbourne

If you’re in Melbourne and free on Wednesday evening, why don’t you come along to Ignite Melbourne at The Apartment on Little Bourke Street?

There will be a bunch of presenters, and I’ll be one of them. My talk is titled Give Your Users a Hollywood Experience. Here’s a sneak peek at my first slide …

Ignite events are run worldwide and follow a unique format—every presentation has 20 slides and lasts only 5 minutes, with each slide advanced automatically every 15 seconds. This is the first time I’ve given a presentation in this format, and I’m excited about being part of it. I’ll also have a few copies of my kids’ book available for sale on the night, if you’re looking for a Christmas present for a little person.

Hope to see you there!

Letters and Numbers

The lovely Lily SernaI recently appeared on the TV game show, Letters and Numbers, a deliciously nerdy affair where contestants compete to solve anagrams and mathematics problems.

Apart from when I was 8 years old and won a drawing competition on Channel 10’s Saturday morning cartoon show, 10/10, this was my first experience with being television.

I wasn’t victorious, but my children’s book got an amazing plug. With some time to digest the experience, I penned some thoughts about being on camera, juggling my competitive streak, and guerilla marketing over at charlieweatherburn.com.

I also put together a highlights reel for your viewing pleasure — 30 minutes condensed down to about 7. Enjoy!

Read Letters and Numbers on charlieweatherburn.com

Tags: , ,

« Previous