Agenda – Week 8, Day 2

Tuesday Intro to Flash

Animation process Computer animation Lesson 1 – Overview Lesson 2 – Drawing Lesson 4 – Layers Lesson 8 – Animation

Today, Continue Lesson 3 – Symbols Lesson 7 – Buttons Lesson 8 – Animation

Design Challenge…

Lesson 1 - Basics

Topics Toolbar Screen Timeline “Assets” area Panels

Application Create a new

flash file, in preparation for play…

Lesson 2 - Drawing Topics

Lines, rectangles, ovals Stroke and fill Modifiers Pencil tool Paint, fill, bucket, gradient Line properties Erasing Selecting – lasso, polygon Reshaping Scaling, rotating,

transforming

Application Using a

combination of drawing tools (and imported images), create a background for an animation.

Lesson 4 - Layers

Topics Understanding

layers Selecting layers

Application Insert a new layer

into your animation

Rename the layer

Design Challenge Create a short Flash movie that

Displays a software screen image Includes a button that a user can press

to take them to the UW website. Shows a a cursor moving across the

screen to ultimate point to one of the menus.

Includes a button that a user can press to replay the movie.

Design Challenge - Prep Create a new movie Place a screenshot of the UW

website on the active layer Rename the layer as “UW

Website”

Lesson 3 – Symbols/InstancesTopics

Definition Creating symbol Types of symbols Using library Creating instance Changing instance

Application In a new layer, use

drawing tools to create a “cursor”.

Convert your cursor to a “graphic” symbol.

Check the library to see that your symbol is in the library.

Create instances of cursor on your workspace.

Layer 6 – Buttons

Topics Definition Creating button Setting button

“states” Setting button

actions

Application Create button that

changes colors when user clicks it.

Put button in movie Modify button’s

action so it takes users to the UW website.

Lesson 8 – Animation/TweensTopics

Running the animation

Keyframes Tweens

Motion Size Rotation Motion along a path Color Shape

Application Create simple

motion “tween” showing your “cursor” moving across screen.

Try adding a motion path to the cursor’s motion “tween”

Note: The online help discussion of animation provides another entry point for understanding animation, keyframes, and tweens.

Design Challenge - Revisited Create a short Flash movie that

Displays a software screen image Includes a button that a user can press

to take them to the UW website. Shows a a cursor moving across the

screen to ultimate point to one of the menus.

Includes a button that a user can press to replay the movie.

The assignment revisitedBottom Line One task with three steps As least three different types of “tweens” One button Animated cursor illustrating site interaction

Hints Test early and often Get something that works

Some Additional Hints To test movie

Control > Play (some but not all functionality) Control > Test Movie

To export movie for web use File > Export Movie

Useful help information “Creating Interactive Movies” particularly section on “Assigning Actions to

Frames”

Wrap - up Where we’ve been

Flash And 7 other pieces of software

Where we’re headed on Tuesday Debrief from Flash Moving on to Professional Portfolio!