Design: Engaging consumers through storytelling and single page websites

Single page websites are not a new idea, but with the evolution of web technologies they have become a powerful way to tell stories and to improve engagement and content assimilation.

CadillacMorocco02Instead of a set of pages linked with hyperlinks, which makes for a rather static and traditional navigation, single page websites have a fluid and engaging experience. The design uses scrolling as a main navigation, triggering animations, interactions and content population.  The design, combined with storytelling techniques, puts the user in a mindset of wanting to learn what the story has to offer.

The technique can be used in combination with traditional hierarchy and that is what the makers of Tinke, a fitness and wellness monitoring device, have done on their site. Users can opt to take a tour of the site and they’re presented with other more traditional pages such as tech specs and an FAQ. You can see the site here.

Single page design is also the format Cadillac has used to present their new ATS model as part of the company’s “Cadillac ATS vs. The World” campaign. The site contains traditional navigation to different pages such as specifications and dealers, but when on a destination, the background features beautiful and impactful images and the navigation is mainly vertical, divided by sections. Scrolling activates animations and parallax transitions, and within each section, content is revealed and interactions presented for more.

PeugeotThere are other single page sites where the intent is to simply educate users about a subject, which is the case for Dangers of Hydraulic Fracturing. This site illustrates the whole path to get gas by pressure, educating the user along the way.

Some brands have embraced the single page technique and used it to literally tell a story in the shape of a graphic novel, cleverly incorporating the product within it. That’s the case with the Peugeot Hybrid 4. You can see the site here.

In all of these examples, the interface used is a perfect medium for the narrative; starting from top to bottom and using impactful graphic elements and illustrations combined with interactions and animations to tell the story. Containing the content within one page also helps to keep the fluidity of the message.

But there are some considerations when creating this type of experience, such as:

  • Know your audience. Is this the best technique for your website? Or, is your audience on mobile?
  • Create a well defined message. It’s through the narrative that people are engaged.
  • Consider your total website size. You may have the best message, but if your site is heavy and slow, that will play against you.

Single page design is a powerful technique which is becoming the standard for certain types of websites. There’s no doubt it can be an effective tool to engage your users and tell your brand story.