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

In-betweening symbols manually


From:

Rigging a Face in Flash Professional

with Dermot O' Connor

Video: In-betweening symbols manually

As we've already mentioned, the ears are giving us trouble, so they are in their right physical position, but they're just the wrong shape, and that's obvious, because you can't have the same direction of the ear around 360 degrees. So let's see how we will fix that. So let's just click on the right ear. We'll switch off everything; keep things nice and simple and clean, except the jaw, the neck, and the skull, so we can really see the amount of motion on this thing. We get to this point and I'm going to put the reference layer on beneath, and going to go to Outline mode, and let's go in and take a look at this.
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

In-betweening symbols manually

As we've already mentioned, the ears are giving us trouble, so they are in their right physical position, but they're just the wrong shape, and that's obvious, because you can't have the same direction of the ear around 360 degrees. So let's see how we will fix that. So let's just click on the right ear. We'll switch off everything; keep things nice and simple and clean, except the jaw, the neck, and the skull, so we can really see the amount of motion on this thing. We get to this point and I'm going to put the reference layer on beneath, and going to go to Outline mode, and let's go in and take a look at this.

So already by this point here by the D angle, this ear should look quite different. So what we're going to do is go to the labels at the top, right-click, and go Copy Frames. And then go to the ear symbol, that's right here, double-click on that, and now we're inside the ear symbol. And if you go into Outline mode again, we can see next to the image that we want. Now what I want to do is to create for the ear symbol its own internal timeline and its own internal selection of ears.

So let's make a New Layer and right-click on the New Layer > Paste Frames, and then just extend the timeline, hit F5, and right under the D, here's where we're going to make a new ear. So hit F6 for that. And I don't like this light green, it's not a really great color, so let's pick dark green for this, so you can actually see ourselves in Outline mode. And there are a few different ways of doing this. Let's split this onto some layers and make it a bit easier. So what I'm going to do is make a new layer, take this inner color, for example, copy it, and on that external layer, on the upper layer, paste in place, Ctrl+Shift+V, and actually let's just do the same thing for, hold down the Alt+Option key and copy that, and we'll take it off this.

So just Eyedropper, paint it out on the bottom layer. So what we have now is two frames that are of the same, with no internal line. On the top layer we have the internal shape, and now we can start playing around with it. So frame 1 is great, it's exactly the way it was. Frame 2, let's start pushing that. So I'm going to select everything, draw a box around it, and with the Free Transform tool, just pull this into place. And even though it's slightly different, I'm not going to heroically try to match the reference drawing. I'd rather have this be a little bit closer to the original state.

It will make a much better transition. And let's thicken the highlight area. I am switching Snap off so I can get a much more fine level of control over this. And this is why I like having this fellow on its own layer, it just makes a little bit easier to control, zoom in a little bit. Actually if I can padlock that and select the layer. It's getting a little too thin. I'd like it to really match the line weight of the first one.

I don't like it when these feel like you've just grabbed them and skewed them really thin, it looks kind of lame, whereas this looks more like an original piece of work, which it is. Now this is on Frame 13, which you can see down here, on the current frame marker. So let's go back to the external clip, the head turnaround, and on this I'm going to click on that, and in the Properties panel, under Looping, set to Play Once, and I'm going to set it to 13. You can set it to Single Frame as well if you prefer. What I'm going to do here is try to make a few of these so that we can actually get several different ear images working here.

So let's zoom out and already we have, I think you get the general idea, the ear in a much more believable position. By the time we get to here, we need one more, and this will be on the E frame of the internal, and that's number 17, so let's click on that. And again, notice, I'm not flipping anything horizontally. These symbols, both the right ear and the left ear, are in their natural position. They're not being mutated beyond having extra pieces of artwork inside them. So let's make the E an absolute mirror of this, but it will be the internal shapes that are being flipped, not the symbol itself.

So in this case, we're looking at the back of the ear, we don't need that inner shape. So select the lower level, Modify > Transform and Flip that Horizontally, go in really close. And I'm just going to use Shift and the Arrow Key to get it closer. Click Snap to Grid on will get us to snap to this little thing, View > Snapping > Snap to Grid, because I want that to be exact. It's a little bit off on this, so let's pull that in as well, there we go.

How great is that? And now we could probably use some in between frames between this and this, but first let's see what we look like. Also, the A here will probably start coming in somewhere around here, but for now let's just see what this looks like by itself. So we have to correct the looping instruction, and we're on frame 17, which you can see down here. So let's go to Play Once, frame 17.

Now we go from the first frame to this pretty quick, and then we have 1, 2, 3, internal frames before we get to that, and maybe one more in-between. So what I'm going to do is show you how to do a manual in-between in Flash. So let's click on this, go in really close. I used to do in-betweens by hand back in the day, and it turns out to be a very useful skill in Flash.

Let me make a couple of empty layers, and we want to go between here and here. And I'm just going to make one between these two extremes. So let's make a blank here and here. I'm going to make another empty frame here, so this will be our first frame. Hit Ctrl+C, Ctrl+Shift+V to paste it into place. Go into Outline mode so we have this proper outline, which is the first frame, and we're trying to in-between into this one, so Ctrl+C and Ctrl+Shift+V here.

And let's hide the two layers. So now we have copies on one layer of our first and our second key. And let's pick nicer Outline colors for these, we'll pick medium green and medium blue, so we can see them. Okay, so let's draw. We'll use the line tools in Flash for this. Let's make some marks here. So I'm going to make this a hairline. I like using a hairline color for this. Let's put Snap on so we really get precisely onto that, and now we can switch it off.

And by holding the Alt key you can just pull the line and make new points, and I think we want to switch off any other snapping like Grid. So if you have a tablet of course, feel free to draw it. I'm working with a mouse, so that even those of you that don't have tablets can get the general idea that you don't have to have a tablet to do this. And also padlock the two lower layers so you don't interfere with them. I'm going to make this pretty quick and dirty, again, just to give the general idea.

Make a Snap back on, and if it's hard to see then hide the other temporarily. Okay, and then one more, that will just color this for the highlight area that defines the edge of the ear so we can see it. And then Snap off. Nice! There it is. So now let's color it.

I'm going to get rid of these two and drop that, let's see where we will put it. So we have this and we have this, so let's just drop this down to here, and move that blank frame to there. So we're going from the start position to the skewed forward, to this intermediate position, to that one. So now I'm going to use the Eyedropper just to grab the colors and paint, and let's double-click on the lines to get rid of them.

And now when we go back to the head turnaround, there is the intermediate frame. And of course you can add as many of these as you like, and probably one more on each side wouldn't hurt. Let's go back into full color so you get the idea. And you might think how few--how many of these do I need? It's really a matter of your personal taste or the style of the project that you're working on. It depends on how naturalistic you want it to be. The exact same process will apply to the left ear.

So what I'm going to do in the meantime is leave the rest of this to you as an exercise. I will provide the final artwork with the smooth in-betweens, so that you'd be able to see that in the exercise files. But this is a really, really cool trick to have up your sleeve and it will really help you to sell all kinds of illusions that will otherwise simply would not be possible. Small thing, we have to deal with the layering a little bit, but again, that's something that I'm going to leave to the final fine- tuning pass of this particular section.

So with that, I think we're ready to move on to--first of course, please have a go at fixing the left ear, and feel free to use some of these as reference of course. Don't copy this horizontally onto the left ear, that's a shortcut that you really should avoid, but do feel free to take the internal timeline and copy that into the left ear symbol. That's not a problem. So with that, we'll move on.

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.