Start learning with our library of video tutorials taught by experts. Get started
Viewers: in countries Watching now:
In this course, author Dermot O' Connor introduces a variety of real-world issues that animators commonly encounter and offers practical solutions to them in Flash. The course covers how to apply gradients to create subtle texture and light characters, reducing the flat look of most cartoons; how to simulate natural phenomenon such as wind, fire, and clouds; how to mimic 3D space; and how to add fades and transitions to create custom cuts between scenes. The course also includes a look at staggers, which can be used to create camera shake, tremor effects, and extreme character reactions.
In the previous section we did a very simple stagger scream; the 1, 2, 3; 2, 3, 4 stagger. This is a slightly more capable stagger, let me show you, where the character goes into a little anticipation, and he staggers up between two different states, and zips back and forth. It's a lot like the stagger that we used on the plank scene. So let's have a look a little deeper into this. I'm going to just hide the background, and just go into one of these little scenes. And so what we have is a simple action, quite simple, only four keyframes, where he moves down into this little scrunched position, and then he arcs around and up, and then settles back into his standing position; that's it.
So we have one moving on the left side, and we have its alternate moving on the right side, it's the same action, just moving the other way. And so you might be asking, why don't you just flip the first action horizontally? The reason being, not all characters are symmetrical. In this case, this little corner of hair, if I were to flip this horizontally, it would then pop to the other side of the head. And if we had an eye patch, or some other detail, then it would look very strange. So it's good to know how to do two of these things that are completely separate, so that's what we're going to do in this course.
Because I there's so little time really available to do this, I want to cheat very slightly. I want to copy this timing, so that we match as closely as possible. So I'm going to make the new temporary layer, and just hit F7 here, here, and here to make keys on Frame 7, Frame 20, and Frame 27. Now I'm going to select this Timeline, right-click and copy frames, and now we can delete that layer. That was just a little temporary placeholder. And let's go back out to the main Stage, and now we can hide the original material. I want to take the Work folder, and this would be our Work file.
So, I've simplified this greatly, I'll drag him to the top. I've scraped off all the gradients, and I made it a much easier file to work with. So you'll be able to go back and forth between the two. I want to show you the general principles involved here, rather than mess around with too many gradient layers. So let's click on him, and what I want to do first is make a new layer, paste frames, and drop in those references. Hit F5 to extend that Timeline. And I'll do the same with any layers that I think are going to have little nested animations inside.
So that will be the head, let's make a new layer at the top, and I'm going to paste those frames in. I always do this when I work with nested animation, because it helps to keep all my Timelines lined up, and everything works so much better. Do the same with the mouth, because we are going to do a little animation on the mouth symbol later on. Right-click there, paste those frames, hit F5; no keys right now. We'll worry about that later. One last little thing to watch out for; I make sure all these symbols in your Properties panel in looping are set to play once on Frame 1, and they're set to Frame 1 here.
That's kind of important; when you start setting keyframes here, here, and here later on, it'll really help to set the right numbers on all of these frames. So again, this head is set to 1 on Frame 1, and I think we're ready to begin. So first things first; I need not one but two man layers, so let's make a second one. I'm going to select that frame, hold down Alt+Option+Drag, and now I have two layers. And let's duplicate that symbol. And let's call this one man Right, now just put down 'R' uppercase to signify that.
Double-click on the name in the Timeline, and call it man right. And the one on the bottom, let's rename him in the library. This simple man is in the man simple folder, and let'scall him man Left, and we'll name this folder man left. That'll just make it easier to keep track when we start zipping these things around the place. Okay, so let me go into the man left folder, and now we have everything all neat and tidy, all set up, and ready to begin. Hit F6 to make some extra keyframes, and what I'm going to do to keep things simple; I'm going to move his head down, and I am going to do it in a fixed amount of distance by holding the Shift key and the down arrow key. And that'll be his little anticipation move.
And on this one, I'm going to hold down the Shift, and click twice up, and I'm going to rotate a little bit this way, and I'm going to rotate this one a little to the other direction. And I'm going to use just the regular arrow keys to push these into a nicer little pose. And then when I select the body, make sure that you have free transform selected, or Q on the keyboard. And let's just stretch the body to match those positions. And if you drag here you can skew, and you can squash it a little bit. And now I'm going to select the Timeline, right-click, and Create Classic Tween. I don't use the new motion tween; I don't like it.
It's got some really nice features, but classic tween is a lot easier to use. It's faster, it's more responsive, and there's a nicer way of tweening with it. And without zooming in and out, I mean, I'm working on 50%; I like to do these kinds of operations at the same level of magnification, because it's easier to match the distances. So what I'm going to do now is hit F6, F6, and F6 again to make new keys. Remember we used Shift and Arrow key down once for the down position, and Shift and Arrow key up twice for the up position. And this time he'll be facing this way, so I'm going to pull the head over like this, drag the body up, and we'll squash the body on this to match. And now I will assign our motion tween. Okay.
So now we should have two layers, and what's happening is not quite what I wanted exactly just yet. Because, if we look at this in outline, what I want is -- the beginning looks good, but they're kind of crossing over at the top. That's not a problem. So what I'm going to do is go into the first one, and on the top position I am just going to move the head out that way, by Shift+Clicking, and moving the arrow left once, and drag the body over a bit. And in the other one, the opposite. So I go to that frame, Frame 20, Shift +Click to that direction, body over.
So now when I look at both of these layers together, they should be starting to group at the top. Very hard to see exactly what's going to be happening here, but what I'll do is very quickly just select the area that we want to stagger to occur in, hit F6., and now I'm going to delete the frames to match the kind of pattern you are seeing down here. You only need to see one man level at the beginning, because they are really both the same, and here they began to differentiate. We can actually hide that now. So I'm deleting the alternates by hitting Control+X to delete those frames. Let's look at that; that's really nice.
And of course, we can change the nature of the stagger simply by changing the end pose of the up position, and see how easy it is. I could move the head over here, and as long as I match that on the other side of the stagger, you can have a very quick learning curve. Back in the old days, drawing by hand, what I've shown you right now would have taken an awful lot of drawings; probably several hours of in-betweening these by hand. So this is a great way to familiarize yourself with staggers. Now we've laid the skeleton of the stagger. In the next section, I'm going to show you how to really refine this, and truly bring it to life.
There are currently no FAQs about Animation Tips and Tricks with Flash Professional.
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.