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 offers experienced Flash designers a step-by-step guide for creating and animating a full-featured cartoon face in Adobe Flash Professional. The course begins with some best practices for setting up the rig and moves on to building facial features such as the mouth and eyes, sculpting the mouth to simulate dialogue, and creating a range of expressions. The course also shows how to rotate the head using poses, move the rig along multiple axes, and incorporate audio.
Nothing looks weirder than somebody who doesn't blink, so it's time that we gave this guy a blink to do. So let's go and start again. I like to favor the right side. You can pick one or the other, but again, whatever you do, be consistent. So my approach is do the right side first, then repurpose it to the left side, and that way know what your primary approach is going to be every time. So in this case let's go onto the right time, and we need to make some simple placeholder symbol-- for now, something very similar to the eyeball itself. So let's just click on that. Ctrl+C to copy, paste in place here, and let's hit F8 to make this into its own symbol, because obviously, we don't want the animation to happen on this external timeline.
So let's put the pivot point to that side. I am going to call it eye right lid. You can call it blink, but I like to call it by what it is. It's a lid that blinks. So this makes more sense to me. Click there. Let's fix the pivot. So Free Transform tool with Snap on Snap to Objects, and let's put that there. It's really important that we get the eyelid traveling very tightly with the eyeball. Now that that's done, we can double-click to enter the symbol, and let's make some layers. Now this thing is just there is a placeholder, so we can hide that.
Now let's make three more: one, two, three. And the top layer will be the upper eyelid, the middle layer will be the lashes, and the bottom layer will be the lid lower. So what we want to do now is to create a geometry or a shape that will be as simple as possible and easier to tween. So what I'm going do with this actually is go back out a little bit, because the main point for this for me is the point here; it's that pivot. I'm not worried about the internal eyeball.
I am just going to move that a little bit to the right. Now, let's go back inside. And this is where I am going to start the upper eyelid from. So let's start with lid lower, and with the Rectangle tool and again, let's get rid of the outer line, get rid of that. And this is going to be like the skin color, but a little bit darker. So let's pick, I see that this turquoise color down. Just a dark skin color will do for now. And I want this corner to be absolutely spot-on that crosshair.
So let's put Snapping on for the grid, and you can feel it go on. It's nice. It's really nice when you feel it really connect with that. And then I am just going to switch off All Snapping for the moment, and just pull this up. I really want to get this exact, and that means hiding the eyebrows. So let's go back out, click on eyebrow, hide it. I am going to go back in here. Once again, taking care that flash doesn't helpfully snap away this point, because we need this point and this point, this point in particular, to be able to control the animation for the blink. That's good.
Perfect. So let's make a second key. What I am going to do, actually, is let's make two more here. I am not going to worry too much about the timing right now. This is going to be the closed eye. This will be the open one. So I am going to go to the closed position and drag this down, and now let's activate Shape Tween. Right-click on the keyframes and select Create Shape Tween, and that's it.
That's how we will do it. Now I didn't put this on the lid lower, but I think this will be more like the upper eyelid. I am not quite sure yet, so let's just move it up there for now, and let's put some blank frames in here. When you are working like this say, you basically were working on layers, and it can be confusing. There's no way around it. It's a little trial and error. It's not too difficult to figure out what is going to work and what isn't. So what we need now is another layer that will describe the black for the eyelashes.
So let's select that layer by clicking on here, hold down Alt or Option, and drag this down. And the eyelashes we want to be black, so let's select a black fill for that, and then let's color all these. Now if we hide that, we see the entire area turning black. That's obviously not what we want, so let's padlock that. Now the upper eyelid will give us this effect if we smooth this up to here.
The beauty of this method, by using two different color layers, Flash does some things very poorly, and one thing that it does very poorly is shape tween these very, very thin crescent shapes. It's much better at shape tweening big shapes with wide areas. So by this process, what we have done is we have created the illusion that we shape tweened a very narrow slice when we have done nothing of the kind, and that also gives us really, really nice control over the weight. We can actually make the eyelashes disappear completely at the top of the eye. Then the other thing that we need to do is, well, we can actually show some eyelashes up here.
That's great. And we want to copy this to the end, so select those two, hold down Alt+Drag or Option+Drag. See the little plus sign showing I'm copying. And the lower level here also needs an eyelid for the bottom of the eye, so let's do that. And again, just double-click to get rid of that outline. Snap on. And let's go to outline on this, snap off.
You should be getting the idea by now that the essential process is fairly repetitive, even the same essential steps over and over again. Let's get rid of this point here. We don't need that, so that will combine it. Snap off again. Hold down Alt+Option to pull the line to a new point. And let's just check to make sure that we haven't lost control. That's great. Hold down Alt or Option, we will drag that to here and pull that up. And then just copy the start frame at the end, select these keyframes, Create Shape Tween, and now switch Outline mode off, and there we go.
Now the one thing that you will notice with this is that it's so fast that sometimes you can barely see the closed state. So one thing I like to do is to take the closed eye and duplicate it. It helps that closed position to read a bit more. You can even make three or four or five frames, as many as you like. That's the beauty of doing this. You can make these eye blinks as slow as possible or as fast as possible. It's entirely up to you. Once you have the shape tweening done, you see how simple that is. So instead of doing that, what I want to do is just to create, for now, a really nice straightforward eye blink.
So let's put a wide-open frame on frame 1. We will put the beginning of the blink on frame 2. We will put these two frames here on frames, let's see, 6 and 7, and you can see their frame number down here. And we will end the blink on frame 10. Then we'll go to a blank frame, hit F7 and now we can remove these. And if you're really picky, you can even get clean up that little tweens that we don't need there.
And that's really, really nice. Also, we can get rid of that little placeholder that we created, if you remember, at the beginning. We don't need that now. To finish it off, we will just color the layers too, so that if you ever have to look at this in Outline mode you're all set. Now when we go back out, let's put the eyebrow back on.
That's beautiful. Then one last step remains, luckily not too difficult. We will duplicate this for the other side. Ctrl+C, Ctrl+Shift+V. Now a lot of people at this point would simply take this eye blink and flip the symbol horizontally. Again, don't do that. Much better to right-click on this, duplicate the symbol, make it eye left lid, OK. We go into that symbol.
Now if you obviously, it you play it, it's the wrong side. So what we want to do is to select all these frames and flip them horizontally. Not a fun thing to do one by one, but fortunately, we can do it in bulk. Down here we can edit multiple frames and drag the markers so that they cover everything. Modify > Transform > Flip Horizontal. We didn't see much happen there, but they flipped the other way around, so we can actually go to Outline mode; it'll help to position them properly.
And that looked good. So let's switch this off. So we see just single frames again, and there we go. No symbol flipping occurred, and we still get the same result. And we maybe had to add a few more seconds of work editing multiple frames rather than flipping one symbol, but you will understand later on why this is really, really important. And last thing to do is right now these symbol are set to Loop. That's going to look really weird.
So for now I will just set them back to Single Frame, and we are done with the eye blink. In the next chapter, we will move on to the mouth and look at bring him into life by making him speak.
There are currently no FAQs about Rigging a Face in 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.