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

Rigging a Face in Flash Professional
Illustration by John Hersey

Moving frames between symbols to make a rotation


From:

Rigging a Face in Flash Professional

with Dermot O' Connor

Video: Moving frames between symbols to make a rotation

In this movie, we'll do a very subtle head turn. We are going to improve it a little bit by moving frames from one of our rigs and goes into another which is a very important skill to know how to do. First, before we go any further, I want to show you a fundamental Flash glitch that is the kind of thing that crops up from time to time, so not to get freaked out if you do see it at some point. If you open the library and look at the body test hd reaction symbol, click on that, and when you play it, have a look at this, absolutely weird, and I saw this, and I thought, "Oh no, what's gone wrong?" Maybe it deleted all of my shape hints or something, but there is actually symbols are disappearing here, two at the nose, that's just wrong.
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

Moving frames between symbols to make a rotation

In this movie, we'll do a very subtle head turn. We are going to improve it a little bit by moving frames from one of our rigs and goes into another which is a very important skill to know how to do. First, before we go any further, I want to show you a fundamental Flash glitch that is the kind of thing that crops up from time to time, so not to get freaked out if you do see it at some point. If you open the library and look at the body test hd reaction symbol, click on that, and when you play it, have a look at this, absolutely weird, and I saw this, and I thought, "Oh no, what's gone wrong?" Maybe it deleted all of my shape hints or something, but there is actually symbols are disappearing here, two at the nose, that's just wrong.

So when I click inside the head. That all looks fine, and then when you click outside the head, let's go back to the symbol, and now everything is just back to normal. So, if you see that happening and your character becomes a faceless wonder, don't panic, simply tunnel into this symbol and back out again, and that will fix the problem. Now there's a couple of other problems that could arise with this, if you have a project file that has hundreds of symbols, that's a lot of work to be going back in, and clicking in one and back out again just to make this bug go away.

This is a CS6 bug that has crept in, in the latest version. So, one workaround is to save your file as a CS5.5 or a CS5 document, and then open it in a version of Flash that's CS5.5 or 5, and it will go away. I've tried this, and it simply does not appear anymore. It solves the problem. The problem is you have to have access to CS5.5, it doesn't help you very much if you only have CS6. I'm sorry about that, I wish I had more to tell you on that, but that is the situation right now.

If you do have CS6, and you have no backward version, then you're basically trapped into using this little workaround. I would also recommend that you check the Adobe website for updates to Flash in case they do get around to fixing this glitch. But that is a situation that we're in at the moment. Anyway, that said, let's make another cool little scene. This one will be a little bit simpler in some respects. What I want to do is to take our head turnaround, hd 1 turnaround, right-click, and duplicate that, and I am going to call it test hd turn, space, test hd turn.

We'll call it turn LR from left to right, click OK, and double-click on this. I'm not sure if we need to embed this or not. I am going to go from the H direction into the A direction, and then forward again into the B direction. That will be the range of motion that we're going to do. So I suspect this is going to be fairly constrained. So let's just work inside here inside our test hd turn LR symbol.

Let's get rid of the reference folder, let's clean up a little bit. There is all kinds of little bits and bobs around the place that can be cleaned up, but this is always the way of Flash. Little bit of housekeeping from time to time keeps your files clean. So, let's get rid of all of the poses that we don't need, and that's C, D, E, F, and G, and we don't need these two. So, we are going from H to the A pose to the B pose.

So, what I'm going to do is select these two, and this might break some of our shape hints, but don't worry, we'll fix them in a moment, and just drag that to here. Super simple! That's all we're doing. So, of course we've got some broken business with the ears. This always happens when you do this kind of thing in Flash, there is hints or there is extra frames and spot to spot, don't worry about that. So, let's stretch this out a little bit. It's a bit fast.

There will be two more empty frames, hit F5, one, two. Next, I want to correct this ear. So, I click on that to find what level we're on, and we need to put an ear in that level. So, let's copy this one, Ctrl+C, Ctrl+Shift+V, so now we have two and put a blank frame after that. So we hand it off. That's taken care of the worst of it. The right ear seems to pop on a little bit.

So, let's see if we have one beneath. We do right there. So, Ctrl+C for that, that's on this level, and if I put it up here, however, it will pop on top of his head. So, let's copy this ear, Ctrl+C down to here, Ctrl+Shift+V, and you see it just got a little bit darker, and now we can black that out. Let's see if that works. That's better! Okay, so that's basically it. If this was a head turn, I wouldn't want to be moving the neck so much.

It's more like the whole body is rotating. So let's just go with this neck position here. So, I'm just going to drag that back to there and delete this, Clear Keyframe, and maybe adjust the neck in a little bit, but this is a better sense of what's going to happen. So what I want to do is just pull that neck in a little bit, padlock everything except the neck, coax it in, do that, let's track through. That seems to work better for most of them.

If you were animating a head turn, I always stress this isn't going to be the be-all and end-all animated head turns, let me just fix this little neck. What I want to do is to show you how you move frames from one comp into another. So, what I want to do in the middle of this turn right here is for the head to dip down a little bit. That will be a much more standard way of doing a head turn, and if we didn't have this already done earlier, we'd have to go in and move all these objects down, and there are so many of them, and we've already done this work in our other rig.

So let's go into that, open the library, go into the hd 3 clock, and if you remember, our 6 o'clock position already has all of that work done, including changing the shape of the hair, and we can obviously make this a little more subtle, but this is the bulk of the work already taken care of for us. So let's just select all of these, copy those frames, and now go back into your library and back into the test head turn left, right, and now currently, we have A, select that stack, right-click, and go Paste Frames and watch what happens to the head.

Flash has inserted a keyframe here that we don't need right after our paste, get rid of that, right-click, and go Clear Keyframe, and now we have a much nicer little head turn, of course a lot of these shapes need to be fixed and so let's see what that's going to entail. Skull will probably be fine. The left hair will get small and disappear almost.

So we probably have to add some hints in here, so same process again. Go to the Properties panel, insert a blank label, 5 hints, A, B, C, D, and E. There we go, click and match them on the second. Again, remembering to back up your file before you do too many of these, and we need to fix these here as well. Okay, super! Now, we just repeat that process, and there may have been a little bit of slippage here, so pull the hints off.

If I see things like this, it tells me something got moved, sometimes it is easier to move them all, A, B, C, D, and E, great! Same, let's not wonder it's flickering. It's good, okay, and we just keep going, and we need to fix these here as well.

So, let's just click off this. So now let's unhide everything, and it's looking a lot less scary now. When I looked at it first, I thought, "Oh no! I think this is going to be a nightmare!" But we fixed a few hints here and there and suddenly things are looking really polite again. So, from here to here looks pretty good, maybe there's a slight issue with the ear at this side, it needs somewhere to go to, and that means we need to adjust for a layer again, and that's the blue ear here. So, let's see, from this point on, that ear should be on the bottom level, meaning that you go from here to--let's see, would it be here? Actually, it should disappear from this level, so let's put a blank frame in there, and let's fix the neck.

I am going to put a keyframe in there, and just pull that neck in, and that's it! So, this is a great help when there is a little bit of business going on, on the top of the hair that needs to be fixed, but I think you get the idea from this, and if you had a lot of very detailed characters, actually they are the ones that really pay off on this, if the character was super simple, and you could probably make up all of these little positions as you go along. But with this guy, he has got so many levels, I don't won't to be messing around with these every time I need to do a head turn.

This way, I can create the different angles for the head. The system that I used during this course is my own system, you might find it's not even complex enough, you might need more positions or less. But this is the general methodology that I use for years now to pre-create all of these little poses and directions that give a level of subtlety that is just time-consuming to have to add if you have to do it for every single keyframe and to do animation that goes beyond the usual flat Flash symbol pushing style. So in the next movie, we're going to do some facial acting and make the character really show some emotions.

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

Share a link to this course
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

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
Welcome to the redesigned course page.

We’ve moved some things around, and now you can



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.

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