design-storytelling-large

The secret to telling a memorable story with design

Joanne Amos's Layout avatar

There’s no getting away from the fact that storytelling has become a pretty trendy buzzword, especially when it comes to marketing. But unlike many buzzwords, it’s unlikely this one will disappear quite so quickly. Storytelling is no mere fad or novelty; it’s an important method of communicating an idea.

Storytelling is the oldest and most potent form of communication known to man. From the dawn of humankind, we’ve used stories as a way of understanding our place in the world and forging connections.

When it comes to web design, promoting “excellent customer service” and “high-quality products” on your website is no longer enough; you’re a dime a dozen in the digital world. But by utilizing storytelling, you can engage users, form a connection, and create a lasting impression. And this will ensure that you stand head and shoulders above your main competitors.

“Storytelling allows you to engage users, form a connection, and create a lasting impression. ”

design-storytelling-impression

The benefits of storytelling

The effect of storytelling on human memory is well documented. It’s widely acknowledged that we remember facts better when they’re laced together as a coherent whole, instead of being presented individually.

As humans, we’re driven by our emotions, so even if we don’t remember the full details of a story, we remember how it made us feel. This is crucial for businesses (even if you sell to other businesses), because your readers are always human.

Stories can help with our understanding of a product or service. Stories draw people in, entertain them, and inspire them to take action.

So as a designer, how can you use design to tell a memorable story?

Know your story

First, it’s essential that you’re crystal clear what the story is. If you have a strong brand story, this can replicate the effects of watching a movie or reading a novel. But if your story is poorly thought out or badly told, you’ll be quickly relegated to the scrapheap of forgotten memories.

One important thing to note is that your story doesn’t have to be the story of how your business evolved; it simply has to be a story that engages your audience and makes sense for your brand. Just look at MailChimp and their adorable, iconic mascot, Freddie.

design-storytelling-story

Map out your story arc

All stories have some critical elements in common – they all need a beginning, a middle, and an ending. This is no different for a website. If there isn’t a specific flow, users become disoriented and lose interest.

At its most basic level, the beginning is your logo and headline. It’s how you’re introduced to your visitors, and it’s the stimulus that piques their interest and makes them want to read on.

The middle is the supporting narrative that demonstrates why you’re so special. This is where you can flesh your story out with an explainer video, introduce aspects of conflict and tension, and demonstrate how your product/service/brand can ease your users’ pain points. To get this right, you need an understanding of your users’ motivation so you can create something that speaks directly to them.

Finally, your story has to reach its climax by way of a call to action, which should fit with your brand goals or mission. Remember, the more engaged your audience is, the more they’ll be invested in your story, and the more likely they’ll be to buy in.

Keep it simple

You’re not trying to recreate Game of Thrones here. A website shouldn’t be filled with plots and twists and turns.

“If your story isn’t simple and immediately obvious, its impact will be lost. ”

You need to grab people’s attention, pique their interest, and make them want to return and find out more.

TOMS’ story is one of philanthropy, and it’s obvious from the moment you land on their website. Their story is simple – for every item you purchase, they will help one person in need. All the elements of their story are visible on the home page, and there are links so you can learn more at your leisure.

It’s simple, effective, and, most of all, it’s memorable.

design-storytelling-memorable

Develop a character

As designers, developing user personas is a key aspect of website planning. We dream up typical users and follow their journey through the site to check it meets their needs. So why stop there?

Stories typically have a hero, a character we root for regardless how insurmountable the odds against them. We become engaged with these heroes and want to see them achieve their goals and finish their mission.

Developing a character for our websites, whether that’s a specific tone of voice, a real person, or a mascot, is a great tool for engaging your customers. An example of this is Customer.io’s mascot, Ami, a courier pigeon named after Cher Ami, a real-life pigeon that saved a battalion of soldiers during World War I, despite being wounded. She provides the company with a story and represents the core of their business – sending mail.

Alternatively, you can set up the website so that the user is the main character at the heart of the story by personalizing the information and involving them directly.

Engage with imagery

It may be a cliché, but a picture really is worth 1,000 words, so use that to your advantage. Placing a large image, illustration, or video in a prominent position on your homepage will help grab your users’ attention and draw them into your story. Choose something that’s relevant to your story and demonstrates your values at a glance.

design-storytelling-imagery

Outdoor company The North Face is a great example. With a mantra of “Never stop exploring,” they’re on a mission to inspire adventure and promote the outdoor life. When you land on their website, the imagery and text inspires adventure and tells the visitor their brand mission in an instant.

This isn’t confined to photographs. GoPro uses video on its homepage to demonstrate the versatility of their cameras, and promote the feeling of community and sharing that’s crucial to their success.

Engage with your audience

Developing and engaging your audience is one of the more difficult aspects of storytelling, but modern technology provides a number of useful tools to help you on your mission.

One way to promote engagement is inviting your audience into the story by introducing interactive elements. Parallax scrolling is a useful tool for this, demonstrated to great effect by Cyclemon. You’re greeted by their slogan, “You are what you ride,” then you’re taken on a journey through their product categories until you see the bike characteristics that appeal to you.

A simple game can also help with focus and provide a fun avenue for website users. Gamification is a system of risk and reward, so you should seek ways that your story can reward users for performing certain tasks. One of the reasons behind Dropbox’s massive growth was offering extra storage to their users by performing certain tasks, which included inviting their friends to the platform. They use a checklist format, which offers a sense of achievement, to measure progress through a series of tasks. Importantly, users can “skip” the game by buying extra storage if they prefer.

Designing your story

Storytelling works, so it should be a crucial part of your web design process. It helps to capture your users’ attention, engage them with your content, keep them on the site for longer, and, if they become invested in your story, they’re more likely to become a loyal customer.

Take the time to find the right story for your brand. If the story doesn’t fit or feels inauthentic, people will be less likely to connect and buy into your brand.

“Remember, it should be your story. Don’t try to be something you’re not. ”

How do you use storytelling when you design a website? Can you add any tips to our list? Tell us below.

Comments ( 0 )

Join the discussion