The rapid development of websites, blogs and apps has opened up new and exciting platforms for narrative illustration, both for commercial communication and personal creative expression. Creating, sharing and experiencing illustration can be immediate and widespread. New voices can be heard, new audiences reached. Collaborations with designers and programmers can support illustrators to explore new layouts beyond the printed page (although the current ways we can access and view digital media may limit some illustrators’ dreams). Readers can participate in stories in new ways, give instant feedback, or control the way they read the story. Infinite scrolling is possible. Images move, music plays, links are clickable, #productintegration…
But beyond the current popular use of illustration in digital media – as part of website design, on-boarding for apps, or posts on Instagram – how are illustrators creating innovative narrative-led work in this new ocean of digital possibility? Below we explore the work of illustrators who are utilising the strengths of narrative illustration (story-led, emotional connection, combination of text and image, sequence and the effect of time) and critiquing the systems and structures inherent to specific digital platforms, to create new forms of narrative illustration.
Taking flight with Twitter
German illustrator Christoph Niemann‘s exploration of Twitter as an outlet for live illustrated storytelling turns tweets into a new version of reportage illustration. Often publishing with the New York Times, Niemann has created engaging live draw and tweets: drawing while running the NYC Marathon, or live illustrating tweets as they were posted during the Republication Party Convention in 2012.
Twitter’s structure of bite-sized text and accompanying images makes it quickly readable for a follower (and quick to produce as an illustrator). When an audience can follow along in real time, they can also engage in real time: drawing while running the NYC marathon, Niemann tweeted about his hunger and need for a banana. A reader following his story then brought a banana to him further along the marathon route!
Following the culmination of an event, Niemann’s tweets/drawings exist as a visual record of his experience – a series of images, impressions and ideas linked together through time. Going back, you can watch his story unfold , even if it might read as a series of moments rather than a clearly formed narrative. In creating both real time engagement, and an enjoyable story after the fact, Niemann is harnessing Twitter’s dual value in being a tool for instant communication and as an archive of expression and interaction.
Parallax and Product Placement
Integration of web tech, code and illustration is key to the immersive digital comics developed by the design team at Bustle, a news and culture website aimed at millennial women. Bringing web-design trends together with bright and bubbly graphics, their visual stories about personal experiences, bodies, friendship and emotional turmoil are perfectly pitched at a younger digital-led audience.
The reader’s physical interaction with the screen appears to be the base for Bustle’s code team‘s work behind the scenes. To tell their stories, their illustrated graphics use multiple layers of SVGs and parallax effects triggered by scrolling. As the reader scrolls, different floating layers of the illustration respond to the user’s gestures: backgrounds, foregrounds and mid-grounds move at different speeds, or move with the user’s finger or mouse. It gives depth and a feeling of intimate engagement with the images. In a scene from, ‘The Emotional Stages of Coloring Your Hair‘, the hair of the main character slowly changes to the new ‘fresh’ colour as the reader scrolls down the page. In ‘Why Pizza is your Real BFF‘, the reflection of a woman in the mirror moves more slowly than the surrounding illustration of the dressing table, giving you the feeling that it is your reflection that you are seeing, from your point of view.
Parallax can tend towards gimmicky in website design, but when used in a smart way it can reinforce the conceptual and narrative content of a visual story, adding sparks of interest to a flat digital plane, and make a reader feel more connected to the action. This sense of connection can certainly be exploited for commercial purposes, and Bustle’s comics provide an engaging way for a website to integrate commercial content. A number of the comics feature products – like Schwarzkopf hair dye, or the lovely comic ‘What To Look For In A Perfect Workout Buddy‘, sponsored by “Smirnoff Spike Sparkling Selzer”.
In ‘For Gus: How Far Would You Travel to Say Goodbye?‘, illustrator Luke Healy tells the deeply personal story of the death of his grandfather. Published on The Nib, his work is a sensitive approach to visual storytelling, cleverly designed to make the most of the infinite scroll of a webpage. Rather than digital comics that use a template or layout similar to a printed page, infinite scrolling, and in fact an ‘infinite canvas’, offers illustrators the chance to develop concepts, compositions and narratives that explore and take advantage of the possibilities of digital space.
For Gus is an intimate story exploring physical and emotional distance. As Healy’s illustrated character traverses wild landscapes and ponders tough decisions, the feeling of intimacy is heightened through the reader’s physical act of scrolling down the page. Healy has designed his compositions to make use of the long format, using classic visual language techniques – shifts of scale, reduced and evocative use of colour, empty space – to visually reinforce the physical and emotional distance he is describing in the text. As the reader scrolls down and down, distances feel immense, pauses have weight. A sense of time, urgent, fleeting. By the time the story reaches its conclusion, you feel like you have travelled with him on his journey of loss, and continue beside him as he hikes on.
Creative Labs, an in-house creative agency at Universal Music, found commercial success with their innovative use of Instagram as a platform for an interactive ‘Choose your own Adventure’ visual story, Avicii Begins. Instagram is clearly a deeply popular social media platform for illustrators: its visual nature means it’s perfect for sharing work, creating mini comics, and for brands to show illustrated and animated ads for products. What is innovative with Creative Lab’s approach is their critical investigation of Instagram as a system.
Creative Labs took advantage of the app’s underlying hashtag functionality to take their audience through their ‘adventure’. Numerous profile pages were created with 9 square illustrations making up a new ‘page’ of the adventure story. The viewer could choose which part of the illustrated page to click on, revealing a hashtag that would take them to the next page of the story. By connecting the final page of the story to Spotify, it capitalised on the readers commitment to following their chosen adventure, with the result being that Avicii’s songs on Spotify gained visitor traffic, and therefore visibility.
Avicii Begins was created to promote the new album by (sadly recently deceased) Swedish DJ Avicii, with illustrations by Swedish games company Hello There. It is an excellent example of what is possible when taking a critical approach to the social media tools illustrators use all the time. Rather than using Instagram to post a work-in-progress update, illustrators have the possibility to reassess how the app’s inherent structure can be used in new ways to tell their story, and make it work in a way that showcases their own creativity.
Another innovative project with Christoph Niemann and the New York Times is ‘My Trip to the DMZ‘, a panoramic, 360-degree illustrated tour of Niemann’s visit to the Korean Demilitarized Zone. It is a kind of virtual reality peak into the illustrator’s sketchbook as he ventures to the DMZ.
It is designed to be, and is, a thoroughly immersive experience. Beautiful charcoal-feeling sketches, with gestural dabs and grainy texture, envelope you as you move around the scenes. Strong use of a classic ‘bad guy’ palette of black, white, grey and bold red is used in effective ways: the red, with its connection to blood and anger, is highly effective at raising the feeling of danger and war, and is also used as a compositional tool to separate and reinforce the north and south. Soft electronic music plays unobtrusively in the background, sitting behind a voice-over by Niemann as he describes some of the details you’re seeing, stories told by the tour guide, and how he is feeling. In the first opening image, Niemann describes his interest in the DMZ and his experience living near the path of the former Berlin Wall. As he speaks, you can manoeuvre around his representation of the stitched-up remains of the Berliner Mauer, and the open red gash of the DMZ still separating North and South Korea.
Using illustration allows the NY Times to present a personal and creative view of a place that is highly militarised and controlled – Niemann speaks of the restrictions against photography and how he tried to memorize details of the underground tunnels in order to be able to sketch them later. Using VR and other new approaches to digital space, it makes illustration as a form of journalism relevant, and even necessary, as a way of exploring restricted places or challenging ideas that can’t be captured in photography or video. Looking at the technical aspects, the credits show this project was not developed by Niemann alone. Supporting the illustrations by Niemann is music by Podington Bear, with design and production by Frank Auguglario, Linsey Fields, Danny DeBelius and Jeannie Choi. The project uses krpano viewer, integrated into the NY Times website.
In looking at this variety of innovation in digital space, the possibilities for illustrators working in a narrative-led way is exciting. Of course, being able to design web pages, or having the support of a coder, might not be possible for all illustrators, but these projects showcase the value in critically assessing the structures and systems inherent in digital platforms that we use, and how illustrators can utilise those systems to tell new, vibrant and engaging visual stories.
Image credits: Screenshots of all projects, for the purpose of criticism. All work copyright the respective artists.