Download Adobe Photoshop 7.0 Design Professional

Dm 11 – Intro. To Flash
GETTING STARTED WITH
Macromedia Flash MX
Chapter Lessons
• Understand the Macromedia Flash
•
•
•
•
•
environment
Open a document and play a movie
Create and save a movie
Work with layers and the timeline
Plan a Web site
Distribute a Macromedia Flash movie
Chapter A
Using Flash MX
• What is Flash MX?
– A animation and interactive authoring
program
– Has tools for complex animation, as well as
excellent drawing tools
Chapter A
Using Flash
• What can Flash MX be used for?
– Web sites
– Web-based applications
– CD-Rom and interactive applications
– Video
Chapter A
Optimized for the Web
• Flash’s Native format is vector
images, which reduce the size of
graphic files.
– Vectors are scalable
• Flash provides streaming content over
the internet
– instead of waiting for the entire contents
of a web page to load
Chapter A
The Development Environment
• You can customize your workspace
• Flash works on a movie metaphor
– Create Scenes on a Stage
– Scenes run in frames on a timeline
– You create a movie by arranging objects
on the stage
– You can play the movie on the stage
using VCR-like controls
Chapter A
Playback of Flash content
• Movies are viewable through a browser
• Macromedia Flash Player is required
(free download available on
Macromedia’s Web site)
• Movies can be played through the
browser, the player, or as a stand-alone
“projector”
Chapter A
How Flash Starts up
• Three parts to the Development
Environment
– Stage
– Timeline
– Workspace
• You can display other parts of the
program
– The toolbox
– The properties panel
Chapter A
timeline
toolbox
stage
stage
panels
Chapter A
The Stage
• Contains all objects that are seen
by the viewer in the final movie
• You can draw objects on, or import
objects to the stage
Chapter A
The Timeline
• Used to organize and control the
movie’s content by specifying when
each object appears on the stage
• Images are contained within
frames, which are units of the
timeline
• The timeline has separate layers
• The timeline has a playback head
Chapter A
The Toolbox
• Contains a set of tools used to draw
and edit graphics and text
• Divided into four sections: Tools,
View,Colors, Option
• Panels, such as the Properties Panel
are used to organize and modify
objects and features in a movie
Chapter A
Opening a movie in Flash
• The .fla extension is native, and can
only be opened in Flash
• Flash exports web-ready files as
.swf
• .swf files should be tested before
being published
• Always keep the original .fla file
Chapter A
Previewing a movie
• Flash movies can be previewed in
the development environment
• Control menu commands:
– Play, rewind, step forward, step
backward.
• The Controller acts similar to a VCR
Controller
Chapter A
Testing a movie
• When previewing a movie, some
interactive functions do not work
unless the movie is played using
the Flash Player.
• Use Control > Test Movie to test
using the Flash player
Chapter A
Creating a Macromedia Flash
Movie
• Movies are created by placing
objects on the stage, editing these
objects, animating them and adding
interactivity
• You can create graphics in Flash,or
import them from another program
such as Photoshop
Chapter A
Creating a Macromedia Flash
Movie
• Objects placed on the stage are
automatically placed in a layer, and
in the currently selected frame of
the timeline
• A keyframe represents a frame
which contains an object
– Always the first frame of every
animation
Chapter A
An object in a keyframe
Keyframe
representing
object
Object on the stage
Chapter A
Creating an animation
• A basic animation requires two
keyframes
– The first keyframe sets the starting
position
– The second keyframe sets the ending
position
• The number of frames between two
keyframes determines the length of
the animation
Chapter A
Motion animation
Arrow
between
keyframes
indicates
motion
animation
Chapter A
Adding an Effect to an Object
• In addition to animating an objects
location, you can also animate an
objects appearance
– Shape
– Color
– Brightness
– Transparency
– Rotation
Chapter A
Understanding the Timeline
Playhead
Layers
Frames
Frame View
Icon
Status Bar
• Understanding how to read the timeline
can help you determine what’s happening
in your movie frame by frame
Chapter A
Layers
• Like transparent acetate sheets of
content stacked on top of one
another
• Adding a layer causes it to be placed
on top of the other layers
• Can be re-ordered by dragging up or
down
Chapter A
Using Frames
• The timeline is made up of
individual units called frames
• Content is displayed in frames as
the playhead moves over them
when the movie plays
• The status bar indicates current
frame the playhead is on
Chapter A
Using the Playhead
• The playhead indicates which frame
is playing
• Can be dragged left or right
• Dragging back and forth allows you
to check some animations in Flash
without exporting to swf
Chapter A
Understanding Scenes
• A section of the timeline designated
for a specific part of the movie
• You can create and name scenes as
you wish
• Great way to manage your Flash
movie production
Chapter A
Adjusting the Timeline view
Chapter A
Modifying the frame rate
Change movie dimensions
Adjust the
Background
color
Adjust the
frame rate
Chapter A
Plan a Web site
• First step in any site production
• Step 1: State the
Purpose(Goals)
• Step 2: Identify the Target
Audience
– Who will use the Web site?
Chapter A
Plan a Web site
• Step 3: Determining the
Treatment
– What is the look and feel?
– Tone
– Approach
– Emphasis
Chapter A
Plan a Web site
• Step 4: Develop the Specifications
– Playback System
– Elements to Include
– Functionality
– User Interface
Chapter A
Create a Storyboard
Chapter A
Using Screen Design guidelines
• Balance
• Unity
• Movement
• User Interface
Chapter A
Using Interactive Design
guidelines
• Make it simple, easy to
understand
• Build in consistency in the
navigation scheme
• Provide feedback
• Give the user control
Chapter A
Distributing Flash Movies
• File > Publish to export movies
out of Flash
• Export to .swf format
• Generate the HTML code that
references the Macromedia
Shockwave file
Chapter A
HTML code
Code specifying the
Macromedia Shockwave Movie
that the browser will play
.swf extension indicates a
Macromedia Shockwave file
Chapter A
Other Publish options
• Stand-alone Projector Files
• Quicktime .mov files
Chapter A
Chapter A Tasks
• Understand the Macromedia Flash
environment
• Open a document and play a movie
• Create and save a movie
• Work with layers and the timeline
• Plan a Web site
• Distribute a Macromedia Flash movie
Chapter A