Visual Storytelling: Designing for the Web in a Nonlinear Format

Telling a good story just isn’t as simple as it used to be. At one time, all you had to do was adopt some silly voices for the different characters, add a dramatic twist in here and there, and BOOM. You’ve got an entertaining yarn for the ages. Nowadays, you’ve got to include a multimedia presentation replete with corresponding and compelling imagery.

It’s bad news if you’re a parent trying to get your kids to sleep. For web designers, however, it’s the beginning of a stunningly beautiful future.

Substance before Design

You can create a visual masterpiece, a panoramic plethora of treats for the eye, but if it doesn’t have a point, then it’s just… pointless.

The idea behind web design, in relation to storytelling, isn’t to overshadow your message with gaudy and impressive visuals. It’s to create a cohabitation of story and sights that complement and enhance one another.

In order to accomplish this you have to start with the story. So before you even consider what sort of iconography, symbolism, or imagery you want on your website, begin by crafting an effective narrative for your brand.

What is the moral of your story? What are you offering, and where do your customers fit within the plot you’re creating? Ask yourself these questions and move forward from there.

Nonlinear Visual Storytelling

While it’s important to note that each element of your website must adhere to an overarching theme, you also want each element to be standalone. Because you never know which page of your site a visitor may land on, it’s important that they be able to find their bearings within the story you’re telling.

To manage this, you have to provide content-orientation cues. In other words, bookmarks that will help your visitors understand where they are, and what the content they’re looking at has to do with your brand in general. You can do this with your main text on each page, but also with all of the smaller pieces of text. Things like:

• The URLs
• Headings
• Navigation labels
• Hyperlinks
• And button text

Being descriptive in each area of your site will help your visitors get a feel for your brand’s narrative, regardless of which part of the story they start off with.

Elements of Visual Storytelling

Images are essential to visual storytelling, and you need to be sure that you have a web design platform that’s compatible with all of your creative ideas. After all, there’s no way to paint a masterpiece without a proper canvas.

The way you use images in your web design is almost unlimited in variability, and that makes them much more interesting as a consequence. You can use visual cues to direct attention, such as a pointing finger, or a photograph of a person staring in a certain direction. Or a symbol to put a universally recognized theme on display. An example of this would be Superman’s “S” shield as a symbol of heroism.

You can also use iconic imagery, which is perhaps not the definition you may be used to: having a fixed formulaic style. Iconic in this case means that it looks like what it’s representing. A glyph for the men’s room at the airport is an iconic image. From the iconic to the mundane, there are a lot of different options for a visual storyteller to choose from.

The fundamental elements of visual storytelling even go beyond imagery. You can use unique or eclectic forms of typography to set certain sections of your text apart. You can even decide you want your entire site in an uncommon font to display your modern appeal. Just stay away from Comic Sans. You’ll attract an undesirable response.

Telling the Story

There are three key directives when attempting to tell a visual story in your web design:

1. Understanding Your Audience

Your understanding of your audience should inform your storytelling. In fact, it should be your guiding influence. Who are you speaking to? What do they need? How will you provide it for them? These are the questions you should ask when making visual choices for your website.

For example, are you promoting an offer with an expiration date? If so, it’s a good idea to display images that convey a sense of urgency. Red is an impulsive color with which to highlight the deal, and images of a ticking clock could be effective symbolism for such an occasion.

In the same vein of thought, it’s important to understand your audience so that you can better keep them attentive and engaged. User experience is the number one concern for today’s website owners. So keep it attractive, but more importantly make it interactive. If a visitor can be their own narrator in this visual narrative, they’re twice as likely to become a follower, subscriber, or customer.

2. Clearly Defined Goals for YourStory

This goes back to your moral, though it’s a bit different. Your visual narrative should be moving toward an end result. Even if it’s doing so in a nonlinear fashion. The end result, in and eCommerce setting, should be the conversion. If your site is designed to draw in advertising revenue because of high volumes of visitor traffic, then you goal should be to inform and entertain.

Don’t be satisfied with simply having a website for the sake of being a high-tech hobbyist. Include a meaningful direction in your visual storytelling.

3. Concise and Lucid Meaning to Your Visuals

All of this talk will end in stuff and nonsense unless you choose carefully correlated imagery to go along with your message. It’s not enough to throw striking imagery up on a web page for its own sake. You’ve got to include images that add to, or connect with your narrative. That means staying away from anything too abstract. Unless, of course, you’re selling surrealist art. Then abstract makes a lot of sense for you.

To be clearer, every aesthetic choice you make on your website should be carefully considered in relation to the story you wish to tell. To go even further, it should relate to the impression you want to give in this particular segment of your story.

For example, a serious subject matter requires stark and severe imagery. Darker, more subdued colors along with Helvetica style fonts would be appropriate. A site designed for humor should feature silly pictures, cats are usually a good choice.

Concluding

Storytelling is the oldest form of entertainment, and it’s still the most popular. The methods have gotten more advanced, but the thematic elements remain the same. Take your time while developing your online narrative, and be sure to make it shine with serendipitous visuals.