Start learning with our library of video tutorials taught by experts. Get started
Viewed by members. in countries. members currently watching.
In Flash Professional CS5: Character Animation, Dermot O' Connor explains the process of character animation in Flash, using nested symbols and motion and shape tweening to create believable characters. The course covers the process from start to finish, from rigging a character to creating a walk cycle animation. Along the way, Dermot demonstrates techniques such as animating eye blinks, head turns, and mouth movements during dialogue. Exercise files accompany the course.
So we've animated our walk in place. So it's time to add some secondary actions to the hair. So let's open our file in Exercise Files, Chapter 6. Let's double-click on the stage. We could also double-click in the library on the bd walk symbol. Let's have a little look at it again. As you can see here it's a much broader action than the walk that we did in Chapter 5 and that's going to create some different requirements for the secondary action on this forelock of hair. So let's go in and have look at that.
So we're going to animate keyframes for this layer here. So, all of these positions are going to have some sort of motion on them to react to the broader up and down bouncing up the walk cycles. So let's just switch that whole thing onto a classic tweening and now using our Back and Forward keys we'll move through the timeline. So as you can see from the contact pose to the recoil pose, I would expect the hair to drag. Let's go in a bit and again move to the recoil position.
We've moved in on frame 5. So when you tunnel in, make sure that you are on frame 5 and a reminder again, use the frameEdit shortcut that way when you move into any given frame, you'll be on the correct internal number. You'll match. Otherwise things will seem to pop if you work on the wrong keyframe. So again I'm going to frameEdit in and I'm going to drag this hair. Let's skew it and maybe rotate it. There's an issue when you begin to animate it.
It'll expose issues or potential problems with the rig, so I'm going to go into this symbol here where we have a little gap in the hairline. That's not good. We can probably correct that here and that's an issue that's not going to go away. So I'm going to fix that, maybe pull the hairline up a little bit. That way the hair will have a little more flexibility and motion. Let me bring this down, again making sure that you're on the profile version of the hair. That's the second frame in the head symbol, okay.
So now we can even maybe pull the hair up a little more, whatever we think that we can get away with. Let's move into the next key and now the character is moving up and backwards so we can go with the default. I'm going to push that a bit more. Let's pull it out, really try to accentuate a drag on the hair. So let's see what that looks like again in context. So we want to make sure that this point on the hair has been pulled. It's pointing in the direction that it still wants to be in and now we go into the up position and again some pretty heavy drag here.
So let's pull it down. Let's see what that looks like when we zoom out. Good. So it should be noticeable. You could flap it all over the place if you think it's going to be a fluffy very lightweight hair. You could also make it stiffer. It depends upon the kind of texture of the character's hair or whatever the fabric is as to how far you push it, but in this case I think we're somewhere in the middle. We could go in and add a few more little touches, just increase the squash and stretch. Watch your volume.
You don't want to go in like that. Very, very easy to gain volume when you start doing this. So I'm just going to check. It's a little too big, so let's thin it out a bit. And push him a little more. Okay, so it's happening on the first part of the step. So let's go in and copy those frames, the recoil, passing, and highpoint because they're the same on both. Holding down the Alt or Option key, let's drag to the second part of the step.
Now we have a loose piece of hair. And we can do other little thing. For example, let's do the same thing for this back area, which we did on the previous walk cycle and select that again. First of all I think as we did there too we can break this symbol apart, Ctrl+B, and now it's an object that we can shape tween. I think we'd have to shape tween this. It would be very difficult to do any meaningful animation with that symbol if it was a motion tween. So let's look at it in context again, with the neck and the body.
So now we can imagine the same process here, a big flair at the back. This is going to be a much more subtle range of motion and I just noticed a little issue here with the neck. So not again, the character is pulling a back a bit, so again on this frame, using the frameEdit in keyboard shortcut. That's good. And we can use this if we had a different design. We could help to make this wrap.
If it was a tighter haircut. We could help to align the hair to the back of the neck much more tightly, if we wanted a continuous line here. So this technique can be used in a couple of different ways, but here I'm just doing it to help the hair feel like it's not a stiff symbol. Let's go back in here and I wanted the same thing I did in the previous one, these three frames. I'll copy from the recoil, passing, and highpoint pose to the second one and let's see if that works. Great! So we have done the hair.
It's nice and loose now and it's reacting to the walk and now we have to do the same thing with the hands. You can see that the hands are a little stiff. They should move a little more, especially with a fast walk like this. So we'll save this and we'll move onto the next session where we will give the hands a little more articulation.
There are currently no FAQs about Flash Professional CS5: Character Animation.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.