Preparing animal characters for animation in After Effects

Following on from the entry on Wednesday I’ve imported my animal over to Illustrator and converted each part into a vector based layer. I’ve also coloured it.

Tomorrow I shall add details to my character

Animation: Adding mouths and blinking eyelids to your character.

I have one last thing to do before I move my character over to After Effects some extra mouths and some blinking eyelids. I’m going to paint each mouth onto a new layer and the same with the blinking eyelids.

About 5 different mouths are good amount. A small O shape, a large O shape, a wide grin, a large grin and a large open mouth. Experiment until you’re happy. I will be doing a tutorial soon all about mouth shapes so watch out. Tomorrow After Effects here we come.

Animation: Outlines and joints on your character in Illustrator.

I now have my character all coloured and almost ready to take over to After Effects but one of the problems I am going to have to deal with is where the joints of my character overlap. Let’s take an arm joint as an example. First I start off making a copy of the upper arm layer as this has a black line over lapping the lower arm as you can see below.

Next I move one of the Upper arm layers below the Lower arm. This will be the outline of the Upper arm. I’ve made it all black in the illustration below.

Finally on the Upper Arm  layer which is above the Lower Arm Layer I use the paint bucket tool with the no colour fill option to get rid of the outline around the arm. Now I can see through to the Upper Arm layer below.

Of course you can deal with the whole problem by designing your character in Illustrator from scratch. We shall do that at a later date. Tomorrow I shall be looking at mouth shapes and eye blinks.

Animation: Adding Colour to your Character in Illustrator.

I now have my character outlined and in pieces. Next I want to add some colour. Using the paint bucket tool I’m going to colour my character.

Once I have filled in the character with colour I use the paint brush to paint over the black lines that seperate the backof the body from the front. This is where the neck is sandwiched and gives the appearnce that the body is a whole piece. (See the illustration below)

Now I’m going to use the paint brush to add some shading and extra details. I’m doing this mainly around the face. It can really bring your character to life.

Once I finished adding the detail there’s a few little tricks that are needed to make sure the character will animate well when imported into After Effects.

More tomorrow.

Animation: Converting your Character in Illustrator.

I’m going to convert my Photoshop file into an Illustrator file. So first things first open it up in Illustrator making sure you click on the box which asks ‘Convert all Layers to Objects’.

Now I’m going to convert each layer so it will become vector based. I’m going to select one layer to show you how this is done. I’m choosing one of the eyebrows. With it selected I go up to the button on the menu which reads Live Trace. I click on that to convert the layer.

After I’ve done that I want to make the layer editable in Illustrator. On the same menu line to the right there is another button which reads Live Paint. Click on that and now you can use the paint bucket to add colour and other things that I will talk about at a later date.

You’ll notice that at the moment there is a white box around the eyebrow. I want to get rid of that so I’m going to use the paint bucket tool and fill with the no paint choice. Clicking on the white around the eyebrow makes it dissapear. Next I’m going to select all the layer and convert them using ‘live trace’ and then ‘live paint’. Finally I’m going to through all the layers getting rid of the white using the paint bucket tool and the no paint fill.

Here is the finished character all ready to colour which I will do tomorrow.