New Feature: Playlist Center! Pick a topic and let our playlists guide the way.

Start learning with our library of video tutorials taught by experts. Get started

Rigging a Face in Flash Professional
Illustration by John Hersey

Building unique mouth shapes


From:

Rigging a Face in Flash Professional

with Dermot O' Connor

Video: Building unique mouth shapes

Now that we have three standard sets of dialogue mouth shapes, let's do something that's a little more interesting and dramatic, because obviously you want to have something that's not just conversational, like these, although these were cover you for most purposes. So I have created, in this project file 02_05, three new unique mouth shapes that are really wide open, kind of gritted teeth, like grr and like a huh, like he is really, really dumb. So let's see how we would proceed about rigging these. Now, I have set up some placeholders here.
Expand all | Collapse all
  1. 14m 16s
    1. Introduction
      42s
    2. What you should know
      2m 0s
    3. Setting up Flash
      8m 35s
    4. Dos and don'ts
      2m 59s
  2. 59m 26s
    1. Establishing the directions
      7m 9s
    2. Setting up layers for the head
      6m 58s
    3. Drawing the head
      19m 2s
    4. Creating the mouth
      11m 27s
    5. Drawing the eyes
      4m 31s
    6. Animating the eye blink
      10m 19s
  3. 48m 0s
    1. Creating happy mouth dialogue shapes, part one
      10m 24s
    2. Creating happy mouth dialogue shapes, part two
      7m 43s
    3. Creating mad or sad mouth dialogue shapes
      10m 7s
    4. Creating neutral mouth dialogue shapes
      7m 36s
    5. Building unique mouth shapes
      12m 10s
  4. 29m 27s
    1. Creating jubilant expressions
      11m 47s
    2. Creating furious expressions
      6m 4s
    3. Fine-tuning expressions
      11m 36s
  5. 1h 9m
    1. Clock rotation demonstration
      2m 23s
    2. Creating the twelve-o'clock pose
      9m 2s
    3. Creating the six-o'clock pose
      5m 19s
    4. Creating the three-o'clock pose
      10m 16s
    5. Creating the nine-o'clock pose
      9m 35s
    6. Creating the remaining poses
      13m 17s
    7. Fine-tuning the head rotation
      11m 54s
    8. Fixing layering issues
      7m 42s
  6. 2h 10m
    1. Introducing the turnaround
      2m 55s
    2. Creating the B head (3-quarter)
      6m 45s
    3. Creating the C head (profile)
      8m 51s
    4. Creating the D head (3-quarter rear)
      13m 2s
    5. Creating the E head (rear)
      8m 59s
    6. In-betweening symbols manually
      9m 58s
    7. Creating the H head
      6m 41s
    8. Creating the G head
      11m 33s
    9. Creating the F head
      19m 18s
    10. Creating the B mouth (3-quarter)
      13m 41s
    11. Creating the C mouth (profile)
      14m 33s
    12. Adding detail to the C mouth
      7m 42s
    13. Creating other mouths
      6m 28s
  7. 54m 24s
    1. Putting together a head rotation
      14m 29s
    2. Moving frames between symbols to make a rotation
      10m 23s
    3. Using the rig with audio
      14m 59s
    4. Adding expressions to the animation
      14m 33s
  8. 1m 0s
    1. Goodbye
      1m 0s

Watch this entire course now—plus get access to every course in the library. Each course includes high-quality videos taught by expert instructors.

Become a member
please wait ...
Rigging a Face in Flash Professional
6h 46m Intermediate Sep 19, 2012

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.

Topics include:
  • Setting up layers for the head
  • Animating blinks
  • Fine-tuning expressions
  • Fixing layering issues
  • Adding expressions to the animation
Subjects:
3D + Animation Character Animation
Software:
Flash Professional
Author:
Dermot O' Connor

Building unique mouth shapes

Now that we have three standard sets of dialogue mouth shapes, let's do something that's a little more interesting and dramatic, because obviously you want to have something that's not just conversational, like these, although these were cover you for most purposes. So I have created, in this project file 02_05, three new unique mouth shapes that are really wide open, kind of gritted teeth, like grr and like a huh, like he is really, really dumb. So let's see how we would proceed about rigging these. Now, I have set up some placeholders here.

We've got on frame 64, the basic starting happy mouth on frame 1; on frame 70, the jubilant mouth; on frame 76, the furious; and on frame 82, the puzzled, and then we will go back to the basic happy mouth. So let's just select the a-mouth from the happy set. And I will Option+Drag it to here, and let's just copy it to all of these.

And the other thing, let's just set tweening on for all of these as well: Create Shape Tween, Create Classic Tween, and Create Shape Tween. And the other thing that you will notice is that the reference, we're going to be drawing over this big black thing. It's probably too dark, so let's just lighten it up a little bit. I am going to pick this gray here and copy it again, just to make all of these mouth shapes light gray, and then padlock that, and then we'll be able to see what we're doing over it, so it's nicely faded out.

So once again, I like to work, usually when I am doing dialogue like this, is is to work with the mouth inner, because it's kind of the big outline form. It's the first thing that you're really going to see. So let's magnify and zoom in, get as close as we can. For the purposes of this course and for most of the work that I do, I like to use a geometry shape with 6 points. As you can see here, as I begin to pull it apart, we have a pretty basic shape. Oops! We lost one of them. Let's come back. And let's switch off Snap because it is kind of getting in the way a little bit.

So you could create a new hexagon and work from that. I find it just as quick sometimes just to work with the existing shape here. And also, you can go back and forward frame by frame as you work. If you ever find you're having shape tweening misbehaving, this is a great thing to do. Move one point at a time, go back or go forward, still good. If you pull these midpoints, nothing will happen of course. The danger happens when you pull the corners. So we're still fine, and there we go! So there are a couple of ways. You could perfect each one vertically or you can just keep going to the next shape and pull that and do them one at a time.

I like to work vertically. I like to take on one shape, working, and then move on to the next one. So let's padlock that, and then I am going to just move the timeline over so I can see what level I am working on more easily. So let's hold down this key. Alt or Option and Drag to the mask level, to copy that. And let us have a look at the mouth inner and solid color, because now we're going to move on to the lips. I think the easiest way to do the lips is simply to copy the mouth inner to each of these, and let's just do with the upper one now.

I am on the lip upper. Let's make it black. And all we have to do is pull these shapes up to match. By copying the mouth inner and duplicating it, half of the work is done for us; we don't have to worry about aligning to there. And don't forget to test. We move back. Ah! And we're seeing some strange lines crossing over here. So let's see if we can fix that, and it's gone. It is just simply a question of taking the point and pulling it slightly to the right.

I won't lie to you, sometimes you have to spend a bit of time doing this. Sometimes I will just delete an entire layer and start it over again or redraw a different point or try a different geometry. The reason why it's worth doing is once you get it, it's really, really good to have. And let's do the same thing now for the bottom layer. Let's hide the upper lip, change the bottom layer to black. Let's zoom out a little bit, and let's pull this down. And you'll see me toggling back and forth in the timeline.

And the same thing is happening again. That's really irritating. So let's go in and see if we can fix that. It's been moving this maybe left or right, up or down. It's not the end of the world. I am dubious as to if it gets to a certain point, if you would even notice it, once you're playing this at 30 frames a second, but obviously we like to get this as clean as possible. So let's move that to here, so we can really see what's going on.

I've also want to click on the Subselection tool to see where our points are. Maybe they're just not aligning quite right. Let's move that up. And let's zoom out a bit, see if that works. That's much better. So that's the process for dealing with those little strange crossovers. Move that line down, and we have that fixed. That wasn't too bad. And then the next step is the easy part, is to just change the teeth to match the reference.

So let's switch off everything. Now, sometimes I get lost with all the levels, so I will switch everything off, except--okay, I need the reference layer. But I am on the teeth upper, let's go into Outline, and maybe let's keep the mouth inner level, so we can see exactly where we are with the vectors, and then use the Free Transform tool, the arrow keys to nudge the teeth. Same thing with the bottom teeth. Let's switch them on, put them into outline. I am using Shift and the numeric keys to move in big increments.

Switch on the tongue layer. Let's bring that down, great! And padlock them. Now we have a really nice transition into a really exuberant, jubilant yell. And then the last thing to do is the lip layer. Let's pick that on. You see by clicking on at the bounding box you can see roughly where it is, so let's drag that down. Subselection tool. And that works great! So that's the first one.

As you can see, it didn't take too long. The only annoyance plus fixing the lips for that little glitch. Let's go on and do the furious mouth and see if it will be as painless. So we'll try the mouth inner. And again, make sure we are on the right layer. Let's see it in full color. It looks good! There is no little weirdness around the corners of the mouth. Everything is solid. And let's quickly check the--we've lost one of our points. It happens sometimes. It's not the end of the world for something like this, but I'd like to get it back, just to be picky. Let's put Snap back on.

See, there it works now. So I can pull this point and the edge is still there. Same here, same there, same there. So, we still have our original level of control over this. Let's padlock that. Don't forget to copy that to the mask, which is identical. We'll also copy that to the lip lower and the lip upper, and let's color these both black. Okay, hide everything again. Let's look at the mouth inner level and just the lip upper, and now just start to pull the corners up a little.

Hmm, it looks like something happened. I didn't test this, but something was happening when we moved from the jubilant mouth into the furious mouth; it's not quite tweening right. So this is a point where we could consider, I think, adding a hint. But again, if we do decide to add hints to these, then they have to be added to any future transitions, and I'd rather not do that. So let's see if we can go back and tweak this somehow. I'll click at the reference layer. It might be necessary to play with the shape of this mouth, and maybe pull the corner up slightly.

The corner here is at this point, and Flash is doing. Ah! There we see. There's one point too many. That's why it's getting out of control. Again, I am glad this happened, because you will face this if you do decide to use this method in your work; there's no escaping it. These little glitches happen, and here's how you cure them. Let's hit Subselection again, and now we're back to 6 points. Phew! So let's click on that. Alt or Option, don't forget we need to repeat the process.

Copy it to all the levels that we will be building this on. So we've copied the mouth inner level that tweens property now. Let's back to the mask and lip lower and lip upper. So I am going to go to the lip upper, make it black; lip lower, make it black. Okay. Now, with the mouth inner on and lip upper on, we can get back to fixing this. Let's pull these points up. We will switch off Snap to Objects if you want to go really fine.

That's beautiful. Padlock that, hide it, and add the lower lip. Now we're getting across over here, and this is something that you could spend some time nudging with, trying to purge that artifact from it. But I have to be honest, some of these go by your eyes so quickly and you're going to be looking at them at about, something like this size, unless it's like a super, super close-up, let's play this at 30 FPS and see if you can see it. It is so fast, not even teeth on there.

You can barely notice it. So for this purpose I am going to a slide. I mean, I don't know to what extent you think that it will be worth your while spending half an hour trying to get that little crossover to go away. But it certainly is possible. It's just a question of playing with these shapes and making little compromises, perhaps with the design. You can see that that actually made it worse. So basically, the point of the process here is to make a change, go forward a frame, back a frame, make another change. Don't make 20 changes and then go back or forward.

But that's more or less covering the shape of the mouth, and it's moving by pretty quick, so let's just leave it for now, and I am going to drop in the teeth. Let's hide everything now except the reference layer, the mouth inner in outline mode, and drop in the teeth, put them in outline as well. I said at the beginning of this course that working in Flash is a bit like making a Frankenstein monster, and this is exactly the kind of thing I meant. You're constantly dealing with slightly glitchy behavior, and it's a balancing act to try to get the best value out of the program that you can in a reasonable amount of time.

So the last little correction to make here will be on the lower lip. Let's see if that works. Let's hide the Reference. And actually, I will pull the lip up a little bit. So now we have a neutral mouth that moves into jubilant, into an angry position. Notice you can see that little lip, the area here, it's kind of hard to see. And I will leave you to do the puzzle, appropriately enough, as an exercise, and that's this shape here.

I hope you can manage that without too much brain bending. But again, I stress, be patient. You will find you'll probably have to make a couple of passes at this. Don't give up. If you do it once and it doesn't quick work, stick at it. I tried this first many years ago and I gave up on my first attempt. I just got discouraged. And by the time I got back into it, three years later, I realized, oh! If only I had stayed with it for another couple of hours or a day or two, I really would have gotten so much more value out of the program. So don't be afraid to experiment and to try different approaches to get the effect that you're looking for.

There are currently no FAQs about Rigging a Face in Flash Professional.

 
Share a link to this course

What are exercise files?

Exercise files are the same files the author uses in the course. Save time by downloading the author's files instead of setting up your own files, and learn by following along with the instructor.

Can I take this course without the exercise files?

Yes! If you decide you would like the exercise files later, you can upgrade to a premium account any time.

Become a member Download sample files See plans and pricing

Please wait... please wait ...
Upgrade to get access to exercise files.

Exercise files video

How to use exercise files.

Learn by watching, listening, and doing, Exercise files are the same files the author uses in the course, so you can download them and follow along Premium memberships include access to all exercise files in the library.
Upgrade now


Exercise files

Exercise files video

How to use exercise files.

For additional information on downloading and using exercise files, watch our instructional video or read the instructions in the FAQ.

This course includes free exercise files, so you can practice while you watch the course. To access all the exercise files in our library, become a Premium Member.

join now Upgrade now

Are you sure you want to mark all the videos in this course as unwatched?

This will not affect your course history, your reports, or your certificates of completion for this course.


Mark all as unwatched Cancel

Congratulations

You have completed Rigging a Face in Flash Professional.

Return to your organization's learning portal to continue training, or close this page.


OK
Become a member to add this course to a playlist

Join today and get unlimited access to the entire library of video courses—and create as many playlists as you like.

Get started

Already a member?

Become a member to like this course.

Join today and get unlimited access to the entire library of video courses.

Get started

Already a member?

Exercise files

Learn by watching, listening, and doing! Exercise files are the same files the author uses in the course, so you can download them and follow along. Exercise files are available with all Premium memberships. Learn more

Get started

Already a Premium member?

Exercise files video

How to use exercise files.

Ask a question

Thanks for contacting us.
You’ll hear from our Customer Service team within 24 hours.

Please enter the text shown below:

The classic layout automatically defaults to the latest Flash Player.

To choose a different player, hold the cursor over your name at the top right of any lynda.com page and choose Site preferencesfrom the dropdown menu.

Continue to classic layout Stay on new layout
Exercise files

Access exercise files from a button right under the course name.

Mark videos as unwatched

Remove icons showing you already watched videos if you want to start over.

Control your viewing experience

Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.

Interactive transcripts

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.

Are you sure you want to delete this note?

No

Notes cannot be added for locked videos.

Thanks for signing up.

We’ll send you a confirmation email shortly.


Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

Keep up with news, tips, and latest courses with emails from lynda.com.

Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

   
submit Lightbox submit clicked
Terms and conditions of use

We've updated our terms and conditions (now called terms of service).Go
Review and accept our updated terms of service.