Create your Player in Flash
● Learn the basics of Frame by Frame animation.
✓ Onion Skin ✓ Keyframes ✓ Brush Tool
• This tutorial is part of the Run and Jump Platform Game Project.
• It is first in a series:
Other People's Work:
Here are some examples of work inspired by this tutorial.
Step #1: Open a New Blank Document in Flash ~
✗ Open a New Blank Document in Flash:
Step #2: Brush Tool ~
✗ Get the Brush Tool or hit the keyboard shortcut letter (B) …
✗ … and lower the Brush size - Start very small ~
Step #3: Smoothing ~
✗ Open Properties (If you don't see Properties, hit the keyboard shortcut Cmd(⌘)+F3 or go to: Window > Properties) and raise the Smoothing level.
Note: The higher the smoothing number, the better your drawing will look.
✗ TRY IT!
Step #4: Draw with the Brush ~
✗ Draw a head on the stage. Fill it with color if you wish.
✗ Draw a body and arms & legs too.
Step #5: Adjusting the Lines and Fill ~
✗ You can reshape lines using the Selection Tool.
✗ Just grab the edges and drag!
✗ Adjusting lines is one of the great benefits of Vector Graphic in Flash.
✗ Get the Paint Bucket Tool or hit the keyboard shortcut letter: (k) …
✗ … picking a Fill Color from the color palette, …
✗ … selecting Close Large Gaps under Gap Size at the bottom of your Tools palette …
✗ … and fill in your head.
Step #6: Create a Movie Clip ~
✗ Select everything by hitting the keyboard shortcut: Cmd(⌘)+A and hit F8 (or Right-Click and select: ) …
✗ … and make sure to set the Registration point to bottom center.
Step #7: Open the Movie Clip ~
✗ Double-click on the symbol with the Selection Tool to open it …
Now you are working INSIDE the Movie Clip.
✗ Remember: A Movie Clip is a movie WITHIN a movie.
Step #8: Add a Keyframe ~
✗ Hit F6 (or Right-Click and select: ).
Step #9: Onion Skin ~
✗ Click on the Onion Skin button. This allows you to see the outline of the all the frames.
Step #10: Making your Movie Clip walk ~
✗ Get the Eraser Tool or hit the keyboard shortcut letter (e) …
✗ … and erase the leg.
Step #11: Redraw the Leg ~
✗ Draw a new leg a little farther beyond the old one …
✗ … and do the back leg too.
Step #12: Don't Forget the Arms ~
✗ Erase the arms and move them too …
Step #13: Repeat the Process ~
✗ Hit F6 AGAIN(or Right-Click and select: ) so you now have 3 Frames …
✗ … and erase the both legs and draw them again a little further out.
✗ Don't forget the arms …
Step #14: Now make the Legs go Backwards ~
✗ Hit F6 a third time and begin to draw the legs going back the other way …
✗ Do the same to the Arms …
Step #15: Again with the Backwards ~
✗ Hit F6 a forth time and move the legs back again.
✗ Do this as many times as necessary …
✗ .. and hit the keyboard shortcut: Cmd(⌘)+Enter to view your work!
Last Step: Save your Work ~
✗ Save your work as - FIRST_NAME_LAST_NAME_PROJECT_NAME.fla]
• ALWAYS save your projects using the following naming convention:
• DO NOT name your project any other way - Improperly named projects will not receive credit and you will be sad.
• NEVER leave your work on the desktop or depend on a flash drive - instead, save your work in a folder you can find later - preferably on a virtual drive where it can be backed up.
If your Ready, move on to: 82_game_background_Fl.htm