Animating the Logo

Reflecting on the concepts that underpin the design of a logo, Graphic Designer Adrian Shaughnessy in his book Graphic design : A User’s Manual (2009, p.181) notes that “a logo will have to work on numerous platforms, mobile phone screen, website, T-shirt, and at the end of a television commercial. Increasingly, too, logos have to move. The days of the static unchanging logo have gone. Today our logos are expected to be mini movies that tell us stories.” It is this idea of combining movement with the logo to help convey meaning that I wish to explore. When creating my branding it was with the intent that it’s forms would be simpIe and flexible enough to be able to be animated in a variety of ways to further reinforce the key themes of the brand, exploration, accessibility and unexpectedness. The high contrast forms should remain distinct even when manipulated and warped.

Shaughnessy finishes his reflection on logo design by saying the “final development in logo design that designers have to take into consideration is that the era of the monolithic, unchanging logo is over. In our visual culture we want variety and stimulus. Accordingly, the logos of the future are likely to be ever changing and malleable.”. For an author writing in 2009 this has been particularly prescient as you can see this malleability being apparent in much contemporary branding, for instance in Monotypes branding work for Amsteldok as shown below.

Amsteldok Branding (Monotype 2020)

This makes use of a variable typeface at it’s core to create a system of interrelated letterforms that warp and move in relation to each other.

Above Left. An animated gif of a pencil I created in the Animate tutorial
Above Right. The Animate tutorial

Previously, in my professional career I have created animations using After Effects, however I found this program to be too complex for the simpler style of animation I was looking to achieve. Instead I looked at using Adobe Animate, a vector based animation program that has a powerful suite of tools suitable to the animation and manipulating of letterforms. Having never used the software, I worked through a series of tutorials that are included with the program and created the animated pencil gif to the above right. Once I felt comfortable with the software, I experimented with some basic styles of revealing letters in the logo as seen to the right. I wanted to play with the idea of different parts of the logo revealing themselves as they are explored. There are still many things to correct, for instance the timing of the reveals and the quality of the movement, but it is an avenue I hope to continue to explore further as the project develops.

Above. My initial test animation for the ODD Foundry logo. The timing needs to be corrected as well as the removal of some thin outlines that not meant to be appearing over the logo.

Above. My amended test animation. I have altered the timings at which areas of the logo are revealed.
References