Illustrating for good health

Illustrating children' stories

This fall (August-December 2018), I had a unique experience of working as an illustrator for children’ stories for an application being developed by the Wellness Technology Lab at Northeastern University, Boston, MA. This app is designed by Ph.D. student Herman Saksono under the guidance of Prof. Andrea Parker. The app focuses on low SES families in the United States and encourages them to lead a healthy lifestyle. Although the stories are created for children, they are meant for a family experience where a parent could be as involved as the child/children. Because I had no prior experience in creating illustrations for a narrative, I thought it will be useful to document my process.

I started off with reading the stories, which are based on theoretically grounded behavior models that encourage positive health behavior change. The narration is done in a way that brings forth visual storytelling with fewer words. Each story is spun around different animals as protagonists with four chapters. At the end of each chapter are questions that encourage readers to reflect on their own health behaviors, making it an interactive storytelling experience.

I ended up illustrating three such stories and here is a peek into what some of the illustrations look like on a mobile screen.

Sample illustrations for the story app

1. Context

To begin with, along with the stories, I was given references in the form of a few story illustrations that Herman had already worked on. These references set the expectations for a visual grammar of how each character would look like. The animals were deliberately anthropomorphized to make them relatable to the users. The components of illustrations discussed below were generated in an iterative process through collaborations between me and Herman.

2. Character design

For each story, I started with designing the primary characters. For instance, in the story called “Loni, is sooo hungry”, the central character is a lion cub who is an introvert and plays video games at home (notice the anthropomorphic behaviors). In the story, there an instance where Loni is really hungry and goes out of his house looking for food and ends up playing a game of basketball. This experience makes him want to engage in outdoor games more than indoor games.

In this story, in addition to the lion, the secondary characters include an otter and a heron. I started with making various renditions of the lion with different details such as the nose, mane, and the overall body.

This step was the traditional sketch-on-paper method. I would start drawing in pencil and then highlight the strokes I was confident about using a felt pen. In this process, I also focussed on identifying unique characteristics of the animals that would look enticing to illustrate. Sometimes I ended up exaggerating features, for instance, I added a mane to a lion cub to make him more lion-like.

Explorations for the lion cub and otter’s face

3. Proportions

One useful trick that Herman suggested was to follow unique proportions and body outlines for each character. This helped make the compositions more balanced and the characters look more distinct. For instance, for the story on the lion cub, I used proportions as shown below.

The body proportions were made such that they represented the age of the animal. For instance, the lion’s head was made larger with a stout body to make him look like a teenager who did not lead an active life.

4. Dipstick sketches

The next step was to sketch some key compositions from the story to gauge how the characters would look like when put together . It is here that we often noticed difficulties in creating expressions or actions in some of the animal characters. For instance, initially, when I drew the heron, he looked very stiff in the body and expressions. We must have tried a bazillion beaks (as shown below) for the heron to make his character look more affable.

Getting the beak for the heron was rather tricky

5. Final sketches

The next step would be to create sketches for the complete prose of each story. I created one scene each set of ~2–3 lines in the story. I had to keep in mind that they will be viewed on a mobile screen and did not have too many details in them, to ensure flawless rendering.

Each unique scene was sketched before going digital. I like to use a grid paper as it helps me follow proportions uniformly trace them on paper to ensure consistency across scenes.

6. Digitization

The sketches were followed replicating each illustration in digital format on Adobe Illustrator. This would give me more control over the drawings. I scanned the final illustrations (using camscanner app) and traced them using my Wacom Intuos tablet. Below are tracing-in-progress illustrations from another story called “Sally the salamander”. In this story, the protagonists were a salamander, a wallaby, and a crocodile. This story talks about a salamander who travels from the US to Australia for a boomerang camp. In the camp, run by a wallaby, she meets a crocodile who helps her improve her boomerang throwing skills. Figure below shows how the tracing practice stays consistent across different stories.

It makes sense to spend a lot of time in the paper sketches because that makes tracing them much easier. I found creating new designs from scratch on the wacom directly rather difficult.

Because these illustrations were designed for a mobile screen, I made sure the outlines are bold enough to be viewed with ease. I would then sequentially upload them on my drive as shown below.

My drive looked fun to look at once the exercise completed

7. Coloring

Although I couldn’t manage to color all the illustrations due to limitations of time, I created samples of how they would look like in color. It makes sense to have them in color because their primary consumers, children, would truly enjoy colorful illustrations over outlines. In the samples below, I have retained the black outlines and used pastel shades to fill the details. I also use transparent highlights of darker color at some places.

This project has been special because of two reasons. First, the subject of the drawings was something I deeply care about — animals. And, second, it helped me get back to drawing on a regular basis (something I truly enjoy) and made me much more confident in my illustrating skills.

To summarise, here are the things you should keep in mind-

1. Eyes can talk: Spend enough time developing details for each character, especially eyes. Facial features such as the eyes, eyebrows, mouth can add a lot of personality to the characters.
2. Get the size right: Maintain the character proportions consistently. Small inconsistencies even in the arm length of the character can start to make the designs look incoherent and are easily noticeable.
3. Finalize then digitize: Jump to digital tools only after you are satisfied with your hand-drawn sketches. Making digital changes can be laborious if you are using a wacom tablet.
4. Let the medium guide: Be cognizant of the medium of display. For instance, when designing for small mobile screens, keep details in the designs to a minimum. Create bold illustrations with enough breathing space for comfortable viewing.

I learned a lot working on this project and hope there is something in this post you can take away as well. I would love to hear your comments below. And, don’t forget to show your love if you enjoyed reading. :-)

Acknowledgment: This material is based upon work supported by the National Science Foundation under Grant Number #1618406. Any opinions, findings, and conclusions or recommendations expressed in this material are those of the author(s) and do not necessarily reflect the views of the National Science Foundation.