Understand the Macromedia Flash workspace

1
(No Transcript)
2
Chapter Lessons
OVERVIEW

• Understand the Macromedia Flash workspace
• Open a document and play a movie
• Create and save a movie
• Work with the timeline
• Plan a Web site
• Distribute a Macromedia Flash movie

3
Using Flash 8
INTRODUCTION

• What is Flash 8?
• An animation and interactive authoring program
• Has tools for complex animation, as well as
  excellent drawing tools

4
Using Flash 8
INTRODUCTION

• What can Flash 8 be used for?
• Web sites
• Web-based applications
• CD-Rom and interactive applications
• Video

5
Optimized for the Web
INTRODUCTION

• Flash uses vector images
• Vectors are scalable
• Reduces the size of graphic files
• Flash provides for streaming content over the
  Internet
• Does not need to wait for entire contents of Web
  page to load to start playing

6
Understanding the Flash Environment
LESSON 1

• You can customize your workspace
• Flash works on a movie metaphor
• Create scenes on a stage
• Scenes run in frames on a timeline
• Create a movie by arranging objects on the stage
• Play the movie on the stage using VCR-like
  controls

7
Understanding the Flash Environment
LESSON 1

• Three parts to the development environment
• Stage
• Timeline
• Workspace
• Other parts of the program
• The toolbox
• The properties panel

8
LESSON 1
9
The Stage
LESSON 1

• Contains all objects that are seen by the viewer
  in the final movie
• You can draw objects on, or import objects to the
  stage

10
The Timeline
LESSON 1

• Used to organize and control the movies content
  by specifying when each object appears on the
  stage
• Contains images within frames
• Units of the timeline
• Has separate layers
• Has a playback head

11
The Tools Panel
LESSON 1

• Contains a set of tools used to draw and edit
  graphics and text
• Divided into four sections Tools, View, Colors,
  Options
• Panels, i.e., Properties panel
• Used to organize and modify objects and features
  in a movie

12
Open a Document and Play a Movie
LESSON 2

• 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 for
  modifications

13
Previewing a Movie
LESSON 2

• Flash movies can be previewed in the development
  environment
• Use control menu commands
• Play, rewind, step forward, step backward
• Use the Controller
• Toolbar command on the Window menu

14
Keyboard Shortcuts
LESSON 2

• Play Enter (Win) and Return (Mac)
• Rewind (Ctrl Alt R (Win)) and (Option
  R (Mac))
• Step Forward (.) moves the play head forward
  progressively
• Step Backward (,) moves the play head backward
  progressively

15
Testing a Movie
LESSON 2

• 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

16
Create and Save a Movie
LESSON 3

• 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

17
Creating an Animation
LESSON 3

• 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

18
An Object in a Keyframe
LESSON 3
Object on the stage is in Frame 1 on the timeline
FIGURE 9 Oval object in Frame 1
19
Motion Animation
LESSON 3
Arrow indicates motion animation
FIGURE 10 Motion animation
20
Adding an Effect to an Object
LESSON 3

• In addition to animating an objects location,
  you can also animate an objects appearance
• Shape
• Color
• Brightness
• Transparency
• Rotation

21
Work with the Timeline
LESSON 4

• Determine and modify what is happening in a movie
  frame by frame
• Which objects are animated
• What types of animation to use
• Which objects will appear on top of others
• How fast movie will play

22
Work with the Timeline
LESSON 4
Playhead
Frame View Icon
Frames
Status Bar
Layers
FIGURE 15 Elements of the Timeline
23
Using Layers
LESSON 4

• 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

24
Using Frames
LESSON 4

• 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

25
Using the Playhead
LESSON 4

• 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

26
Understanding Scenes
LESSON 4

• A section of the timeline designated for a
  specific part of the movie
• Create a number of scenes to organize movie
• Give scenes descriptive names for faster editing
• Manage your flash movie production

27
Working with the Timeline
LESSON 4

• By studying a timeline you can determine
• If different objects are on different layers
• If there is motion in any of the layers by
  looking for the motion arrow
• The length of the animation
• The frame rate
• Where the animation is in its sequence

28
Plan a Web Site
LESSON 5

• Step 1 State the purpose of your site
• What do we want to accomplish?
• Step 2 Identify the target audience
• Who will use this Web site?

29
Plan a Web Site
LESSON 5

• Step 3 Determining the Treatment
• What is the look and feel?
• Tone
• Approach
• Emphasis

30
Plan a Web Site
LESSON 5

• Step 4 Develop the Specifications
• Playback System
• Elements to Include
• Functionality
• User Interface

31
Using Screen Design Guidelines
LESSON 5
FIGURE 23 Sample Storyboard
32
Using Screen Design Guidelines
LESSON 5

• Balance
• Unity
• Movement

33
Using Interactive Design Guidelines
LESSON 5

• Make it simple, easy to understand
• Build in consistency in the navigation scheme
• Provide feedback
• Give the user control

34
Distributing a Macromedia Flash Movie
LESSON 6

• Export out of Flash as
• .html (The HTML document)
• .swf (The Macromedia Flash Player file)

35
LESSON 6
.swf extension indicates aMacromedia Flash
Player file
Code specifying the Macromedia Flash Player Movie
that the browser will play
FIGURE 24 Sample HTML code
36
Other Publishing Options
LESSON 6

• Stand-alone Projector Files
• Quicktime .mov files

37
Chapter 1 Tasks
SUMMARY

• 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