marquee

Framing the Story: Animator Jocie Juritz

By Scott Kirkwood

London-based animator Jocie Juritz spends her days explaining complicated subjects—for instance, the impact of false memories, the history of the color white, and the science behind nanomolecular genetic switches—all in three minutes or less.

She started out with a few cat GIFs posted on Tumblr, and those led to a call from the Royal Society for the Encouragement of Arts, Manufactures and Commerce (RSA)—sort of a British version of TED. In her most recent project for RSA, Juritz’s squiggly cast of characters spells out Simon Sinek’s argument that big, intense acts are rarely as effective as a series of small, seemingly insignificant acts.

Juritz’s animation work for this RSA presentation, Intensity vs. Consistency, is a great example of her distinct style—the video was a Vimeo Staff Pick.

“I don’t think there’s any point in commissioning animation unless it adds something to the story,” says Juritz. “With the Intensity vs. Consistency project for RSA, I tried to represent all of the intense actions with bold, colorful images with loads of detail, but in every case there was only one image and it was static; the repeated actions were just simple line drawings, but they were animated in every frame—because I’m not interested in simply creating pretty images or telling a happy story. I want to be given a theme, and then explore how that concept can be related through animation techniques.”

DRAWN TO ANIMATION

Juritz wasn’t always sure she would become an animator. When her coursework at Kingston University required that she choose between the illustration track and the animation track, she was stuck: She’d always struggled to pack enough information into a single image, but she didn’t know if she was cut out for the laborious, time-intensive work of animation. Her professors encouraged her to give animation a trial run, and she soon realized that the art form contained many of the things she’d loved even as a child: drama, performance, characters, and storytelling—all with words, music, and sound effects.

Juritz created a self-initiated series of cat GIFs because, she explains, “cats are a fluid and are therefore wonderful to animate.”

Given the complex and often dense subject matter they deal with, Juritz’s short videos have garnered a surprising number of views on Vimeo and other outlets. It started with those cat GIFs (inspired by her own cats, Etta and Ziggy), which got the attention of editors at Tumblr. A tease for Jonathan Safran Foer’s book Here I Am led to a School of Life project with Alain De Botton, which generated the Simon Sinek pieces for RSA, which led to a piece CNN commissioned for their Colorscope series: an in-depth look at the color white. 

Juritz credits her quick rise to plenty of hard work, a bit of luck, and guidance from two of her university professors: Chris Shepherd and Martina Bramkamp helped Juritz find paying projects soon after her graduation, bolstering her confidence and providing the guardrails that a young animator needs, so she can keep a complicated process from going sideways.

A LOVE OF COMPLEX SUBJECTS

And how does that process begin? It all starts with a script—preferably an audio recording rather than words on a page, to ensure that visual elements match the speaker’s timing, tone, and personality. Juritz will also do a bit of her own background research to help with a guiding concept, as she did before starting production on CNN’s Colorscope episode about the color white.

Juritz animated this edition of CNN’s Colorscope episode, about the color white.

“Technically white is all the colors, but in a way, it’s not a color at all—it’s very elusive,” she says. “So I started thinking about how I could show white in relation to something else, to give the sense that you can’t really pin it down.” In the final video, white water courses around nearly transparent hands before being poured into glasses with reflections that reveal a white wedding dress—and all the action plays out against a faint gray background that provides just enough contrast.

Juritz generally creates a few detailed stills to express the mood and style of the piece; then she plots out a storyboard so the client has an opportunity to offer suggestions. As a final preliminary step, she creates an animatic—a well-worn animation tool that sequences key shots timed to the audio track.

Once that’s approved, Juritz uses the Timeline tool in Adobe Photoshop CC to do the painstaking work of animating each frame, adding layer after layer to isolate each figure, and then drawing, erasing, and redrawing forms to create the illusion of movement. Juritz animates at 25 frames per second (the UK standard). She’ll generally repeat each frame twice, which results in 12 illustrations per second—a process that allows her to complete three to five seconds of animation per day, depending on the complexity of the movements. When budgets allow, she’ll hire a friend to do some of that exacting, monotonous work under her art direction. (See her process, below, in the “Behind the Animation” section.)

Even with approvals at every stage, animators must make hundreds of tiny decisions on their own, which means clients have to trust Juritz; going back to edit a few seconds here and there could set a project back weeks.

Juritz directed this animated trailer for Jonathan Safran Foer's latest book, Here I Am.

But for the right topic aimed at the right audience, it’s all worth it. Especially if it gives Juritz the opportunity to entice viewers with inviting images and then surprise them with content that makes them think. She’s particularly excited about two new projects she is working on in collaboration with London psychologist Julia Shaw: illustrating a short trailer for the book Making Evil: The Science Behind Humanity’s Dark Side, and animations for Spot, an interview bot that helps employees report workplace harassment and discrimination.

“I’ve always really liked working on quite sensitive, psychological topics, and I think taking a light-hearted approach is often a better way to get those ideas across,” she says. “Animation can help with topics like sexual harassment or discrimination, where live action might make a piece feel too specific, or there might be too much going on, or you may even be reminded of someone you know. With animation, that person can just be a blob—and everyone can relate to a blob.”

BEHIND THE ANIMATION

Here, Juritz breaks down her process, using one of her cat animations as an example. This one features her cat Ziggy: 

My process starts with a drawing. If I’m at the studio, I create my artwork in Photoshop CC, drawing with a Wacom Cintiq. If I’m at home, I use the Procreate app on the iPad Pro. I sometimes work on roughs in a sketchbook, but these days holding a Cintiq pen feels more natural than a pencil. In Photoshop, I tend to use Kyle T. Webster’s brushes. 

Then I create a rough, jerky animation known as an animatic—essentially a storyboard playing along a timeline. I try and capture the movement of the characters with quick drawings, focusing on the most important positions. The original drawing lies underneath as a reference. I use Photoshop’s Timeline tool to animate.

Next, I animated the cat’s body, making sure the weight and timing felt right. I leave secondary actions (for example the cat’s tail) until the next step. Breaking the character into sections helps simplify the process; even the eyes and pupils are animated on their own layers.

I also animated the rough lines of the woman. The hand, book, and face are each animated in separate layers; I worked in different colors for easy distinction. I also added the cat’s tail on a new layer. There is so much attitude and emotion in a cat’s tail that adding it last gives me a chance to properly focus on it; otherwise, I’d be trying to consider the weight of the body, the tilt of the ears, the attention of the pupils, and the tail at the same time.

Next, the cleanup process: Using the rough animation as a guide, I hand traced over every frame. Each color needs to be added in its own layer, so I often end up repeating this process hundreds of times (which is why it’s my least favorite part of being an animator). For example, in this animation, there are 80 separate drawings for the cat's body and 90 drawings for the cat’s tail. I use a 25 frame-per-second rate, but I repeat each drawing twice (called animating on “twos”) so each second contains a maximum of 12 drawings.

The final animation has even more details on new layers. For full-scale projects I export image sequences out of Photoshop and composite in Adobe After Effects, but for small GIFs and shorter animations, I can get away with compositing the layers in Photoshop itself and then exporting videos and GIFs directly.

Below is a screenshot of my Photoshop file. I try to keep things organized, color-code layers, name groups sensibly, and delete anything I don’t need. By the time I’ve finished coloring, I have dozens of video groups and hundreds of layers, and my file has become a chaotic, but cherished, mess.