Motion Graphics
February 2020 - April 2020
Horizon Interactive Awards Magazine/News/Blog Website: Best in Category
Horizon Interactive Awards Travel & Tourism Website: Gold Medal
College Photographer of the Year Multimedia Online Storytelling: Silver Medal
Society for News Design Digital Storytelling: Third Place
For over 2,000 years, chocolate has played a crucial role in Mayan cultural and economic life. Today, Mayan communities continue to make chocolate using a combination of traditional and modern methods. This animated, step-by-step guide shows how a cacao pod becomes a chocolate bar.
While at Che'il Mayan Chocolate in Belize, I spoke with chocolate makers about each step of their process.
I used photos and videos from my time in Belize for reference when creating animated gifs.
In March 2020, I travelled to Belize as part of Barriers, a multimedia journalism project that examined how communities across the country are responding to climate change. As part of the project’s “Bittersweet” team, I worked with a writer, photographer, and two videographers on a story about challenges facing local Mayan chocolate makers.
I was the team’s designer, so my job was to create an interactive feature that made our story feel relevant to readers. Almost everyone loves chocolate, so I decided to showcase how it gets from the rainforest to the grocery store.
This pair of images show the storyboard I created for my animations after researching chocolate making at home.
After arriving in Belize, I realized local chocolate makers used a different process than I expected, so I threw out this storyboard and made a new one.
I began planning this animated guide before we arrived in Belize. After researching methods of chocolate making, I storyboarded a rough draft. When we arrived in Belize, however, I realized that local chocolate makers’ methods were different than the ones I found online—so I asked questions, took pictures, and made copious notes about the process.
Once we returned home, I began illustrating and animating. Using my notes and pictures for reference, I created a set of looping gifs that visitors could watch and read at their own pace. Creating the gifs proved to be a bit of a challenge, as they required each animation to start and end on the same frame. Once I finished making them, I used a few After Effects tricks to reduce file size so the gifs wouldn’t slow down load times on our website.
Because the visuals in the gif loop while the text remains constant, viewers can read at their own pace.
Each step of chocolate making—from harvesting cacao pods to molding candy bars—is visualized in this guide. On top of that, each step includes a short, written description of the process. Barriers, the parent project of this interactive, won numerous journalism and design awards from groups such as the Horizon Interactive Awards and the Society for News Design.
Note: The animated guide is only available on desktop; mobile users will see a static guide.
