When we first started coming up with ideas for the new Quinn the Fox website, we knew that we wanted to begin the user journey with an animation – a cinematic and vast hinterland that would spirit you away into Quinn’s pastel, dream-like world.
For this post, we thought it might be interesting to take you behind the scenes for our opening animation. If you haven’t seen it yet, make sure you go to quinnthefox.com on desktop to check it out.
The animation is inspired by a real story. In 2006, while we were travelling in Japan, we really wanted to visit the De Liefde Windmill in Chiba. Not speaking much (or really, any) Japanese, we were taught 2 phrases to help us get there: “fūsha” (Windmill) and “eki doko desu ka” (Where is the station?). Armed with this information, we took the train from Ueno to Sakura and then found a taxi. “Fu-fusha” we said timidly, as we got into the taxi. Perhaps it was our pronunciation but we distinctly heard the taxi driver suppress a laugh as we drove off.
For those who have been to De Liefde, you’ll know that the windmill is in a very remote area, surrounded by endless paddy fields and grass as lush as a watercolour painting. Before we knew it, the sun was setting, the windmill was closed, everyone had left and we had no way to get back to the station. With no other option, we started to walk in the direction we thought that the station was in and fairly soon, we were walking across farmland and countryside with a river running next to my path. The sun was starting to set and the sky turned a brilliant shade of purple as the sun sank below the horizon. After walking for an hour, we reached a little house with an old lady watering her plants in the garden and we finally managed to utilise the second phrase we were taught: “eki doko desu ka?” we asked wearily. Luckily, the station wasn’t very far away.
Out of curiosity we Googled the route we took after creating the illustration to see how it compared and it’s more accurate than we thought.
For the animation, we entrusted animator David Benedetti to capture the sense of adventure that day as well as a sense of fear (after all, there was no Google maps back then – in fact we barely had internet).
Although Chiba has no mountains, we decided to put some in the background in order to push everything back and create the epic sense of scale and depth that we were looking for and to help create a rich parallax between Quinn the Fox, the train and the background.
Another stylistic choice that we took was to animate in two’s, a technique that holds the animated object for two frames, rather than one. This creates a beautifully hand-crafted and slightly choppy motion. Digital illustration and animation can often feel too smooth and as a result, they can feel sterile and devoid of emotion. Animating in two’s brings back the warmth and evokes the nostalgia of older, traditional animation.
Quinn’s run cycle is animated using frame-by-frame, where the motion is broken down and each frame is drawn individually. The secondary elements such as the train and the background are animated using interpolation, a more digital form of animation.
We hope you enjoyed that deep dive into the creation of the Quinn the Fox animation! Let us know what you think over on our social media and if you liked it, don’t forget to share this blog with your family and friends!