Spring 2007 week 9: evening—03/019 morning—03/21

hi everybody,
sorry about the delay again for this week's posting; however, as our lessons get more and more complicated, as we learn more and more and start to put together our animations, the postings take more and more time to input here in my blog. i hope you all understand that you can scroll down and look to the right, where you will see links to each week's posting in case you forget how to do someting, or in case you need to review something we've covered previously in class.
    this week's posting below, covers the panning motions from our storyboard and script—the panning movement down from the sky to the ground, and the panning movement to the right along the landscape and fence. carter-

1. TOPICS:
   
   1. LINK   —Layer Stacking Order
      
   2. LINK   —Symbol Positioning Placement
      
   3. LINK   —Panning Motion I: pan down from sky to ground
      
   4. LINK   —Panning Motion II: pan right from dog to cat
      
   
   
2. HOMEWORK:Following this week's demonstration, you should continue work on your animation and complete the pan down and pan right animation.
   
   
3. STORYBOARD: below you will find links to each of the pages of the storyboard containing 3-frames each.
   
   • LINK   Frames 1-3
     
   • LINK   Frames 4-6
     
   • LINK   Frames 7-9
     
   • LINK   Frames 10-12
     
   • LINK   Frames 13-15
     
   • LINK   Frames 16-18
     
   • LINK   Frames 19-21
     
   • LINK   Frames 22-24
     
   • LINK   Frames 25-27
     
   • LINK   Frames 28-30
     
   
    
   
4. INTRODUCE:
   
   1. Layers—Stacking Order;
      
      
      

      1.	For our beginning in this entry, we'll start where we left off with our posting two weeks ago when we faded into the movie and the title—see above, or click on the following link (fade-in/fade-out). Let's first observe, however, what the layer stacking order is: fade title tree_near dog cat fence fence_shadow cow ground moon stars
      2.	Symbols—As you can see from the example above, that we have already completed the very beginning of our animation in which the sky fades in, followed by the title. If we compare this little animation so far to our storyboard, we will soon see that we have completed the first three frames at this point (frames 1-3); however, our goal now is to complete a few more frames from the storyboard, namely the ones that include the panning motions. There are two of these camera movements, pan down from the sky to the ground, and pan right from the dog to the cat. Since our 'camera' is stationary, since we cannot move our imaginary camera, we have to figure something else out.     If we think of our camera as the stage (everything must pass across the stage in order to be in the shot), then we realize that instead of moving the camera, aka the stage, across everything, then we must move everything else across the stage, aka the camera.     To pan down, to move from above the ground, down to the ground, we must put everything, the entire landscape, below the stage.     Therefore, since we have to make everything move, everything must then be a SYMBOL
      	The stage is the smaller grey rectangle in the upper left. Notice how everything in the scene is placed below the it. Also, notice how the elements that set the scene, the tree, the ground, fence, etc., together all are more than 2 times as wide as the stage. This is so as to allow for the pan right movement as well.
      3.	Pan Down—Starting at the point where the title fades out, frame 80 according to our last class demonstration, but it could be any frame depending on your animation, we will begin the panning motion.     The title fades out by frame 80, so we will begin the pan down after this, say at frame 85. Therefore, we will need to put a keyframe in all the layers that contain elements fromt the scene: tree_near, dog, cow, cat, fence, shadows, tree_far, ground, moon, and stars. The movement begins in frame 85, so the easiest way to place a keyframe there in each layer is to first select frame 85 in the tree_near layer. We do not need to concern ourselves with the fade or title layers because they will not be panning down.
      4.	Then, hold down on the shift key and click in frame 85 in the bottom layer (this should be the stars layer.
      	This should select frame 85 in all the layers.
      5.	Once selected, then add a keyframe (F6)
      6.	Now, similarly, we need to add another keyframe to mark the end of the pan down motion. We'll give the movement about 70 frames, which would put us in frame 150. So, click in frame 150 in the tree_near layer, hold down on the shift key, and click in frame 150 of the bottom layer, the stars layer. This should select frame 150 in all the layers. Then add another keyframe (F6). ***Careful NOT to deselect anything at this point.***
      7.	When you zoom out (do not deselect), you should see that everything below is selected. This is what we want. It will help us move everything together. To do this, hold down on the shift (to move things faster) while you click on the up arrow key. Do so until the ground and all is on top of the stage.
      8.	Then add a motion tween. This will cause everything that was below the stage to move gradually upwards until it is on the stage.
      9.	Pan Up—Now that we have completed the pan down camera movement, we have to work on the pan right. One clue as to how to do this is to notice that the ground and fence and entire scene that we drew is more than 2 times the width of the stage. This means that we will push everything to the left in our motion tween this time to simulate the pan right motion of the camera.     This time, we will give this movement about 75 frames; so, in the tree_near layer, click in frame 225, hold down the shift key, and click in frame 225 of the ground layer, and add a keyframe (F6). This time, do NOT include the moon and the stars.
      10.	Once again make sure you do NOT deselect anything. Just hold down on the shift key and use the left arrow key to move everything selected to the left until the right edge of the ground is just offstage.
      11.	Add the motion tweens to each layer as before.
      12.	Finally, click in frame 225 of the moon and the stars layers and extend the duration (F5).

      
      
   
   

Spring 2007 week 8: evening—03/012 morning—03/014

Hi, class,
You may notice that this week's posting is very similar to last week's, save the fact that I discuss a different character, the cow instead of the dog. That is because most of the posting concerns the same thing—the creating of complex symbol. This basically means, the creating of symbols within symbols. This is what we did for the dog, and so this is what we are going to do with the elephant. First, we make a series of graphic symbols, and then we combine them into a larger movie-clip symbol that encompasses the others.
    For the homework, I want you to continue working on the complex symbols, particularly the dog and the cow. Make sure that you've got them looking nice for next week's class, and try to animate them so that their heads are moving back and forth.

Have a nice weekend. Carter-

1. TOPICS:
   
   1. Complex Symbols:
      
      • LINK   Graphic Symbols—creating the initial graphic drawings of your characters, and creating all of their parts as individual symbols;
        
      • LINK   Nested Symbols—placing symbols within symbols;
        
      • LINK   Animated Symbols I—animating symbols within symbols: moving the cow's head;
        
      • LINK   Animated Symbols II—animating symbols within symbols: giving the cow blinking eyes;
        
      
      
   
   
2. HOMEWORK:This week, work on your animation projects. We will be working on these animations from now until the end of the term. The assigned homework is always going to be the minimum amount you should accomplish during the week, so I highly recommend you do much more each week.
   
   • Continue work on creating complex symbols for your characters as demonstrated in class, and in this week's posting.
     
   • For your cow and dog symbols, attempt to add the necessary animation. If you look at the storyboard, you will see that their heads move back and forth.
     
   • Also, make all of your characters have blinking eyes.
     
   
   
3. STORYBOARD: below you will find links to each of the pages of the storyboard containing 3-frames each.
   
   • LINK   Frames 1-3
     
   • LINK   Frames 4-6
     
   • LINK   Frames 7-9
     
   • LINK   Frames 10-12
     
   • LINK   Frames 13-15
     
   • LINK   Frames 16-18
     
   • LINK   Frames 19-21
     
   • LINK   Frames 22-24
     
   • LINK   Frames 25-27
     
   • LINK   Frames 28-30
     
   
    
   
4. CHARACTER SYMBOLS:
   
   1. Graphic Symbols—making the entire drawing one single symbol:
      
      1. Following last Monday's class, after you have drawn your cow character, select the entire drawing (if there is nothing else on the stage, click in frame 1 of the layer to this).
      2. Click on F8 to Convert to Symbol.
         
      3. Give it a unique name (name it cow), select graphic for behavior, and then click okay.
         
       
      
   2. Complex Symbols—creating nested symbols: symbols within symbols
      
      
      

      1.	Sometimes it is necessary to create complex symbols. In the following situation, we will make the head, the body, the legs, and the arms into separate symbols. First, we must break apart the graphic symbol that we have already created. To do this, select the cow symbol by clicking on it one time.
      2.	Next, break the symbol apart by selecting ctrl-B. At this point, the drawing of the cow on the stage is no longer a symbol instance; however, if you look into the library, you will see that you still have the symbol there.
      3.	Now, select only the head of the cow. To do this you must use the arrow tool, and zoom up very close. Make certain you get all of the pieces of the cow’s head in the selection. It is very important that you do not leave any piece of the head out of your selection.
      4.	Next, once you select the head, choose the arrow tool (V) and move the head away from the body.
      5.	5.If you find that there are pieces of the head left out, little fragments of lines or color, then undo until the head goes back into place, and try selecting again.
      6.	Once you select the head and move it away from the rest of the cow’s body, then convert it into a symbol (F8).
      7.	Give it the name cow_Head, select graphic for behavior, and then click okay.
      8.	Now, look at the cow’s body. You should notice that there are little gaps in the body where the head used to be. Fill in these gaps and round them out.
      9.	Once done, let us try and select one of the arms of the cow; however, you will probably soon see that in such a case, when you click on the black area, it selects the black on the arm, as well as all the black on the body. So, we'll have to separate the arm from the body by drawing a single line. We can do this with a colored line so that we can see it stand out from the rest of the drawing. We will also know that we have to later delete the line. We can do so with both arms right now.
      10.	Now, double-click on one of the arms and move it away from the body. Then, do the same thing to the other arm.
      11.	Remember to delete those lines that you drew to separate the arms from the body.
      12.	Then, select one arm at a time and convert them to graphic symbols. Name them cow_arm1 and cow_arm2.
      13.	We need to do the same thing for the legs, although with this particular cow, they will be a bit easier than the arms. Therefore, simply select each leg, one at a time, move them away from the body, and convert them into symbols named cow_leg1 and cow_leg2. Don't forget to round out the tops of the legs, and to remove the strokes there.
      14.	Before we convert the body into a symbol, you may have noticed that there are gaps missing from the body, chunks cut out where the arms used to be. We must fill these two areas in before we convert the body into a symbol. To do this, we must use the line tool again to close off the spaces, and then the paint bucket to fill them in.
      15.	Finally, select the body, and convert it to symbol (F8). Give it the name cow_body, select graphic for type, and then click okay.
      16.	Now that we have at least five graphic symbols, you may try to put them all back into place, as in a puzzle. You will find that the head is below the body, partially hidden by the body. To correct this, select the head by clicking on it one time.
      17.	Next, go to Modify >> Arrange >> Bring to Front. This will put it above the body. Repeat this for the arms so that they are also above the body.

   3. Movie-Clip Symbols—combining all the individual graphic symbols into one single movie-clip symbol:
      
      1. Once the cow is reassembled and looks like it did originally, we will put it together into a single symbol. As it is now, it is composed of six parts: the head and the body, the two arms, and the two legs; but we want to envelope all of these parts together in a single symbol. To start, we must select all the symbol instances, each of the body parts together.
         
      2. They must all be selected in order for this to work, so make certain you see blue boxes around them all. If so, then click on F8, convert to symbol.
         
      3. Give this new symbol the name of cow_mc, select Movie Clip for type, and then click okay.
         
      
       
      
   4. Animated Symbols—creating symbols that move: Moving Head
      tr>

      18.	The reason we are doing this is because we are going to make the head move back-and-forth as the script calls for. The graphic symbol is usually a static symbol, meaning there is no movement within it. The movie-clip symbol, on the other hand, is a dynamic symbol. It often is a symbol that contains animation. In order to make our new movie-clip into an animated symbol, we must therefore put animation inside of it. To do this we must go into the symbol (into symbol-edit mode). As we have learned, to go into symbol edit mode we must double click on the symbol or symbol instace.     So, using the arrow tool (V), double-click on the cow_mc symbol. Once you do this, look in the upper-left-hand corner of the window and you will see scene 1, cow_mc. This tells us we are currently working inside the cow_mc movie-clip, in symbol-edit mode for the cow_mc symbol.
      19.	Since we are going to animate the head to make it move back and forth, we must put the head into its own layer. We can actually put all of the various body parts, the various graphic symbols into their own layers. To do this we must first select all of the symbols. Then, right-click on the selection and choose distribute to layers.
      20.	Next, look at all your layers. You will see that this action distribute to layers has given the layers the same names as the symbols within them; however, you might also see a few layers without names, that instead have the names layer 8 or layer 3 or layer 13. More than likely, these layers have little fragments that should be discarded and deleted. Before you do such an action, however, you should always make certain there is nothing in the layer that you need. When you are done, you should only have the layers with the names of the symbols.
      21.	Now you have six layers, one with the head another with the body, others with the arms, and still others with the legs. To make certain everything is in the right place, hide one layer at a time. If you hide the body layer the body of the dog should disappear from the stage. If you hide the head layer, the head should disappear from the stage. Do this for each layer to make certain you have all the necessary parts.
      22.	Lock all of the layers except the head layer.
      23.	Choose the zoom tool (Z) and zoom into the head.
      24.	Then, choose the free-transform tool (Q) and select the head.
      25.	You should notice the little white circle in the center. This is the center-point of the head symbol. Click and drag it straight down to the top of the nose. This is the point around which the head will rotate when we make the head move back-and-forth.
      26.	Now rotate the head a little.
      27.	Next, click in frame sixteen (16) of the head layer and add a keyframe (F6)—don’t be alarmed if the body disappears.
      28.	Then, click back in frame eight (8) of the head layer and add another keyframe (F6).
      29.	Make sure that you’re still in frame eight (8) by checking to see if the red playhead in the timeline is over frame eight. Once you are in frame eight then, choose the free-transform tool (Q) again.
      30.	If the center-point is not still above the top of the nose move it there again, and then rotate the head to the other direction.
      31.	Finally, add motion-tweens between frames 1 and 8, and between frames 8 and 16.
      32.	Hit enter to see the head move back and forth once.
      33.	You should notice that the body disappears but the head remains. That is because there is only one frame in the body layer. When the playhead moves past frame one, then the body disappears. Therefore, we just need to extend the duration of the body out to frame sixteen (16). To do that, you just click in frame 16 of the body layer and hit F5 to extend the sprite (aka extend the duration).
      34.	Next, click back on scene one in the upper-lefthand corner to exit symbol-edit mode.
      35.	And lastly, select ctrl-enter to view the animated movie-clip looping.

      
       
      
   5. Animated Symbols II—creating symbols that move: Blinking Eyes
      

      36.	The next thing we'll do is create another movie-clip, but this one will be inside of the cow. We need to have the cow's eyes blinking, which means its eyes need to be animated. Remember, animation is just the change of something across a span of time. It may change colors, or positions, or it may change the way it looks, its size for example; or, in our case, the eyes will change the way they look, from being opened to being closed. Any of these things will constitute animation. Therefore, we will use a movie-clip symbol for the eyes.     We've already drawn the eyes inside the cow_head symbol, so we must go in there to begin. Using the selection tool (V), double-click on the cow_mc symbol, and then double-click again on the cow_head symbol. These two actions will take you inside of the two symbols. If you look in the upper-lefthand corner, you should see.
      36.	Once inside the cow_head symbol, zoom into the eyes, so they are large and fill up most of the screen area. We will need to get into there pretty close.
      36.	Then, select the eyes. Remember, to select more than one thing, you must hold down on the shift key to add to your selection. Before doing so, however, lines must be drawn to separate the eyes from teh rest of the face. Please note the green lines that were drawn to do just that.
      37.	Once you select both the eyes, convert them to a symbol (F8), and name it eyes_mc, choose movie clip for behavior.
      38.	Open up the library, and make certain that the eyes_mc symbol is there in the list.
      39.	Then, select the eyes ON THE STAGE and delete. Notice that there are holes where the eyes were.
      40.	These holes need to be filled up with the paint bucket (K) tool.
      41.	Then, from the library, drag the eyes_mc symbol back onto the stage.
      42.	Double-click on the eyes_mc symbol, to enter into symbol-edit mode.
      43.	Delete the little green lines that were drawn earlier from the eyes.
      44.	Next, click in frame 28 and add a keyframe (F6).
      45.	Since one eye is surrounded by black, and the other eye is surrounded by white, we are going to treat them each a little differently. First, make certain you are in frame 38. Then, for the one in the black, choose the paint bucket (K) and fill in the whole eye with black. As a result, it should completely disappear.     For the other eye, the one surrounded by white, delete the stroke at the top, and fill the rest of the eye with white. As a result of this, just a kind of U-shaped stroke remains. This gives the illusion of a closed eye.
      46.	Finally, click in frame 30 and extend its duration (F5).
      47.	Click back on scene 1 when you have done this to exit the symbol.

      
      
   
   

Spring 2007 week 7: evening—03/05 morning—03/07

Hi students,
I hope you haven't spent the whole entire week away from Flash and working on your animations, as I have from this blog this week. It has been a crazy week for me. My wallet was stolen from a classroom last Wednesday. At first I thought that I'd lost it, but then I retraced my steps and recounted my actions and realized that I had to have had it in my classroom. Funniest and strangest thing is that I got it back in the mail on Friday, without my MetroCard and my cash of course. It is a relief to have it back. And the other thing is that Saturday was my birthday, so I hope you all understand if has taken me a long time to publish this week's posting as I have celebrated partly by going to a film festival this weekend (6 movies). I am a big film fan, of all kinds. Often, when I'm not doing work for class or school, you can find me at some theater or other.
    Okay, enough about me. Please find what we did in class last week in the posting below. Don't delay in trying to understand and do it yourself as it will be required for the final animation.

Six classes remaining...and counting down...

1. TOPICS:
   
   1. Fade-In/Fade-Out—Night Sky;
      
      • LINK   LAYERS: review layer stacking order;
        
      • LINK   TRANSITION: fade-in to a scene;
        
      • LINK   TRANSITION: fade-out from a scene;
        
      • LINK   TITLE: fade-in/fade-out of title;
        
      
      
   2. Complex Symbols:
      
      • LINK   nested symbols—symbols within symbols;
        
      
      
   
   
2. HOMEWORK:This week, work on your animation projects. We will be working on these animations from now until the end of the term. The assigned homework is always going to be the minimum amount you should accomplish during the week, so I highly recommend you do much more each week.
   
   • Complete the fade-in/fade-out sequence, including the title, for your animations.
     
   • Work on creating complex symbols for your characters as demonstrated in class, and in this week's posting.
     
   
   
3. STORYBOARD: below you will find links to each of the pages of the storyboard containing 3-frames each.
   
   • LINK   Frames 1-3
     
   • LINK   Frames 4-6
     
   • LINK   Frames 7-9
     
   • LINK   Frames 10-12
     
   • LINK   Frames 13-15
     
   • LINK   Frames 16-18
     
   • LINK   Frames 19-21
     
   • LINK   Frames 22-24
     
   • LINK   Frames 25-27
     
   • LINK   Frames 28-30
     
   
    
   
4. NIGHT SKY: In this week's class we created the very beginning of our animation that you will work on for the remainder of the term. We did the first three frames from the storyboard above and here (LINK—Frames 1-3). The idea is to read the text next to each drawing in the storyboard to find out what happens, and then to look at the picture to see what the viewer should see.
       As you should read, the first thing it says is FADE IN; but we also have to know what to fade-in TO. All we have to do to find out the answer to this question is to look at the picture to the right, and we see that it is a night sky. It also describes what we see in the text to the left. Before we get to the actual fade-in, however, we must draw and create the scene.
       In the following steps, I assume that you have already drawn your scene, and so will not go through steps of how to create the shining stars. If you need to know how to do this, you should click the following link to last week's posting (LINK—week 6) We'll start by arranging the layers in their proper order.
   
   
   
   1. Layer Stacking Order: what you see above is the final result. In order to get there we must first put all the necessary symbols on the stage in their correct layer. Then we must put the layers in their correct order so that the correct one is on top of the others.
      
      1. Name the first layer stars.
         
      2. Open the library (F11), and drag the star movie-clips into this first layer.
         
      3. Once you have placed enough stars on the stage to your liking, lock, the first layer and add a new layer.
         
      4. Name the second layer title.
         
      5. Drag the title symbol into the second layer.
         
      6. Lock the title layer.
         
      7. Add a new layer and name it fade.
         
      8. Choose the rectangle tool (R) and draw a black rectangle that covers over the entire stage.
         
      9. Choose the selection tool (V) and select the black rectangle by double-clicking on it.
         
      10. Convert to Symbol (F8), name it fade, and choose graphic for type. The image shows the way your layers should now look.
       
      
   2. Fade-In: what you see here are the way the layers should be stacked and how that should make the stage look. Now we must start the animation.
      
      1. Click in frame 20 of the fade layer and add a keyframe.
         
      2. In frame 20, Select the rectangle on the stage by clicking one time on it.
         
      3. Open the properties bar and change the alpha to 0%.
         
      4. Right-click between frames 1 and 20 select create motion tween. This creates the fade in.
         
      5. Now, click in frame 20 of the title layer and extend the duration (F5). Repeat this step for the stars layer also.
       
      
   3. Fade-Out: Now that we have the Fade-In portion of the animation, let's set up the Fade-Out part.
      
      1. Next, click in frame 70 of the fade layer and add a keyframe (F6) to begin the fade-out sequence.
         
      2. Then, click in frame 80 of the fade layer and add a keyframe (F6).
         
      3. In frame 80, select the rectangle on the stage by clicking one time on it.
         
      4. Again, open the properties bar and this time change the alpha to 100%.
         
      5. Right-click between frames 70 and 80 select create motion tween. This creates the fade out.
         
      6. As before, extend the duration (F5) of the other two layers.
         
      7. Lock the fade layer.
         Below you will see an image of how your timeline should look. Notice there are only two motion tweens so far, one at the beginning and one at the very end:
         
      
       
      
   4. Title Fade-In/Fade-Out: At this point, we have the opening and closing of this very first scene: the fade-in/fade-out sequence; however, we do not have the title fading in yet. If you read FRAME 2 of the storyboard, you will see that the title fades-in over the stars, and then fades away again. This is our next step.
      
      1. Since the title doesn't begin to fade-in until after the stars and sky have already faded-in, we won't begin the title fade-in until frame 20. That will be where the fade-in begins. Therefore, since the motion tween begins there, click in frame 20 of the title layer and add a keyframe (F6) to begin the fade-in sequence of the title.
         
      2. So let's think about this: since the title doesn't even begin to fade-in until frame 20, it does not even need to be there at all until then. As it is, however, it is already inframe 1. We do not need it there. Therefore, click in frame 1 of the title layer and delete the title from that frame.
         
      3. Good, now the title doesn't even arrive into the animation until frame 1; however, at this point it should not be visible. It should only gradually become visible starting here, in frame 20. That means that in this frame, frame 20, we must changle the opacity of the title. To do this, choose the selection tool (V) and select the title on the stage.
         
      4. Next, open the properties bar and change the alpha to 0% to make the title invisible.
         
      5. After about 20 more frames, the title should be fully visible, so click in frame 20 and add a keyframe (F6).
         
      6. By this frame, frame 40, the frame should be fully visible; however, as you can see, it is still invisible. Therefore, with the selection tool (V), click on the little circle in the middle of the invisible title symbol on the stage to select the title.
         
      7. Then, open the properties bar and change the alpha to 100%.
         
      8. Right-click in between the two keyframes in the title layer, between frames 20 and 40, and choose add a motion tween. This will complete the fade-in of the title. Next then is the fade-out portion.
         
      9. We must allow some time for the viewer to read the title and let it sink in, about 20 more frames. Only after that point in the timeline does the timeline begin to fade away again. That means that the fade-out begins in frame 60 of the timeline— click in that frame in the timeline and add a keyframe (F6).
         
      10. The fade-out of the title will go a little faster than the fade-in, so it will take fewer frames, only about 10. So, click in frame 70 of the title layer and add another keyframe (F6).
          
      11. By this time, however, the title will have completely disappeared again, which means we must reduce its opacity. Using the selection tool (V) click on the title on the stage in frame 70 to select it. Then open the propterties bar and reduce the alpha to 0%.
          
      12. Finally, in the title layer in the timeline, right-click between those two keyframes, frame 60 and frame 70 and select add a motion tween. This should conclude the fading-out of the title.
          
          Below you will see the timeline as it appears at the end of these steps:
          
      
      
   
    
   
5. CHARACTER SYMBOLS:
   
   1. Graphic Symbols—making the entire drawing one single symbol:
      
      
      1. After you have drawn your character, select the entire drawing (if there is nothing else on the stage, click in frame 1 of the layer to this).
         
      2. Click on F8 to Convert to Symbol.
         
      3. Give it a unique name (name it dog), select graphic for behavior, and then click okay.
       
   2. Complex Symbols—creating nested symbols: symbols within symbols
      1. Sometimes it is necessary to create complex symbols. In the following situation, we will make the head and the body into two separate symbols. First, we must break up the symbol that we have already created. To do this, select the dog symbol by clicking on it one time.
         
      2. Next, break the symbol apart by selecting ctrl-B. At this point, the drawing of the dog on the stage is no longer a symbol instance; however, if you look into the library, you will see that you still have the symbol there.
         
      3. Now, select only the head of the dog. To do this you must use the arrow tool, and zoom up very close. Make certain you get all of the pieces of the dog’s head in the selection. It is very important that you do not leave any piece of the head out of your selection.
         
      4. Next, once you select the head, choose the arrow tool (V) and move the head away from the body.
         
      5. If you find that there are pieces of the head left out, little fragments of lines or color, then undo until the head goes back into place, and try selecting again.
         
      6. Once you select the head and move it away from the rest of the dog’s body, then convert it into a symbol (F8).
         
      7. Give it the name dogHead, select graphic for behavior, and then click okay.
         
      8. Now, look at the dog’s body. You should notice that there are little gaps in the body where the head used to be. Fill in these gaps and round them out.
         
      9. Once done, select the dog’s body with the arrow tool (V), and convert it to symbol (F8)
         
      10. Give it the name dogBody, select graphic for behavior, and then click okay.
          
      11. Now that you have two graphic symbols, you may try to put them back into place. You will find that the head is below the body. To correct this, select the head by clicking on it one time.
          
      12. Next, go to Modify >> Arrange >> Bring to Front. This will put it above the body.
          
      13. Convert all the other of the dog's parts into symbols also, both the rear legs, both the front legs, and the shadow. If there is a tail, do the same thing for the tail. They should all be selected indepently and converted into separate graphic symbols.
          
      14. Once the dog is reassembled and looks like it did originally, we will put it together into a single symbol. As it is now, it is composed of two parts: the head and the body; but we want to envelope these two parts together in a single symbol. To start, we must select both symbol instances, the head and the body.
          
      15. They must both be selected in order for this to work, so make certain you see blue boxes around them both. If so, then click on F8, convert to symbol.
          
      16. Give this new symbol the name of dog_mc, select Movie Clip for behavior, and then click okay.
          
      
       
      
   3. Animated Symbols—creating symbols that move
      
      1. The reason we are doing this is because we are going to make the head move back-and-forth as the script calls for. The graphic symbol is usually a static symbol, meaning there is no movement within it. The movie-clip symbol, on the other hand, is a dynamic symbol. It often is a symbol that contains animation. In order to make our new movie-clip into an animated symbol, we must therefore put animation inside of it. To do this we must go into the symbol (into symbol-edit mode). As we have learned, to go into symbol edit mode we must double click on the symbol or symbol instace. So, using the arrow tool (V), double-click on the dog_mc symbol. Once you do this, look in the upper-left-hand corner of the window and you will see scene 1, dog_mc. This tells us we are inside the dogMC movie-clip, in symbol-edit mode for the dog_mc symbol.
         
      2. Since we are going to animate the head to make it move back and forth, we must put the head into its own layer. To do this we must cut and paste the head from one layer into another. To start this, name the first layer, body.
         
      3. Next, using the arrow tool (V), select the head by clicking on it one time. You will know that you have selected the head because only it will have the blue box around it.
         
      4. Now, to cut, select Ctrl-X. The head will disappear. In reality, however, what happens when you cut an object is that it is first copied to a location in the computer’s memory known as the clipboard. This also happens when you copy (ctrl-c) a selected object. When you cut, not only is the selected object copied to the clipboard, but it is also deleted from view on the stage.
         
      5. Next, create a new layer and make sure that it is above the first layer. You should name the new layer head.
         
      6. Finally, we must put the dogHead symbol instance into the new head layer, but we want to make certain it is in exactly the same spot it was before. To do this, first click in frame one of the head layer. Then select ctrl-shift-V (paste-in-place). This not only pastes the head, but puts it in exactly the same spot it was before in the previous layer.
         
      7. Now you have two layers, one with the head and the other with the body. To make certain everything is in the right place, hide one layer at a time. If you hide the body layer the body of the dog should disappear from the stage. If you hide the head layer, the head should disappear from the stage.
         
      8. Lock the body layer.
         
      9. Choose the zoom tool (Z) and zoom into the head.
         
      10. Choose the free-transform tool (Q) and select the head.
          
      11. You should notice the little white circle in the center. This is the center-point of the head symbol. Click and drag it straight down to the top of the nose. This is the point around which the head will rotate when we make the head move back-and-forth.
          
      12. Now rotate the head a little to the left.
          
      13. Next, click in frame eight (8) of the head layer and add a keyframe (F6)—don’t be alarmed if the body disappears.
          
      14. Then, click back in frame four (4) of the head layer and add another keyframe (F6).
          
      15. Make sure that you’re still in frame four (4) by checking to see if the red playhead in the timeline is over frame four. Once you are in frame four, choose the free-transform tool (Q) again.
          
      16. If the center-point is not still above the top of the nose move it there again, and then rotate the head to the right.
          
      17. Finally, add motion-tweens between frames 1 and 4, and between frames 4 and 8.
          
      18. Hit enter to see the head move back and forth once.
          
      19. You should notice that the body disappears but the head remains. That is because there is only one frame in the body layer. When the playhead moves past frame one, then the body disappears. Therefore, we just need to extend the duration of the body out to frame eight (8). To do that, you just click in frame 8 of the body layer and hit F5 to extend the sprite (aka extend the duration).
          
      20. Next, click back on scene one in the upper-lefthand corner to exit symbol-edit mode.
          
      21. And lastly, select ctrl-enter to view the animated movie-clip looping.