ICT REVIEWER

Stage - is where all of your compositional elements, including as buttons, images, and movie clips, will
be arranged in Flash. The content inside the box in the center of the stage will be seen when the Flash
movie is created. 'Off-stage' refers to the portion of the gray background outside the central box. You
may pan the camera over a background by moving a background picture that is larger than the main
stage from off-stage onto the main stage area.

Timeline - As time moves through the movie, the frames indicated by the numbers across the bottom
take place. You may conduct edits by navigating to any frame in your animation. These may be found on
the Timeline's left side.

Properties - Depending on the tool you've chosen from the toolbar or the stage object you've chosen,
the Properties tab will differ. Each tool or item has particular features that may be changed in this tab.

Library - The library tab is going to be your best friend in Flash. Each Flash file's symbol objects are
stored there.

Drawings & Symbols - are Flash's two primary types. The vector editing tools in Flash, such as the Pencil,
Brush, Oval, and Rectangle, are used to make drawings. Using the selection and subselection tools as
well as any other vector editing tools, you can change the stroke and fill of drawings.

Symbols are a powerful feature of Flash in that you can draw an object once, save it in your library, and
use it over and over. Symbols can be created from a Drawing, collections of Drawings and other
Symbols, or external files (JPGs, PNGs for instance). Basically, symbols are like container for your
visual/auditory elements. Instead of having hundreds of graphics, text, and other elements laying on the
stage, you can create a symbol and use wherever you need it. If you want to change the appearance of
every instance of that object throughout your movie you can directly edit the Symbol in the library. You
can also break apart Symbols into their original objects to make derivatives of a Symbol.
Symbols: Movie Clips vs Graphic vs Button - here are three types of Symbols: a Movie Clip, a Graphic
symbol, or a Button symbol. These symbols can have actions applied to them to dynamically load,
disappear, trigger other events, and many other things (in actionscript). The fundamental distinction
between Movie Clips and Graphic are that the former has it own independent timeline whereas the
latter shares the same timeline with the stage’s timeline. Button symbols are simplified objects with
special frames for a mouseover appearance, and a click appearance.

Library Structure - Once you start to work on a flash project, most likely you will have a lots different
types of files(text, graphics, video, imported stock images), you want to have your library organized in a
way that files of the same type should be placed together and give your folder recognizable names so
when you need to find some elements you know where to look for it. It will save your time and hassle,
also it will make your work flow better. This is very critical if you are working in a team, because when
you pass the file you have worked on to other people; if the library is not well-structuralized; your co-
workers will have hard time to simply start it.

Flash Project Properties

These properties all have a significant impact on the movie and should only be adjusted at the beginning
of a project or a significant amount of work may be required to correct the issues that arise. FPS stands
for Frames Per Second and is the frame rate of your movie which determines the smoothness of your
animation. For fluid motion the frame rate should be left at 24-30 fps. If your animation doesn't have
much movement or doesn't require this level of quality, reducing the frame rate can significantly the file
size of your resulting movie. Note that while changing the frame rate does have an overall impact on the
speed at which your frames play, you should never use the frame rate as a means to adjust the speed of
your movie.

This property page also allows the adjustment of the size and color of the stage. The stage determines
the output size of the movie, while the size can be adjusted in the player, you achieve your best quality
setting your stage to the maximum size you expect for your final output.

Timeline & Frames

Keyframes are frames in the timeline that contain information (content or script). Keyframes without
content are denoted by an empty circle, keyframes with content have a filled circle. You can right-click
on the timeline for a specific layer and select 'Insert Blank Keyframe' to begin adding content (when you
create a new layer there is always a blank keyframe at frame 1). Click a blank or empty keyframe in the
timeline to add content to that frame. A keyframe only lasts for one frame (if your movie is 30 frames
per second a single keyframe is 1/30 of a second). To extend the length of a keyframe, right-click onto a
frame further down the timeline and select 'Insert Frame'. You can also select, drag, copy and paste
frames. Note that in order to perform any operation on a frame you must select it first.
WORKSPACE

To switch between workspaces:

1. Start Flash and choose File > New (ActionScript 3.0).

An empty Flash document opens.

2. Select a preset workspace (such as Designer) in the

workspace switcher at the top of the workspace.

The panels are rearranged

To create a custom workspace:

1. Start Flash and choose File > New (ActionScript 3.0).
An empty Flash document opens.

2. Make changes to an existing workspace, such as by opening new

panels or closing open panels.

3. Choose Window > Workspace > New Workspace (or choose

New Workspace in the workspace switcher).

The New Workspace dialog box opens).

4. Enter a name for the new workspace.

5. Click OK. The workspace is now available through the workspace switcher.

Timeline panel - is where you control the images and sounds in your Flash document (Figure 4). The
timeline is divided into frames. In the timeline, you work with these frames to organize and control the
content of your document. You place frames in the timeline in the order you want the objects in the
frames to appear in your finished content.

A keyframe indicates a change occurring in the timeline, for example a keyframe can indicate the
moment at which a graphic image appears or changes in the movie. A keyframe can also be a frame that
includes ActionScript code to control some aspect of your document. You can also add a blank keyframe
to the timeline as a placeholder for symbols you plan to add later or to explicitly leave the frame blank.

A property keyframe is a frame in which you define a change to an object’s properties for an animation.
Flash can tween, or automatically fill in, the property values between property keyframes to produce
fluid animations. Because property keyframes let you produce animation without drawing each
individual frame, they make creating animation easier. A series of frames containing tweened animation
is called a motion tween.

Current frame, frame rate, and elapsed time are all shown at the bottom of the Timeline panel. The
playhead, represented by a red rectangle with a long red line, shows the current frame you are viewing
on the timeline. You can click a frame to move the playhead to that frame, or you can drag the playhead
back and forth on the timeline to quickly view all or any part of your animation.

Layers in the Timeline panel provide a way to organize the elements of your movie. You can draw and
edit objects on one layer without affecting objects on another layer. Layers control the stacking order of
objects—the order moves from top to bottom, so objects displayed in front are in the top layer, while
objects displayed in back are in the bottom layer. This allows you to place objects in front of or behind
one another.

Edit bar - It is at the top of the Stage, lets you quickly navigate between different parts of your Flash
document. It lets you switch between scenes and symbols. You can also change the magnifiation level of
the Stage.
Panels - provide easy access to controls that help you work with the content in your document (Figure
6). By default, the Properties panel and the Library panel are docked to the right side of the workspace.
Any available panel can be opened by selecting it in the Window menu. By default, several panels are
collapsed to icons to make them easy to open while reducing clutter in the workspace. To open and
close these iconic panels

Tools Panel - let you draw, paint, select, and modify artwork, as well as change the view of the Stage
(Figure 7). The Options area at the bottom of the Tools panel lets you modify a tool you have selected. If
the Tools panel is not visible, you can display it by selecting Window > Tools. To select a tool, just click it.
(You can also use the shortcut key shown in parentheses in the tool tip that appears when you rest the
pointer over a tool for a few seconds.) Properties for the selected tool appear in the Properties panel.
Selection tools
Selection tool (black arrow): Click an object to select it. Drag a selected object to move it.

Subselection tool (white arrow): Select and move points of an object or edit paths between adjacent
points.

Free Transform tool: Resize or rotate selected objects by dragging.

Gradient Transform tool: Transform a gradient or bitmap fill by adjusting the size, direction, or center of
the fill.

3D Rotation tool: Rotate movie clip instances in 3D space. A 3D rotation control appears on top of
selected objects on the Stage. The X control is red, the Y control is green, and the Z control is blue.

3D Translation tool: Move movie clip instances in 3D space. When you select a movie clip with the tool,
its axes, X, Y, and Z, appear on the Stage on top of the object. The X axis is red, the Y axis is green, and
the Z axis is blue.

Lasso tool: Drag to select an area.

Drawing tools
Pen tool: Create straight or curved lines. You can also create Bezier curves.

Add Anchor Point tool: Add new anchor points to an existing path.

Delete Anchor Point tool: Delete anchor points from a path.

Convert Anchor Point tool: Convert the points on a path between corners to smooth points.

Text tool: Create or edit text and text fields.

Line tool: Draw straight lines.

Rectangle tool: Create rectangles or squares composed of fills and strokes, just fills, or just strokes. Also
has the PolyStar tool (create either polygon or star shapes—you can set how many points both shapes
have), the Oval tool (create circles and ovals), the Rectangle Primitive tool, and the Oval Primitive tool.
Primitive shapes are individual objects that can be edited in the Properties panel.

Pencil tool: Create lines in any of three modes—straighten, smooth, or ink.

Brush tool: Create shapes with fills only.

Spray Brush tool: The Spray Brush acts like a particle sprayer, letting you “brush” a pattern of shapes
onto the Stage at one time. By default, the Spray Brush emits a spray of dot particles using the currently
selected fill color. However, you can use the Spray Brush tool to apply a movie clip or graphic symbol as
a pattern.

Deco Drawing tool: Apply an effect to a selected object. Choose effects from the Properties panel
Bone tool: Inverse kinematics (IK) is a method for animating an object or set of objects in relation to
each other using an articulated structure of bones. This tool allows you to add bones to a set of objects
in relation to each other.

Bind tool: Inverse kinematics tool that allows you to click a control point or a bone with this Bind tool
and display the connections between the bones and control points. You can then change the
connections in a variety of ways.

Paint Bucket tool: Add fill inside a shape or change the fill color.

Ink Bottle tool: Change the color or width of a line, or add a stroke to a shape.

Eyedropper tool: Sample a color from swatches or anywhere on the screen.

Eraser tool: Erase parts of an image.

View tools
Hand tool: Drag the Stage to view another part of your document.

Zoom tool: Zoom in or out to view more or less of the Stage. To zoom out, hold down the Alt key
(Windows) or the Option key (Mac OS).

Properties Panel - provides easy access to the most commonly used attributes of the current selection,
either on the Stage or in the timeline. You can make changes to the object or document attributes in the
Properties panel without accessing the menus or other panels that also control these attributes
 File + Modify Text

New.. (Ctrl + N) Convert to Symbol (F8) Font

Open (Ctrl + O) Convert to Bitmap Size
Browse in Bridge Break Apart (Ctrl+8) Style
Open Recent Bitmap Align
Close Symbol Letter Spacing
Close All Shape
Save Smooth Contol
Save As Straighten
Save as Template Convert Lines to Fill Play (Enter)
Clear Expand Fill Rewind (Shift+,)
Duplicate Soften Fill Edges Go to End (shift+.)
Select All Combine Objects Test (Ctrl+Enter)
Revert Delete Envelope Test Movie
Import Union Test (Ctrl+Alt+Enter)
Export Intersect Play All Scenes
Exit Punch Mute Sounds (Ctrl+Alt+M)
Crop
Timeline Debug
Edit
Distribute to Layers (Ctrl+Shift+D) Debug
Undo (Ctrl + Z) Distribute to Keyframes (Ctrl+Shift+K) Debug Movie
Redo (Ctrl + Y) Layer Properties Remove All Breakpoints
Cut (Ctrl + X) Reverse Frames
Copy (Ctrl + C) Synchonize Symbols Window
Duplicate (Ctrl + D) Convert to Keyframes (F6)
Select all (Ctrl + A) Clear Keyframes (Shift+F6) Edit Bar
Deselect all (Ctrl + Shift + A) Convert to Blank Keyframes (F7) Timeline (Ctrl+Alt+T)
Timeline Transform Tools (Ctrl+F2)
Remove Frames (Shift + F5) Free Transform Properties (Ctrl+F3)
Cut Frames (Ctrl + Alt + X) Scale Library (Ctrl+L)
Copy Frames (Ctrl + Alt + C) Rotate and Skew Actions (F9)
Paste Frames (Ctrl + Alt + V) Scale and Rotate (Ctrl+Shift+S) Output (F2)
Select All Frames (Ctrl + Alt + A) Rotate 90° CW (Ctrl+Shift+9) Align (Ctrl+K)
Rotate 90° CCW (Ctrl+Shift+7) Color (Ctrl+Shift+F9)
Insert Flip Vertical Swatches (Ctrl+F9)
Flip Horizontal Transform (Ctrl+T)
New Symbol (Ctrl + F8) Arrange Components (Ctrl+F7)
Motion Tween Align History (Ctrl+F10)
Shape Tween Group (Ctrl+G) Scene (Shift+F2)
Classic Tween Ungroup (Ctrl+Shift+G) Extensions
Timeline Workspaces
Layer Hide Panels (F4)
Layer Folder
Frame (F5)
Keyframe (F6)
Blank Keyframe (F7)
Scene
 VISUAL GLOSSARY

ANIMATOR
You create and manipulate your documents and files using various elements, such as panels, bars,
and windows. Any arrangement of these elements is called a workspace. This various available
workspaces are:
• Essentials
• Animator
• Classic
• Debug
• Designer
• Developer

COLOR
Color Panel – modifies the color palette of a FLA and change the color of strokes and fills
Swatches Panel - import, export, delete, and modify the color palette for a FLA file

*FLA - Macromedia Flash Project File Format

TIME
Timeline - in Adobe Animate organizes and controls a document's content over time in layers and
frames. Like a movie film, Animate documents divide lengths of time into frames.

Frames - are at the core of any animation, dictating each segment of time and movement. The total
number of frames in your movie, and the speed at which they're played back, together determine your
movie's overall length.

Keyframe - is a frame in Adobe Animate where a new symbol instance appears in the Timeline.

FPS (Frames Per Second) - frame rate (the speed at which the animation in Adobe Animate is played)
is measured by the number of frames per second (FPS). (The standard rate for motion pictures is also
24 fps.)

Easing - is a technique for modifying the way that Adobe Animate calculates the property values in
between property keyframes in a tween

Layers - helps you organize the artwork in your Adobe Animate document. You can draw and edit
objects on one layer without affecting objects on another layer.

Mask layers - contain objects used as masks to hide selected portions of layers below them. Only the
portion of the mask layer not covered by the mask is visible.

Guide layers - display a guide icon to the left of the layer's name. Guide layers are not exported and do
not appear in a published SWF file.
 ELEMENTS

Symbol - is a graphic, button, or movie clip that you create once in the Animate authoring
environment or by using the SimpleButton (AS 3.0) and MovieClip classes.

Movie clips - have their own multiframe timeline that is independent from the main movie's Timeline.

Graphic symbol - is a collection of frames used in animations or single frame mode.

There are five looping modes: loop, play once, single frame, reverse play once, reverse loop. Looping
mode

• Loop: Plays the frames of the Graphic from ‘first frame’ to ‘last frame’ in sequence and keeps looping
until there are frames on the parent timeline’s frame span.
• Play Once: Plays the frames of the Graphic only once from ‘first frame’ to ‘last frame’. After that
instance stays at ‘last frame’ for the rest of the frames in the parent timeline’s frame span.
• Single Frame: Plays only one frame of Graphic that is pointed by the ‘first frame’ property.
• Reverse Play Once: Plays the frames of the Graphic only once in reverse order that is starting from ‘last
frame’ to ‘first frame’.
• Reverse Loop: Plays the frames of the Graphic in reverse order that is starting from ‘last frame’ to ‘first
frame’ in sequence & keep looping over in reverse order until there are frames on the parent timeline’s
frame span.
• First frame: ‘First' specifies from which frame of Graphic, the loop playback of symbol instance should
begin.
• Last frame: ‘Last’ specifies up to which frame of Graphic, the loop playback should go. By default, ‘Last
frame’ is not set.
Button symbols - are a special type of four-frame interactive movie clip in Adobe Animate. The first
three frames display the button's three possible states: Up, Over, and Down; the fourth frame defines
the active area of the button.

Bitmap graphics - are used to display photographic content, such as images captured with a digital
camera. These files display individual pixels that contain unique color values; when viewed together,
the pixels include the photo or image.

You can use the Text tool to create three types of text fields in Adobe Animate: static, dynamic, and
input. All text fields support Unicode:
• Static text fields display text characters that don't change dynamically.
• Dynamic text fields display dynamically updating text, such as game scores or user names.
• Input text fields allow users to enter text in forms or surveys.

TWEENING
Classic tween - is primarily for transition purposes. These tweens are similar to the newer
motion tweens, but are more complicated to create and less flexible. To create a classic tween, set
a keyframe for the start point and a keyframe for the end point.
Motion tweens - are used to create animation movements within Animate. Motion tween animation is
created by specifying different values for an object property between the first and the last frames.
SHORCUT KEYS

12 PRINCIPLES OF ANIMATION

Timing and Spacing – in animation is what gives objects and characters the illusion of moving within the
laws of physics.

Squash and stretch – is what gives flexibility to objects. The easiest way to understand how squash and
stretch work is to look at a bouncing ball.

Anticipation is used in animation to set the audience up for an action that is about to happen, and is
required to sell believable movements.

Ease in, ease out - is the technique of giving an object more frames at both the beginning and end of a
motion. This results in a movement that is slow, then fast, then slow again.
Follow-through and overlapping action - Follow-through is the idea that certain appendages and body
parts might continue to move even after a motion is completed. Overlapping action is the idea that
different parts of a body will move at different rates.

Arcs - are circular paths taken by an object or action in animation. In a mechanical device, the motion of
an object or action is created by following an arc.

Exaggeration is used to push movements further, adding more appeal to an action, and should always
be implemented to some degree.

Solid Drawing is about creating an accurate drawing in terms of volume and weight, balance, shadow,
and the anatomy in a pose. (3D)

Appeal - makes the character or design stand out. Viewer feels realism and it generates further interest
when appeal is added to the design.

Straight ahead action and pose to pose - Straight ahead action is a very spontaneous and linear
approach to animating and is animated from start to finish, frame by frame. Pose to pose allows for
more simple work and ensures the proportions and timing are correct before you add more intervals
later, and is great for slow, dramatic, or emotional scenes.

Secondary action - refers to the actions that support or emphasize the main action to breathe more life
into the animation and create a more convincing performance.

Okay na yan hahaha inaantok na ‘ko. Loveu sana pumasa us ict mwa mwa