Start learning with our library of video tutorials taught by experts. Get started
Viewers: in countries Watching now:
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.
It's time to add in-betweens to the inner timelines of the arms and the legs of our walk cycle to smooth out the entire walk. So let's open 13 in your Exercise File, double-click on our symbol and then quick run through and you'll see we still have things popping on some of these in-between frames. So now I think it's kind of a fun part. What we'll do is hide some of the other legs and we'll take that leg layer. And then we'll take that back arm and just hide them for now. Let's just work with one side. Great! Now, let's take this leg for example.
I'm just going to start adding shape tweens and I'm going to use my numeric keypad shortcut. And as you can see, it's all smooth. There is still a little bit area and that's because we need to animate this foot curling to meet that. So what I'm going to do-- That's a little bit distracting. So I'm going to hide that foot layer, so we can choose focus on the pant leg.
Good, it's getting very close. So we'll do the same process for this upper arm. So it seems that I want to shape tween beginning from frame 5. So what I'm going to do is add a keyframe here and don't forget we have our wrist area that's going to be motion tweened. Now let's go out. It's be slight offsets here, because the hands on a different layer.
It's not arcing quite the same, but I'm not worry about that just yet. So we need to add a little tween here. Wherever the hand breaks, that's where we tunnel in, make a keyframe and then add our tweens there. Now the tween process is breaking a little, so we have to help it out, give it some hints. Again always before you add hints, save your project file. So the first hint helps, so that's good. Leave where it is.
Sometimes one hint will be enough. Sometimes you have to add a lot more. Okay, so that looks good. So again test the outer symbol, nice. I think we should have a tween here. It seems to be breaking off a little bit. So again, just don't keyframe from here. Just add a key there, much better. And then definitely from here to here. That should be tweened. Again add a key.
Shape tween, motion tween, huh! It's breaking it again, so more shape hints. Modify > Shape > Add Shape Hint or your shortcut for that. Still a little wonkiness at that corner, so I'll add one more at least. It's still a little bit, but I don't want to let that go, because we might be playing with this still. There we go. So now as you can see, properly tweened. So let's unhide the other leg and the other arm.
Actually, I'm going to put the torso on outline as well as the lower torso, so we can probably see through them. Lots of breaks happening here still, so I'm going to go in here. It looks good from there, fine. I'm looking at the arm now. Definitely from here we're going to start tweening the arm, so going into that same frame, F6, Shape Tween, Motion Tween. Good! Move from here to here, definitely you'll see it's breaking, so F6 for keys, Shape Tween, Motion Tween.
And then again we're going to have to add some extra keys for the hand position. Definitely we should have some kind of tweening happening here. So as you can see it doesn't happen on some of these keys, because between some of these keys in the outer symbol, we didn't do anything drastic with the arm. Simply put these where they're needed, there we go. So I'm going to actually switch off at legs, so we can focus entirely on the arm. There is a little bit of sticky that's happening here.
You can see right on this frame. It's moving either too much before that. So I'm going to do is give it a bit more room to travel. We can't change the first frame, not the last frame because it should be the same as this. These two frames have to line up. So any changes that we make, any doctoring, has to happen sooner than that. I find sometimes too the easiest way to correct this is something to delete the sticky frames, clear the keyframes, make a new one, let Flash worry about the rotation and the overall positions, and then you can fine-tune it.
It's probably the smoothest way of doing it. Now let's check. It's much better. So let's hide that hand. It's getting in the way. Yes, that's fine. So let's unhide some of the other layers and see, choose the other one we wanted to work on. Oh yes, the right leg, hide the other. Then go through frame by frame, there we go.
So from frame 17 through, we have to add something. Shape tween that, and we need to add a shape hint here. Don't forget, save your project. I'm going to add more hints. Clearly we've already assigned hints on our previous pass, so I'm going to add them in the same position. They usually seem to like the same position. If they work on one key, they tend to work on the other. Okay, it's good enough. There is a little bit of wiggling in the corner there. Let me add one more. Okay, that's much better. Some more hints needed here.
As you can see it's not matching the outer movement. And we should probably add them here too at the end. So let's add one more key and one more shape hint. Basically, anytime it's moving between two of these, you can make the whole thing a shape tween and keyframe all of these points and shape tween the entire timeline. That would probably work. So let's look at the entire thing with all the layers and see if we've forgotten anything. Pretty close. So we've come a long way already.
Zoom out and watch it. Sometimes I find it easier to look at the things from a bit of a distance. So that's great. So the last correction, I'm sure you can tell, is that foot. We need to do some surgery on that shoe to make sure that it wraps and curves to the ground. That's really going to sell the character living in his environment, so let's save that. Now we'll move onto correcting the shoe.
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.