Flash Essentials - PNCA Continuing Education Lab 1 - Using the Drawing Tools & Making a Ball Bounce
|
Using the Drawing Tools to Create Symbols
1. Create a new document by choosing Flash File (ActionScript 3.0) from the start menu.
2. Click on the following tools in the Tools panel and practice making the following shapes: Ovals, Circles, Squares, Rounded Rectangles, Polygons, Stars.
3.With the Rectangle or Oval tool selected, hit the Option key on the keyboard at the same time as you click anywhere on the Stage. This brings up a Settings window. The corner radius on the Rectangle Settings allows you to specify how rounded you would like the corners to be. A value of zero yields sharp corners.
4. Fill is the color that is inside an object, the stroke is the outline. These are separate objects unless you click Object Drawing mode at the bottom of the Tools panel. This mode allows you to create objects with fills and strokes that are grouped.
5. The Pencil tool has three options: Straighten, Smooth and Ink. Click the box at the bottom of the Tools panel to change it. Practice using all of these, and use the Property Inspector to change the look of the lines.
6. The Brush tool is similar to the Pencil tool except that the Pencil tool creates outlines while the Brush tool creates shapes with their own outlines and fills.
7. Use the Selection tool to create a bounding box around objects to select them. If you drew your object without Object Drawing mode activated, you will be able to edit certain sections of the object by selecting just that selection.
8. Use the Sub-selection tool, the white arrow, to modify points on your object. You can click and drag individual points to adjust them. Curved areas will have points with Bezier handles, you can pull these handles to adjust the look of the curve.
9. The Pen tool is useful for creating precise shapes and curves. Click and drop points at several locations, Flash will fill in with a line between them. You can click and hold a point to make it a curved line.
10. The Text tool allows you to draw a bounding box with text inside. You can change the look of the text much like you do with any word processor.
Making a Ball Bounce
1. Create a new document by choosing Flash File (ActionScript 3.0) from the start menu.
2. In the Property Inspector, click on the Size and the Document Properties window appears. Change the background color. Notice that this is where you can change the dimension, frame rate, and ruler units of your file.
3. Click OK and return to your blank document.
4. Click the Oval tool by holding down on the Rectangle Tool in the Tools Panel and selecting the Oval.
5. Click the Object Drawing button at the bottom of the Tools Panel.
6. Click a point at the top left of the Stage and create an oval. You will notice that in frame 1, a black dot appears. This is a keyframe.
7. Click frame 10 in the Timeline.
8. Press F6 on the keyboard to create a keyframe in frame 10. You will see another dark circle appear.
9. Click frame 20 in the Timeline.
10. Press F6 on the keyboard to create a keyframe in frame 20.
11. Click frame 10 in the Timeline. Click the Selection tool (button with black arrow in the Tools panel).
12. Using the Selection tool, click the circle and drag it to the lower-middle portion of the Stage.
13. Click frame 20 and position the ball at the top right of the Stage.
14. At this point, you can play your animation. With the playhead at frame 1, hit the Return or Enter key. You should see the ball bounce, but the movement is jerky, not smooth. Let's fix that.
15. Click on frame 1, then hit ctrl-click (a shortcut you will use often) and choose "Create Motion Tween" from the menu. You should see an arrow appear in the Timeline between frames 1 and 10.
16. Click on frame 10, then hit ctrl-click and choose "Create Motion Tween" again. This should insert an a motion tween between frames 10 and 20.
17. Now press Enter to see your animation. If you press Command-Enter together, the animation will pop up in its own preview window and it will loop endlessly. This window shows exactly what a user would see if he or she were viewing this as a .swf file on a site. Notice that only what is in the Stage area will show up.
|