Your website needs to tell a story - here's why

Storytelling is important to user experience. Gene Crawford explains how to best communicate what you're doing to users.

I was recently invited to be a mentor for a group working with different startups. My assignment was to listen to their business ideas and visually and technically review their design work. There were many ideas presented and I saw varied approaches to presentation and calls to action at play in the website designs.

Something that stuck out was how often the central idea of the business or core product being offered got lost while these projects were being executed. Most questions I asked exposed a lack of focus on telling the story of 'what this is here for'. Often we get caught up in the millions of decisions made along the path of creating something, and lose sight of how to tell people what we're doing.

Are you sitting comfortably?

To get to the heart of the user's experience of our product, we need to first create it. You can do this by telling a story: start with why the site should exist, then move on to the thing you want as the outcome for a visitor. Once you have this, you can describe the steps they must take to move through the story; each can be a page or interaction point in your design. The story can be the framework you use to execute all the site or app's other details. You'll have a core narrative and will get a sense for the 'voice' or tone the visual work should embody.

Along with creating a story about the user's experience, we have to consider our words. As you create this narrative, you'll begin to get insight into what to use for specific 'calls to action' and details such as labels for buttons or navigation items. This stuff is so important: it becomes the skeleton for everything you'll design in the future. When you're neck-deep in the nuts and bolts of creating a design for that homepage, no detail will be too small and having a story to build on will go a long way.

Here are five examples to check out...

01. Dwolla

The website for money transaction app Dwolla clearly communicates what it does in easy to digest terms. It then breaks its service down into four usage types to make you feel included.

02. You Know Who Design

Design firm You Know Who Design has defined itself as an iOS studio by using concise copy and showcasing its iPad work.

03. Skinny Ties

It's apparent ecommerce website Skinny Ties' storyline revolves around you looking at as many ties as you can stand. It defines this as the key plotline, then cleverly uses interactions to keep you hooked.

04. Chartbeat

Real-time data analytics app Chartbeat takes the idea of telling a story literally with its site design. You uncover its services in a linear narrative, with great graphics and animations.

05. Webflow

Website creation app Webflow's site is only a 'coming soon' page, but it clearly tells its story with good copy. The central experience drives you to check out the demo: precisely what the producers want you to do.

Words: Gene Crawford

Gene's mission is to work tirelessly at providing inspiration and insight for developers. His projects include and conferences such as This article originally appeared in net magazine issue 243.

Liked this? Read these!