You’ve seen the clever and often beautiful animated movie studio logos that open a theatrical presentation, or the title graphics that come to define the brand of a television show or video production company. Many of them are memorable or entertaining. You can apply some of these creative and inspirational animation techniques to an average logo design for your corporate client or small-business production.

Seeing a great movie studio logo animation before the picture starts — from 20th Century Fox or Universal Studios, for example (see below) — is like watching a warm-up act. I’ve often mentally deconstructed some of them while sitting in the theater, imagining how I would create them myself by combining video, 3D, and motion graphics in Adobe After Effects — often to the point of distraction from the beginning of the feature film.

Almost any static logo design can be easily animated in either 2D or 3D in Adobe After Effects CC with layers created in Adobe Photoshop CC and Adobe Illustrator CC. This article shows you some examples and concepts as well as three techniques for creating 2D or 3D logo animations. You should have a basic understanding of how Illustrator CC and After Effects CC work, since you’ll be able to download and explore some of the project files.

What to Animate & Why

Depending on the logo design you’re starting with, you’ll need to first determine why you want to animate it and what story you want it to tell. Where will this animation be used? Will it be an animated avatar for a company’s online presence or website? Are you creating an animated title for a video production? Or is it for a product or service business? Whatever the case — you want it to convey a message or evoke an emotional response. After all, this is the extension of the logo or title design process. The original logo design was created with purpose and should tell a story — now it’s your turn to bring that story to life.

Once you’ve defined the purpose and the delivery medium for your animation, you can decide how best to approach the animation process.

Oftentimes, simply moving the logo onto the page in a creative way or overlaying other images and graphics is enough. Other methods will require moving individual elements of the logo to create the animation or possibly building a 3D object from a vector logo and rendering it in Raytrace 3D in After Effects.

Understanding how the animation will be used and what message it needs to deliver will help you determine which approach to use.

In this article, I share three very different ways to animate a logo by creating a simple fly-in logo that appears to come from the top of the screen, a multilayered Illustrator logo that’s animated to music, and a fully-rendered 3D logo with reflections, lighting, and shadows.

Classic Fly in Logo

Video 1. In this example, the logo swoops down and lands in front of the background image (click to play).

The fly-in method of animating a logo onto the screen is the simplest to create but can still be effective, depending on the complexity of the design or whether the logo will be overlaying other video, imagery, or graphics (see Video 1). This technique can be performed easily in either After Effects CC or Adobe Premiere Pro CC.

The real-world example of this animation style (shown in Video 1) illustrates how effective and appropriate it can be — especially when there are other moving elements in the background. This was a project I designed for a client’s website that was intended for TV broadcast, live visual programs and presentations, and product videos. I created it using Photoshop and After Effects.

The original logo was an embossed-style design created in Photoshop and was exported as a PNG file to retain transparency in the background, as shown in Figure 1.

Animating a complex vector logo

Video 2. In this example, the letters slide in from the right, and the falling leaf lands to the left of the letters to complete the arrangement (click to play).

Video 2 shows the most requested type of logo animation I encounter as a professional: taking a client’s existing logo and animating it for video productions. Of course, you need the source design in Illustrator or EPS format with all the layer and object information included, or you will need to re-create the logo to match.

In this example, I created a fictitious corporate logo design in Illustrator CC (see Figure 2), using some stock imagery from iStockphoto, and then I animated it in After Effects CC. I set the timing of the logo to a soundtrack I created from the music and sound library at SmartSound.

Download the After Effects vector logo project files (animated-logo-vector.zip, 8.8 MB) and review the contents to see how they are constructed.

3D rendered logos

Probably the most sophisticated and time-consuming method of animating a logo is to convert it to a 3D extrusion and render the scene in Raytrace 3D. After Effects CC enables you to convert any vector shape or text layer in the Raytrace 3D comp mode to an extruded 3D layer with geometry and rendering options that go beyond just moving things around in 3D space (see Figure 14). You can also use Cinema 4D Lite (available with After Effects CC) to create 3D logos and objects and then render them through After Effects with the new Cineware effect.

More Info at http://www.adobe.com/inspire/2013/09/animated-logos-aftereffects.html