What is interactive storytelling... and why should I add it to my digital offering?

Insights

You see interactive content, you engage with interactive content, you are blown away by interactive content, so why not create interactive content?

16 may 2023

6 min read

Written by Andiana Cáceres Martínez

Webby winning interactive timeline for Red Bull about the 'History of Breaking'.

“Content is king, but engagement is the queen” - I’m sure we’ve all read variations on this common phrase many times before. If only a form of storytelling existed that’s renowned for both boosting engagement and showcasing amazing content? Hold our beer!

Interactive content is statistically proven to earn twice as much engagement as static alternatives, and we’re so passionate about pushing its boundaries we decided to take the time to write a post about it. So, if you want to identify the value of interactive storytelling and how it can transform your digital experiences, read on!

Spark AR 3D helmet filter for Red Bull F2

We created a Spark AR filter for instagram that allowed users to try on a Red Bull helmet before the race.

Illustrated gamification to allow users to explore F1 Max Verstappen's mansion in Monaco

Interactive storytelling? Say whaaaaaat?

Interactive storytelling is the art of telling stories enhanced with technological, social or collaborative features that require active engagement from the audience.

Elements like quizzes, carousels, maps, polls, hotspots, sound bytes and videos directly involve the user in the experience by allowing them to click, scroll, listen, watch or take action, making them part of the journey, not just a passive observer.

As they are in control of helping the story unfold, they are more likely to engage.

So, in an era dominated by viral content and TikTok videos, are you doing what it takes to make your longer form content stand out?

11th Hour Hero Screens

Interactive microsite created for 11th Hour Racing to promote their feature film Shaped By Water.

How will interactive storytelling benefit me?

It’s a fair question. Compelling content alone often isn’t enough to create meaningful connections with your audience anymore but we know you need more than ‘because it looks awesome’ to make an informed decision. While benchmarks show dwell time for normal articles is 36 seconds, we've recorded up to 22 minutes on a single page. Click through rates (CTR’s) on articles are normally under 5%. Recently, we saw an increase on a site we built going up to 587% in the first two weeks. We've also proven to increase outbound click through rates by 15% for documentaries housed on OTT platforms.

‍

So… why wouldn't you want this?

And alongside boosting engagement and meeting targets and KPIs, what are some other simple benefits of utilising this style of storytelling?

Through techniques like illustration, animation and flawless design the message can be more memorable.
‍

Say goodbye to standard CMS templates, experiences can be completely bespoke and personal to you.
‍

Multiple forms of media can be seamlessly incorporated.
‍

With higher visibility, new audiences can also be reached.
‍

Through the use of no-code platforms like our partners Ceros, Webflow, ReadyMag, Wirewax and Vev, coding is not necessary during the design or publishing process.
‍

Provides great content to post on social media feeds.

Illustration - Character Design

Character design created by HLabs illustrators

Allure-interactivemodule

Shoppable module templates that have helped Conde Nast generate over $50 million in revenue.

No Code Hero - All Examples

A selection of HLabs portfolio of digital web experiences built on 'no code' platforms

Four top tips to help create an engaging interactive experience

If you’re excited to incorporate interactive storytelling into your content portfolio but want a few top tips on how to make it the best it can possibly be…read on!

‍Set clear targets and goals

By having clearly defined KPIs beforehand it makes it easier to create a strategy and the appropriate narrative.

‍Stick to your brand guidelines, style and tone

While the design and displaying of content may differ, the experience should still unmistakably be compatible with your brand. Think colour, type, logos, tone of voice.

‍Know your target audience

By knowing who to aim for, it’s easier to pick what interactive elements to focus on. For example, do we want audio? Should it be gamified? Illustration or photos?

‍Dream big

Want a customized 3D alien randomly appearing on the screen? Ask for it! Our team of designers and tech developers love nothing more than finding innovative solutions to unique requests that will boost an experience.

No Code Hero - All Examples

A selection of HLabs portfolio of digital web experiences built on 'no code' platforms

Illustration - Character Design

Character design created by HLabs illustrators

Allure-interactivemodule

Shoppable module templates that have helped Conde Nast generate over $50 million in revenue.

What’s a Rich Text element?

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.

Static and dynamic content editing

A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!

How to customize formatting for each rich text

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.