{"id":5002,"date":"2022-10-13T02:00:00","date_gmt":"2022-10-13T00:00:00","guid":{"rendered":"https:\/\/alvarotrigo.com\/epa\/examples-digital-storytelling\/"},"modified":"2025-06-19T17:12:41","modified_gmt":"2025-06-19T15:12:41","slug":"examples-digital-storytelling","status":"publish","type":"post","link":"https:\/\/alvarotrigo.com\/blog\/examples-digital-storytelling\/","title":{"rendered":"21 Top Examples of Digital Storytelling [Make Powerful Stories]"},"content":{"rendered":"\n

In the field of graphic design, communication is the most important part that connects the designer to their audience. A great way for a designer to narrate a story is through a process called digital storytelling which uses a wide variety of digital multimedia to convey an important message.<\/p>\n\n\n\n

\"List<\/figure>\n\n\n\n

In this article, we will be looking at a couple of examples of digital storytelling<\/strong> to understand better how it\u2019s done and why it\u2019s an important part of the design for the 21st century.<\/p>\n\n\n\n

21 Best Digital Storytelling Examples<\/h2>\n\n\n\n

1. Partitions of India (From the BBC)<\/a><\/h3>\n\n\n\n

\n\t\t\t\n\t\t\t\t

\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

This is one of the best examples of digital storytelling.<\/p>\n\n\n\n

The story presented by the BBC uses videos, text, and images to explain the traumatic and painful partition of India and all the events that lead to it.<\/p>\n\n\n\n

Using powerful images and real-time videos gets the point across and make it all very authentic.<\/p>\n\n\n\n

\n\t\t\t\n\t\t\t\t

\n

This storytelling design uses a component called fullPage.js<\/a> which allows you to create amazing one-page stories. Check it out!<\/p>\n<\/blockquote>\n\n\n\n

2. Faeries of Serbia<\/a><\/h3>\n\n\n\n
\"Faeries<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

This powerful video of the Faeries of Siberia created by the students of a university in Serbia portrays the tale of faeries compellingly, making the audience interested in the tale.<\/p>\n\n\n\n

This is one of the best examples of digital storytelling because it encourages the audience to take a moment to absorb the message that is being conveyed through the design.<\/p>\n\n\n\n

3. Stuff<\/a><\/h3>\n\n\n\n
\"Stuff<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

Stuff is a phenomenal new website that puts Aotearoa on the map when it talks about the people of Aotearoa and their stories.<\/p>\n\n\n\n

The thing that sets this website apart is that it uses pleasing visuals, animated gifs, and an intriguing color pallet to guide the users to stick around and read the stories.<\/p>\n\n\n\n

4. Gucci With Savoir Flair<\/a><\/h3>\n\n\n\n
\"Gucci<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

The website for Gucci with Savoir Flair has to be one of the best websites out there. It is simple, beautiful, and interactive and portrays a story about the collection from start to finish.<\/p>\n\n\n\n

5. Saiga Antelopes<\/a><\/h3>\n\n\n\n
\"Saiga<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

This chilling tale of the death of the antelopes in Saiga is made a hundred times more impactful with the use of digital storytelling.<\/p>\n\n\n\n

The intention behind this design was to bring out empathy for the animals and understand the critical nature of the catastrophe that occurred.<\/p>\n\n\n\n

Everything from the images, text, and font to the videos of the expedition makes the entire experience of this digital storytelling website informative yet devastating.<\/p>\n\n\n\n

6. Footsteps of My Ancestors<\/a><\/h3>\n\n\n\n
\"Footsteps<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

Another great example of digital storytelling is this video documentation of religion and culture by a group of students from the University of Kragujevac, Serbia.<\/p>\n\n\n\n

The effective use of videos and images drives the message home and engages the audience and forces them to listen to the message.<\/p>\n\n\n\n

7. Brexit Storytelling<\/a><\/h3>\n\n\n\n
\"Brexit<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

One of the major events in UK history is Brexit and how it affected millions of people.<\/p>\n\n\n\n

This digital storytelling site tells us all the explicit details and statistics about Brexit and makes it easy to digest the information through visuals and minimal text.<\/p>\n\n\n\n

8. NBC News<\/a><\/h3>\n\n\n\n
\"NBC<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

Oftentimes when we\u2019re presented with a bunch of data, it is hard for the human mind to sort through it and remember the specific details mentioned in it.<\/p>\n\n\n\n

But when the same data is presented with the help of visuals and graphs, the data is much easier to understand.<\/p>\n\n\n\n

In this example of digital storytelling, the story of discrimination against Asians has been presented in such a wonderful way.<\/p>\n\n\n\n

It enables the audience to connect with the stories of these individuals and empathize.<\/p>\n\n\n\n

9. The Path of Exile<\/a><\/h3>\n\n\n\n
\"The<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

This video documentary made by the students of the University of Kragujevac, Serbia follows a compelling story about exile that we often read about in our history books.<\/p>\n\n\n\n

The great thing about these digital stories is that it manages to convey information to the audience in a way that is interesting and easy to remember.<\/p>\n\n\n\n

\n

Related article:<\/strong> Great Storytelling Website Examples<\/a>.<\/p>\n<\/blockquote>\n\n\n\n

10. Offerman Woodshop<\/a><\/h3>\n\n\n\n
\"Offerman<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

The human brain pays more attention to visuals than it does to text. This means that any information that is conveyed through a visual is more likely to be remembered and perceived by the human mind.<\/p>\n\n\n\n

Similarly, in this example of digital storytelling, the story about the brand and its ideology has been depicted through images more than words.<\/p>\n\n\n\n

It portrays the story of the brand, its ideology, and what they do without any words.<\/p>\n\n\n\n

11. Imperial College, London<\/a><\/h3>\n\n\n\n
\"Imperial<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

There are multiple ways for digital storytelling to take place and one of those ways is through interactive website design.<\/p>\n\n\n\n

Text on a website explaining things is great, but images and other visuals are even better. This website for Imperial College, London is proof of that.<\/p>\n\n\n\n

\n

Learn more about how to use storytelling in design<\/a> and create beautiful and powerful stories.<\/p>\n<\/blockquote>\n\n\n\n

12. BEAR 71<\/a><\/h3>\n\n\n\n
\"Bear<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

Bear 71 is an extremely troubling story of a female grizzly bear that was constantly surveyed by the Wildlife Conservation offices for over 8 years.<\/p>\n\n\n\n

This digital story recreates the experience of living through that trauma and what it was like for the grizzly bear.<\/p>\n\n\n\n

It incites a feeling of sympathy and pity but also the realization of how much we neglect our wildlife.<\/p>\n\n\n\n

13. Teaching America to Use the Telephone<\/a><\/h3>\n\n\n\n
\"Teaching<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

This incredible video was developed to convey the message that phones can be used for more than just business.<\/p>\n\n\n\n

It used a compelling narrative to drive the message of socializing and connecting with your loved ones without directly saying it in the video.<\/p>\n\n\n\n

14. Toca Boca<\/a><\/h3>\n\n\n\n
\"Toca<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

Have you ever encountered a website that explains the aesthetic of the brand within seconds of looking at the homepage?<\/p>\n\n\n\n

This website for Toca Boca is one of those sites and immediately narrates the story, ideology, and aesthetic of the site without using a single word. One of the best examples of digital storytelling.<\/p>\n\n\n\n

15. Utah Health University Storytelling<\/a><\/h3>\n\n\n\n
\"Utah<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

Design is meant to evoke an emotion in the audience intended by the designer. Design storytelling makes that emotion all the more powerful, like on this website.<\/p>\n\n\n\n

The Utah Health University website uses the image of a burn victim to convey the painful stories from their hospital burn unit.<\/p>\n\n\n\n

It brings forth the narrative of their journey from being burned to a new life outside the hospital.<\/p>\n\n\n\n

16. Spotify Harry Styles Digital Story<\/a><\/h3>\n\n\n\n
\"Spotify<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

This 30-second video by Spotify on Harry Styles is a hilarious portrayal of how obsessed his fans are with his music, but no one more than you.<\/p>\n\n\n\n

This might be one of the best examples of digital storytelling that has been done in 30 seconds with less than 50 words spoken.<\/p>\n\n\n\n

17. Bryce Harper<\/a><\/h3>\n\n\n\n
\"Bryce<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

The great thing about this website is that it uses text as the major part of the design.<\/p>\n\n\n\n

However, it strategically inserts visual aids wherever the data gets complex, just like here where the article is trying to discuss the pitching strategies of Bryce Harper.<\/p>\n\n\n\n

18. Modcloth<\/a><\/h3>\n\n\n\n
\"Modcloth<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

This website design for Modcloth instantly conveys the message that this is an online clothing website meant for women.<\/p>\n\n\n\n

This is a prime example of digital storytelling in website design.<\/p>\n\n\n\n

19. Clearly Gottlieb<\/a><\/h3>\n\n\n\n
\"Gottleib<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

This example of digital storytelling narrates the truth about healthcare law and how it affects the masses.<\/p>\n\n\n\n

The website uses infographics and maps to explain how much private equity has been invested in the healthcare sector in Europe without the user having to read through the entire article.<\/p>\n\n\n\n

20. Dove Reverse Selfie Storytelling<\/a><\/h3>\n\n\n\n
\"Dove<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

Brands have been using digital storytelling to drive up their sales for years, and Dove did the same.<\/p>\n\n\n\n

In this one-minute video, the brand is trying to extend the message that being beautiful doesn’t mean using filters and photo editing tools.<\/p>\n\n\n\n

21. Patagonia<\/a><\/h3>\n\n\n\n
\"Patagonia<\/figure>\n\n\n\n
\n
Visit Website<\/a><\/div>\n<\/div>\n\n\n\n

This unique website design uses digital storytelling to market its stuff.<\/p>\n\n\n\n

They use the stories from travelers and hype up the entire process of traveling and expeditions.<\/p>\n\n\n\n

This way people are encouraged to partake in a journey with Patagonia’s products.<\/p>\n\n\n\n

What Are Digital Storytelling Apps?<\/h2>\n\n\n\n

Digital Storytelling Apps are Apps that enable their users to narrate their stories compellingly. It provides them a way to combine their images, videos, text, and narrations and come up with a story that drives the message home in simple and interesting ways.<\/strong><\/p>\n\n\n\n

Among all the available storytelling Apps we can point out Storyboardthat, Plotagon, Buncee, Comic Life, etc.<\/p>\n\n\n\n

What are the Six Essentials of Digital Storytelling?<\/h2>\n\n\n\n

The six essentials of storytelling are:<\/p>\n\n\n\n

    \n
  1. First-person Pronouns<\/strong>. Using these pronouns will make the message more authentic.<\/li>\n\n\n\n
  2. Dramatic Questions.<\/strong> Ask a dramatic question and then try to resolve it by the end of the storytelling.<\/li>\n\n\n\n
  3. Emotional Stories.<\/strong> Design your story in a way that evokes emotion in the audience.<\/li>\n\n\n\n
  4. Condensed Stories.<\/strong> Make your stories as condensed as you can so that the audience can look at them in one sitting.<\/li>\n\n\n\n
  5. Remove Unnecessary Details.<\/strong> Pace your story in a way that makes the most sense and remove all the unnecessary details.<\/li>\n\n\n\n
  6. Use Your Own Voice.<\/strong> Narrate your story in your voice to elevate the impact of the message.<\/li>\n<\/ol>\n\n\n\n

    Techniques to Create Winning Digital Stories<\/h2>\n\n\n\n

    A few techniques that can help you create impactful, winning digital stories are:<\/p>\n\n\n\n