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 it's time to do our walk cycle in place. Let's open our file, character_rig _walk_01. So this thing should look familiar. It's actually identical to the setup that we created in Chapter 5. And if you haven't seen Chapter 5, you might want to, because we covered the principles of the walk cycle in greater detail in there, all the main poses of the walk and so forth. If you are kind of experienced with Flash or walk cycle, you might not need to watch that. But I am going to assume that you have good understanding of all the theory and these major poses and the timing of the walk cycle.
So the first thing I would like to do is take this file and just clean it up a little bit. There are some stray symbols lying around. These symbols will go into the body parts folder. I've made some alterations based on what we did at the end of Chapter 5. So you will find now that the hands are nested inside the arm symbols, makes posing a lot quicker. It's another layer of nesting, but by now we should be very familiar with that, so that solves a lot of problems. And I think at this point we will be ready to go.
Now the only difference in approach you are going to see here is that instead of animating our character horizontally, he will go up and down. This creates one major difference in the way we have to approach the scene. When we move him across the screen from left to right, we don't have to worry about the foot positioning We have plop it down and we will leave it there. In contrast, when we animate in place, we move the feet. That is the part of the body that we didn't really have to concern ourselves with. Now we are going to be moving the feet in the series of our arcs and loops to create the walk.
So any mistakes that we make in that part of the process could cause problems later on, so there are just a couple of things we have to watch out for. So I'll explain those as we go along. The beauty of this is that having cannibalized the previous symbols, they are all set up with the labels for the correct timing of all the internal animation. We don't have to worry about any of that; they are all numbered properly and we can get into it. Here we have our chap with his timeline. Let's open this out a bit.
So I'd like to move from the contact into another contact into the third contact. So let's just keyframe our final one, this will be the same as our first. And as we did in the previous chapter, we will keyframe this contact position and then we have to move the legs and feet into their alternate positions. Look at this in outline. we have the green for the right, blue for the left. So let's make a temporary layer. Now I'll copy this contact pose, paste it into here, Ctrl+Alt+V so it's pasted exactly in place over the hair layer levels.
Now we will just move the various body parts. Let's just grab them, so this green one will move into this position and so forth. So let's grab these and do a very big move, just get them into the right area. It can be confusing if everything seems to be in the same spot. So that's our left arm. That will move to this side and our right arm. Because this is locked to the top, I am selecting the lower layers. So let's just move them into the general area and we will pick one whichever looks least painful to position. So let's bring this foot over.
And that's the right foot, so that should be contacting the lower line. The lower line represents the path followed by the right foot, the upper line is that followed by the left, which is in blue. As we did before, pivot the legs and that will favor the positioning of the upper leg. Don't worry about the lower breaks yet. Okay, same with the left leg. I am going to move the right arm. I'm positioning the upper arm here. I am not worrying about the lower arm at this point.
We will do that next. We are still keeping this purple guide layer. That's still very useful for giving us good information. I want to tunnel into each of these symbols and then correct the positioning that's fallen out of place. These are kind of close. So just check we are on frame 17. We are on frame 17. No reason, how we shouldn't, but always get into the habit of checking. So this is the frame that we need to correct, so first of all I am going to keyframe the end, because we are going to work into a cycle. So first frame, last frame should be identical.
Let's keyframe the contact position for here. There we go. It's that one. See, I made a slight error here. Hold on a second. The guide layer on top is being altered, so I am going to break that apart. So now I can go and make a change to this without affecting the guide layer. Cut. There we go. Oops! I made the change to the wrong frame. I made the change to frame 1 instead of frame 17, let's just hit Undo. Okay. So make a new frame here. I want to make sure that the purple layers are broken apart. Good.
Now I go to frame 17, make that change. Okay. It's very easy to make the change to the wrong frame and you will see very quickly when you tunnel back out that, oops! Something has gone weirdly wrong. So my advice is to save your project, have many backups, and don't panic if something goes wrong. Just very slowly hit Ctrl+Z key or Undo and you will find where it is.
This one here, I'm going to use my favorite plug-in extension, frameEdit, which is made by toonmonkey.com. You can download it from there. It's a free extension and we have covered this before, so I'll mention it again in case anyone forgets. So I'm just going to go into frame 17 of this leg position, correct that. So it's worth keeping an eye on to the rest of the rig as you are doing this to make sure nothing else has been changed, if you are using multiple frames and reuses the same symbol. So now we go into the frame 17 of the upper arm. Let's just set more keys.
It will become a mechanical habit of yours to set a key every time you do something like this. And the rest, just drop that in and same thing for the left hand, make a keyframe, F6. And then bring that wrist up as well. Okay, let me hide that guide layer. See how this looks. Nice. So you can see we are toggling from one to the other. Just tweak that on the foot and you can see a slight gap in the over layer, that there.
Let's make that a little bit bigger. Only problem with that is it will be slightly bigger than these two and see if we can do that by just bringing it down. That's a bit easier. And one. It's better. So now we have our two contact poses set and let's delete our temporary layer. Classic tween. And now you can see there is a little weirdness happening there. I think we have an old hand layer that we need to delete. Let's get rid of that.
That's from our earlier project. So now we have what looks pretty horrendous, but it gives you an idea of the mechanism. I like to test our walk at every stage of the process. I want to change our frame rate. Make it a bit faster. Let's make it 30 frames per second. Make it more like a video frame rate. Okay. So we know that the hands are moving. As we did in the previous chapter, we are going to add the passing pose then the recoil, the down pose, and the high point, the up pose, and see this thing coming to life and one of the beauties of this is what I am going to do is something slightly different, so you don't get bored.
I am going to alter the passing pose a little bit and we'll see what kind of affect that has on the total walk pose. So it will be as much of a surprise to me as it will to you. So let's move on next and we will do the passing positions.
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.