Basics

 I’m using Macromedia Flash Professional 8 with Windows XP

Good Idea:  Before creating a new document have a concept of the project. For large animations do a Storyboard first. It is not easy to make document adjustments once into the project. The most important consideration is what size the document will be.

Save Often: Flash doesn’t have a history feature like Photoshop where the history of a project is saved with it. The history in Flash is deleted when the project is saved. In Flash retrieving an early time period of a project is done with a saved version.

Testing: Always test the finished project live before distributing (Web browser, cell phone, CD, etc) Choose people you know as testers to view your animation for feedback.

     Window Size: Screen 800 by 600 equals 550 by 400

Start Page

• Open a Recent Item (List last 8 files opened)
• Create New
• Create from Template
• Extend. Macromedia Flash Exchange is an online site for additional plug-ins and Exchange where helpful downloads are available (buy and free downloads)

  

Open a New document:

• Start Page (Welcome Page) Click Create New>Flash Document. If the Start Page is not opened: Edit > Preferences > General > On launch >Show Start Page
• Click File>New>Flash Document

Flash Document:

• Menu Bar
• Open document tab
• Move grippers
• Tools panel. (If not opened: Window>Tools)
• Timeline panel: (If not opened: Window>Timeline)
• Work area: Gray area. (also referred to as off stage or backstage)
• Stage: White area
• Panel docking area arrows
• Properties. (If not opened: Window>Properties)

MENU BAR: List all the ways you can interact with a Flash file.

OPEN DOCUMENT TAB: Each opened document has its own tab. Documents are shown vertically across the Timeline panel.  The document window buttons are the standard; collapse, expand, close. Items can be copied from one document to another.

MOVE GRIPPERS: Each panel has move grippers. Place mouse over the grippers, hold/drag panel to a new docking location or leave panel on Work area as a floating panel. If working with more than one monitor, floating panels can be moved to another monitor.

TIME LINE: This is where the data goes that makes up the animation. (Window>Timeline, This panel should be checked to open as default)

TOOLS Panel: These are the tools for creating the animation. (Window>Tools, This panel should be checked to open as default)

WORK AREA: The surrounding gray area is off stage or backstage. Anything in the gray area is not seen by your audience when the animation is played.

STAGE: This is where all the animation action takes place. It relates to where actors are seen and perform.

PANEL DOCKING AREA ARROWS: These arrows expand and collapse the area where panels are docked (Docking means to make a panel stationary not floating)

PROPERTIES: Properties contain the document settings, tool drawing options and much more. (Window>Properties, This panel should be docked below Work area as default)

     View Area Size. To change the view size between the Work Area and the Timeline panel, hold mouse over the area between these sections. The mouse cursor will change. Hold/drag up or down to change the width of either area.

Stage/Document

The Stage area has different viewing size options in relation to the Work area.

  

Properties is where changes are made to the Stage and Document. The document properties can also be changed in Modify>Document Ctrl+J

Document Setting:

Should be set at beginning of the project. It is harder to set afterwards. A good size to start with is 550 x 400 pixels with a Frame rate of 12 fps (FramesPerSecond). The smaller the file size the faster the file loads.

• To embed metadata within your SWF files, improving the ability of web-based search engines to return meaningful search results for Flash content, do the following:
• Enter a descriptive title in the Title text box.
• Enter a description in the Description text box.     

·        Metadata is defined as data providing information about one or more aspects of the data, such as:

o       Means of creation of the data

o       Purpose of the data

o       Time and date of creation

o       Creator or author of data

o       Location on a computer network where the data was created

o       Standards used

o       The song title of a piece of music

Panels

Panels are located in Window>

• Click Window> and select desired panel
• Panels have their own menu options and Help
• Panels can float or be docked.
• Panels can be grouped with other panels or not.
• The black triangle next to the panel name expands or collapses the panel.

Properties Panel

The Properties panel interacts with almost everything done in Flash. Each element, documents, objects, tools, button, etc have their own properties. This panel is used constantly while creating the animation and is often left opened. The Properties panel should remain docked.

• Click on an item to view its properties.
• Click on the Work area to view the document’s properties.
• Locked layers will not show its Properties. Unlock to view the Properties

Tools Panel

The tool’s description and shortcut key is revealed by holding the mouse cursor over the tool icon.

Icons with black arrows expand for more options.

Tools panel has four sections:

• Tools
• View
• Colors
• Options

Timeline    

The Timeline determines what order the frames appear in the animation and how long each frame stays onstage.  

Scene: There can be more than one scene in the Timeline

Symbols have their own Timeline

Buttons have their own Timeline

Timeline Panel

• Timeline button
• Frame #
• Edit Scene Icon
• Edit Symbol Icon
• Menu
• Layers
• Frame #
• Playhead
• Current Frame
• Elapsed Time
• Frame Rate

TIMELINE BUTTON: Expands and collapses Timeline panel.

FRAME #: Shown in divisions of 5.

EDIT SCENE

EDIT SYMBOL

MENU: Options to change how frames are viewed

LAYERS

PLAYHEAD: Moves across frames to show action

LAYER FRAMES. Each layer creates its own unique frames.

CURRENT FRAME: Shows frame number when frame is selected or Playhead is over.

FRAME RATE; Frames per second

ELAPSED TIME: Time elapsed in each frame by seconds

Layers

Layers are where elements are placed to use in the animation. Each element has its own layer and frames to animate in.

SHOW/HIDE ALL LAYERS: Click the Eye icon to affect all layers. Click the circle on the layer to show/hide just that layer.

LOCK/UNLOCK ALL LAYERS: Click the Lock icon to affect all layers. Click the circle on the layer to lock/unlock just that layer.

SHOW ALL LAYERS AS OUTLINES: Click the Outline icon to affect all layers. Click the colored square on the layer to show outline for just that layer.

LAYER NAME: Double click to select and change name. Named layers are easier to work with.

ACTIVE INDICATOR: When the Pencil icon has a red line through it that indicates the layer can not be altered.

DELETE LAYER: Click to delete selected layer or right click in layer for options

INSERT LAYER FOLDER: Adds a new folder above selected layer

ADD MOTION GUIDE: Adds a motion guide above selected layer

INSERT LAYER: Adds a new layer above selected layer

Moving Layers:

Layers are moved up or down by clicking the layer then hold/drag it up or down. Layers are stacked from bottom to top like pieces of paper. Top layer covers lower layers.

Frames

Frames are like a film strip. You can place graphics, sound, video, etc into a Frame. The greater the number of Frames the longer the animation is. A rectangle inside a frame means it is a Frame.

Keyframes

• Keyframes define a stop place in a series of Frames. A circle inside a frame means it is a Keyframe.

Right click on a Frame to view the menu that shows what you can do with that Frame.

Open a new document

Properties are 550 x 400 with 12fps

Layer 1

• Name layer: ‘Stage’
• Lock layer

Layer 2

• Click Insert Layer
• Name layer: ‘Frames’
• Right click frame 30
• Select Insert Frame

Frames 1 to 30 are white. This is one frame span. The gray frame outlines are replaced

 

Selecting a group of frames. (Selected frames turn black)

• Click frame 30.
• Hold down the shift key and click frame 40 to select.
• Right click inside selected area
• Select Insert Frames

Frame span is now from frame 1 to 40

• Click frame 21.
• Hold down the shift key and click frame 40 to select.
• Right click inside selected area
• Select Remove Frames. Frames turn back to gray outlines.

Frame span is now from frame 1 to 20

Adding a Keyframe

• Right click frame 10
• Select Insert Keyframe

Keyframe circle symbol appears in frame 10 and the Frame rectangle symbol appears in frame 9. There are now two frame spans.

• Right click frame 9
• Select Insert Keyframe

Frame 9 and 10 are Keyframes and frame 8 is a Frame. There are three frame spans

• Right click frame 9
• Select Clear Keyframe

Frame 10 is a Keyframe and frame 9 is a Frame. There are two frame spans

Move Frames to increase frame span.

• Click and hold frame 20. Frame turns gray.
• Drag gray Frame to frame 30 and release.

The area between frame 1 and 30 is white. Frame 30 has changed to a Keyframe

• Click frame 30 to select
• Click and hold to turn Keyframe gray
• Drag gray Keyframe to frame 25 and release

Frame 25 is a Keyframe. Frame 30 is a Frame. There are three frame spans

• Click frame 25 to select
• Click and hold to turn Keyframe gray
• Drag gray Keyframe to frame 40 and release

Frame 40 is a Keyframe. There are two frame spans

• Click frame 39 (the Frame) to select
• Click and hold to turn Frame gray
• Drag gray Frame to frame 30 and release

Frame 40 and frame 30 are Keyframes. There are three frame spans.

• Click frame 29 (the frame) to select
• Click and hold to turn Frame gray
• Drag gray Frame to frame 50 and release

Frame 50 is a Keyframe. Frame 40 remains a Keyframe. There are four frame spans

• Right click frame 50
• Select Clear Keyframe. Frame 50 is now a Frame

• Click frame 39 (the Frame) to select
• Click and hold to turn Frame gray
• Drag gray Frame to frame 60 and release

Frame 50 is removed. Frame 60 is a Keyframe. There are four frame spans

Converting groups of frames to Keyframes

• Click frame 60 to select
• Hold shift and click frame 40. Frames 40 to 60 are selected
• Right click inside selected area
• Select Covert to Keyframes.

Frames 40 to 50 are Keyframes

 

“Never discourage anyone who continually makes progress, no matter how slow.”

Plato