Introduction to Animation: Fall 09 week 1:—9/15/09: Tue, 12:25

Hi Everyone, I hope you're all as excited as I always am at the beginning of a new term. I can't wait to see what you all can do. It may be difficult the first couple of weeks, but if you keep trying, keep putting in time, I'm certain that you'll be happy with the results. Like I always say to students, and to myself when things seem to be getting difficult and demanding, instead of drawing pictures and making cute drawings move around, you could be doing Trigonometry problems or writing a paper in English composition. I don't know about you, but making cartoon characters move seems more fun to me. So, this is my blog for the Introduction to Animation class. I will put up a new posting each week, and it will include information about the class, the homework that will be due in the next class meeting, and, most importantly, step-by-step instructions of anything that we do during class. In addition, I will occasionally provide tutorials for things we do not have time or are otherwise unable to cover during the limited time we have in the classroom. Anytime you have questions, there are several ways to get answers:

First, you can see to the right and a little lower down that there is a place for you to chat with me. If I am online, it will say so and you can send a question. If I am working on the computer, I tend to be logged in, so you will frequently see that I answer you right away.
Second, down at the bottom of each posting you will find a link that will allow you to respond to my posting. This is a particularly good way to ask questions as everyone in class can see what you ask and then how I respond. Chances are that if you have a question or a problem that you are not alone and others have the same issues.
Third, you can send me an email (carterdjohnson@aim.com) with your question or request. Like the chat, if I am online (and I very often am), I will respond within an hour or two, unless it is very late at night. On weekends also I tend to be a bit slower in response time.
And lastly, if you can wait for an answer, you can come to the next class and ask me directly.

For this class, I do not assume that you have much knowledge or experience with Flash. I do assume that all of you have at least been introduced to the application. For those of you who had my drawing class, you perhaps have an advantage in the beginning over those who did not; however, everyone should be on an equal playing field when we really begin animating in earnest in week 3. Our first task is to learn the interface, all the tools and options. That is what the first class is about. The main way to do this is to familiarize yourself by playing around with the program for a couple hours over the course of the next week. None of you will be masters after the first class, so you'll have to spend some time trying to figure out how to do things. Ask questions if you cannot figure something out BEFORE our next class. So, without going on any longer, I wish you all good luck for the term. I always look forward to this class. It is quite a bit of work, but making things move around can be quite a lot of fun. If you put the time and effort into it, you can produce things that ALL your classmates will envy. Think of it this way, drawing cartoons is a hell of a lot more fun than studying calculus or economics (no offense intended to any mathematicians or economists out there)! Carter-

TOPICS:
1. LINK Object Transformations;
2. LINK Creating Groups;
3. LINK Arranging Groups
4. LINK Importing Graphics;
5. LINK Tracing Graphics;
HOMEWORK:
This is due next week at the beginning of our next class class.
1. LINK <-- Download and trace the image at the link as mentioned in class and bring it next week for our WEEK 2 class for extra credit. It will be due at the beginning of the following class, week 3, for credit. You should complete the tracing and try to color it in as the image is, gray where it needs to be, and white where indicated.
  1. Once you click on the link, an image will appear in a browser window.
  2. To save this image and download it onto your computer, simply right-click on the image and choose SAVE IMAGE AS or SAVE FILE from the menu.
  3. Then, so that you may located it easily, it is often best to save it onto the DESKTOP of your computer. Therefore, at the top of the Save As.. window, make sure that you choose the desktop in the Save In window. LINK For instructions as to how to complete this assignment, review this week's in-class tutorial at the bottom of this posting.

FLASH/PRACTICE/LABS:

LINK <-- click here to download the trial versionof Flash Professional CS4. It will last you for the first 30-days, which should be enough time to figure out a way to get it for the remaining part of the semester.
You absolutely MUST have access to a computer and to Flash outside of class. I do not require that you have a computer yourself, but you must find a computer you can use to do your homework. There is significant homework EVERY WEEK, especially the weeks leading up to the midterm and the final projects.
There are laboratories every weekday on the 2nd floor from 3:30 - 6:00pm (sometimes from 12 - 6), and on Saturdays from 10am - 4pm.
The library, located on the 4th floor, has Flash, and it's hours are 9am - 9:30pm weekdays, and on Saturdays from 10am - 4pm. YOU WILL NOT PASS THIS CLASS IF YOU DO NOT MAKE A COMMITMENT TO DO WORK EVERY SINGLE WEEK FROM NOW UNTIL THE END OF THE TERM.

INTRODUCE:

Object Transformations:

Free-Transform Tool (Q)—once you draw an object you may modify and transform it in various ways:
1. Rotation:
  1. choose the Arrow Tool (V) to select the object or objects you wish to modify;
  2. select the object by clicking on it one (1) time;;
  3. choose the Free Transform Tool (Q);
  4. next, place the pointer near one of the little black boxes in the corners until the pointer turns into a curved arrow pointing in a circular direction;
  5. click, hold down, and drag in one direction or another to rotate your object.
2. Height:
  1. choose the Arrow Tool (V) to select the object or objects you wish to modify;
  2. choose the Free-Transform Tool (Q) ;
  3. using the mouse, place the pointer over the middle black box on top or on bottom;
  4. click, hold down, and drag to increase or decrease the height of the object;
3. Width:
  1. choose the Arrow Tool (V) to select the object or objects you wish to modify;
  2. choose the Free-Transform Tool (Q) ;
  3. using the mouse, place the pointer over the middle black box on the right or on the left side;
  4. click, hold down, and drag to increase or decrease the width of the object;
4. Height & Width:
  1. choose the Arrow Tool (V) to select the object or objects you wish to modify;
  2. choose the Free-Transform Tool (Q) ;
  3. using the mouse, place the pointer over one of the little black boxes in the corners;
  4. click, hold down, and drag in any direction to increase or decrease the width AND height of the object;
5. Proportional: same as number 4 above, but hold down on the shift key as you are dragging the corner box to maintain the object’s proportions.
6. Skew:
  1. choose the Arrow Tool (V) to select the object or objects you wish to modify;
  2. choose the Free-Transform Tool (Q) ;
  3. using the mouse, place the pointer between any of the little black boxes until the pointer turns into two little arrowspointing in opposite directions;
  4. click, hold down, and drag in any direction to skew the angle of the object;
Modify Menu—choose the Modify Menu to make various transformations (others will be discussed at another time):
1. upside-down: Modify >> Transform >> flip vertical
2. mirrored: Modify >> Transform >> flip horizontal
3. scale & rotation: Modify >> Transform >> scale & rotate

Groups—to group objects allows you to treat multiple objects, or multiple parts, as a single object. This simplifies your objects in several ways: it allows you to move around a complicated drawing (such as a face) with multiple parts (eyes, nose, mouth, etc.) on the stage without having to select each individual part beforehand; it allows you to modify such a complicated drawing with all of its parts together (to make it larger for example, or smaller).
1. Creating a Group:
  1. draw an object, an oval for example;
  2. select the object by double-clicking on it with the arrow tool (V);
  3. then select CTRL-G on your keyboard. This converts the ungrouped oval into a group.
2. Selecting a Group—When selecting a group you must only click on it one time no matter how many pieces or objects it contains whether it consists of multiple strokes or fills or not. When selected it will have a blue box around it.
3. Arranging Groups—When you have multiple groups, drawn and created, you may arrange the stacking order of them, putting one above the other or one below another. In the graphic (right) there are two groups, one star and the other a flower.
  1. Select the star with the selection tool by clicking on it once, then;
  2. rearrange the groups: Modify >> Arrange >> bring to front
Importing Images and Graphics—If you are going trace over an image, you must first prepare your stage for doing so. The following steps will make it easier to trace and view your drawing as distinct from the image that you are looking at.
1. Prepare your stage: Name the 1st layer 'Image' and then lock it.
2. Add a new 2nd layer, name it Trace, and then lock it also.
3. Finally, add a new 3rd layer, name it Drawing, and then lock this one as well. The layers should be in this order: top: DRAWING, middle: TRACE, and bottom: IMAGE
4. Next, unlock the Image layer again and select frame one in this layer.
5. Go to the File menu above and select the following: File >> Import >> Import to Stage.
6. The Import dialogue box pops up, so you should select the image that you wish to import onto the Flash Stage. Once you do so, double-click on it to bring it to the stage.
7. Then, lock the Image layer and unlock the Trace layer and draw a rectangle. This rectangle should have a black stroke and a white fill.
8. Open the Color Mixer Panel from the Window Menu. Select the fill color and change the alpha to 50%.
9. Use the Paint Bucket Tool (K) and fill up the rectangle with the new fill color. This will make the white somewhat transparent.
10. Once again, lock the Trace layer and unlock the Drawing layer.
11. Select the LINE TOOL (N).
12. Set your Stroke color temporarily to black that will contrast with the trace rectangle that you drew. that you are going to trace over.
13. You will be using the line tool to straight draw line segments, but take care not make them too long. Once you draw one segment, switch to the SELECTION TOOL (V). This will allow you to change the straight line drawn with the line tool to a curved line segment.
14. For nice clean lines, switch frequently back-and-forth from the LINE TOOL to the SELECTION TOOL.