How to visually transform content and engage readers

We have entered an era where the visual internet is not what it used to be.

once revolutionary H1, H2, paragraph text and one a single image placed to illustrate your story is now a saturated format. Now we want responsive stories with full-size photos, parallax scrolling, and maybe a few data-heavy animations to top it all off.

We don’t just want to believe the words of the stories we’re told, we want them delivered to us in the most interactive, exciting ways possible. Naturally, publishers and brands are experimenting with formats to engage their audiences.

There should be a good visualization voice, that is, the design must match the information it describes. It should be useful enabling the viewer to derive meaning from it, and it should have aesthetic appeal which captures the viewer’s attention and provides a pleasant visual experience.

Visual storytelling is not a new concept. In fact, it’s been around since people turned pigment into stone and made stories on cave walls. However, scrolling stories, visual storytelling in its modern, scrolling form, has definitely advanced due to factors such as technology and visual storytelling tools.

By definition, visual storytelling is the use of images, videos, infographics, presentations, and other visual elements to create a story. It’s a way to draw attention to content in the infobust era.

Scrolling gives the reader a sense of control, exploration, and discoverability. The wraparound format is often, but not exclusively, used by commercial units and content studios for branded content, long-read editorials, native advertising, content marketing, brands communicating their message through storytelling, and even reporting.

Typically, creating a scrollytelling format is done using a landing page builder. These tools can create web pages that are designed to drive visitors to a specific conversion goal and can implement a scrolling design.

Microsoft’s research shows that scrolling has become a pervasive and powerful technique used in data-driven storytelling. The most innovative stories out there use scrolling in creative ways, and advances in web-based visualization technology continue to evolve this dynamic, online scrolling format.

Animation examples

There are many examples of innovative spinners on the web that are more memorable than others. One of my first memorable encounters with published ledgers was The Wall Street Journal’s Cocainenomics, a highly interactive ad for the Netflix series. Narcoswhich outlined the history of the MedellĂ­n cartel.


Fast Company said it contained all the reporting, graphics, photos and videos you’d expect from a curated interactive piece, calling it “a pretty damn interesting editorial snack.”

Another great example Scrollytelling users may be familiar with is the Apple Watch Ultra landing page. Each section on this website has lots of movement, with insights into how the watch was created, interactive diagrams and animations to see the design from all angles. Readers interested in the Apple Watch Ultra aren’t overwhelmed with product specifications, but every detail is highlighted in a concise glossary.


Source:: Apple:

Internal Displacement Monitoring Center noted storytelling “The road was long. a voice from Ukraine” in the journal of their work. Here, a woman named Kristina shares her story of being displaced from Kharkiv in eastern Ukraine to Lviv in western Ukraine. As readers scroll, new illustrations appear with haunting quotes from Cristina and her husband about their experiences during the war.

Voice from Ukraine

Source:: IDMC:

Interview with a Scrollytelling expert

So what does this mean for digital production teams when there are rapid developments in concepts such as Scrollytelling, technological advancements and higher levels of interactivity expected from the viewer?

To understand even more deeply, I asked Nelly Gocheva, Global Editorial Director of T Brand Studio International, An industry pioneer who has won multiple awards for his Scrollytelling efforts, a few questions about what Scrollytelling means to their digital production team.

Question. What does the emergence of Scrollytelling mean for T-Brand Studio’s digital content team?

Answer: We’ve been using the format since the early days of T Brand Studio, because by the time we launched, The New York Times newsroom was pretty used to scrolllytelling. It can facilitate page navigation and streamline the user experience without compromising the interactivity of creativity and overall engagement.

It is especially useful for long articles or structured articles in general where you need constant scrolling. This is where the various scrolling techniques come in, for example it can trigger an animation, automatically play a video, or it can move the reader to different steps or sections of data ie.

Below A favorite early example of “scrolllytelling” is where scrolling is incorporated into the continuous transition of content and particularly data.

cities have come alive

Question. What changes have you seen in the skill set of digital producers since the Scrollytelling format became a highly leveraged business model? What talent and resources should be sought to deliver high-quality Scrolllytelling?

– I think that design and development should go hand in hand from the very beginning of the ideational process, because they cannot work separately. Therefore, it’s important to me to work with a designer or creative lead who is aware of the capabilities (and limitations) of developer and execution, and accordingly, you need a developer with a design sensibility.

At the end of the day, you want to deliver a seamless user experience with sleek design, and that can’t just happen in silos.

Question. The information age has fundamentally changed how we consume content. What advice would you give to up and coming scrolytellers and digital content teams? Is more interactivity always better or “less is more”?

Answer: I would say that the level of interactivity or its complexity depends on many factors. For example, are you creating a mobile-first experience, or are we talking about desktop, because people interact with content differently on different platforms and devices?

But at the heart of it all is the story you want to tell, what is your content strategy, target audience, etc… And from there you can decide on the creative execution, formats and level of interactivity, if any. I’m a true believer in the good old “form follows function”.

Design and development, a love story

Scrolllytelling can be a powerful visual storytelling tool if done right. As this format becomes more mainstream, technology and digital content teams must adapt. The best examples of scrolling stories are created through collaboration between content creators, designers, and developers.

The perfect match is where design and development intertwine. With the right team, resources, and technology, whirlwind can be a scalable, exciting endeavor. There is no doubt. with the endless effects and creative outlet that the spinning format can offer, it can be healthy, useful and beautiful for its many stakeholders.

If you’re interested in experimenting with such high-end digital production tools, you should start with the right web design software. Find the right one for your needs and don’t waste time getting started.

This article was originally published in 2019. It has been updated with new information.

Source link