Flash from the Get-Go: Beginning to Intermediate Skills Staci Trekles Milligan Clinical Assistant Professor Purdue University Calumet

Objectives Participants will be able to: Utilize the interface commands, including drawing tools, layer manipulation, and timeline controls Create simple animations using shape and motion tweens Use the motion guide tools to create more advanced animations Utilize the photo slideshow and quiz templates available in Flash to create their own custom quizzes and picture galleries Publish Flash documents for the Web

Participants will be able to:

Utilize the interface commands, including drawing tools, layer manipulation, and timeline controls

Create simple animations using shape and motion tweens

Use the motion guide tools to create more advanced animations

Utilize the photo slideshow and quiz templates available in Flash to create their own custom quizzes and picture galleries

Publish Flash documents for the Web

Objectives Participants will be able to: Import video files into Flash animations Create simple interactions within animations using ActionScript 2 Create fully customizable, component-based self-check quizzes Add “quicktip” interactions to websites or Flash-based animations and quizzes Utilize “drag and drop” interactions to create memory or learning games/quizzes

Participants will be able to:

Import video files into Flash animations

Create simple interactions within animations using ActionScript 2

Create fully customizable, component-based self-check quizzes

Add “quicktip” interactions to websites or Flash-based animations and quizzes

Utilize “drag and drop” interactions to create memory or learning games/quizzes

What is Flash? Flash is an authoring environment capable of producing everything from simple animations to fully interactive experiences such as games or quizzes Primarily designed to produce media for the Web, but Flash animations can be added to PowerPoint, digital videos, and even merged into other Flash animations

Flash is an authoring environment capable of producing everything from simple animations to fully interactive experiences such as games or quizzes

Primarily designed to produce media for the Web, but Flash animations can be added to PowerPoint, digital videos, and even merged into other Flash animations

Why use Flash? Flash allows even the beginner to create high-impact visuals to enhance a presentation or Web page with illustration or decoration (or both) Slide shows, quizzes, and other kinds of interactive experiences can be designed to your exact specifications, giving you greater control over your teaching materials

Flash allows even the beginner to create high-impact visuals to enhance a presentation or Web page with illustration or decoration (or both)

Slide shows, quizzes, and other kinds of interactive experiences can be designed to your exact specifications, giving you greater control over your teaching materials

Things to Consider Entire websites should never be designed in Flash; they are not able to be accessed by users with disabilities Too many “flashy” animations can be distracting for some users – exercise caution when using a great deal of movement on a single page or slide Flash is not an “easy” program to get the hang of, and for many the learning curve can be daunting; take it slow as you learn and remember that no one becomes an expert overnight!

Entire websites should never be designed in Flash; they are not able to be accessed by users with disabilities

Too many “flashy” animations can be distracting for some users – exercise caution when using a great deal of movement on a single page or slide

Flash is not an “easy” program to get the hang of, and for many the learning curve can be daunting; take it slow as you learn and remember that no one becomes an expert overnight!

Some Flash Lingo Timeline : The line along the top of the Flash workspace which holds each Frame, from 1 to infinity; allows Flash to display animations frame-by-frame, much like a filmstrip or a child’s “animated” flip book. Frame : An individual moment in time within the animation; click on any frame in the timeline to see what is happening or displayed on that frame Keyframe : A special frame where something can be designated to change or happen; i.e., a ball moving left can be told to start moving to the right at a keyframe

Timeline : The line along the top of the Flash workspace which holds each Frame, from 1 to infinity; allows Flash to display animations frame-by-frame, much like a filmstrip or a child’s “animated” flip book.

Frame : An individual moment in time within the animation; click on any frame in the timeline to see what is happening or displayed on that frame

Keyframe : A special frame where something can be designated to change or happen; i.e., a ball moving left can be told to start moving to the right at a keyframe

More Flash Lingo Layer : Individual “tracks” of the timeline; allows different elements to do different things at the same time by adding each element to its own layer Stage : Just like in theater, this is where the action happens, or where the graphical and content elements of your work are put together and displayed Scene : Allows you to organize your animation more easily; however, they are best used in longer animations

Layer : Individual “tracks” of the timeline; allows different elements to do different things at the same time by adding each element to its own layer

Stage : Just like in theater, this is where the action happens, or where the graphical and content elements of your work are put together and displayed

Scene : Allows you to organize your animation more easily; however, they are best used in longer animations

Timeline – Keyframes will have a dot inside them The first frame is always a keyframe List of layers Stage Scenes

More Flash Lingo ActionScript : The programming language of Flash; version 2.0 uses more natural language and is best suited for beginners and work involving basic kinds of tasks, while version 3.0 is designed for higher mathematical functions Interaction : Term for any time ActionScript is used to allow the user to do something within the Flash animation, such as stop or start the animation, select a button, or move an object

ActionScript : The programming language of Flash; version 2.0 uses more natural language and is best suited for beginners and work involving basic kinds of tasks, while version 3.0 is designed for higher mathematical functions

Interaction : Term for any time ActionScript is used to allow the user to do something within the Flash animation, such as stop or start the animation, select a button, or move an object

Publishing Flash Documents Adobe Flash allows you to create, edit, and test animations in the FLA format ONLY However, in order to use and share those animations with others, you need to Publish your work as an SWF document Do this from the File menu; once you publish, you will have a final product that can be inserted into a web page, added to a PowerPoint, and more

Adobe Flash allows you to create, edit, and test animations in the FLA format ONLY

However, in order to use and share those animations with others, you need to Publish your work as an SWF document

Do this from the File menu; once you publish, you will have a final product that can be inserted into a web page, added to a PowerPoint, and more

Resources Books: The Web Collection Revealed: Adobe Dreamweaver, Flash, and Fireworks (Thomson-Delmar Learning) Flash CS3/CS4 Professional Visual QuickStart Guide (Peachpit Press) Adobe Flash How-Tos: 100 Essential Techniques (Adobe Press) Flash CS3/CS4: The Missing Manual (O’Reilly Press)

Books:

The Web Collection Revealed: Adobe Dreamweaver, Flash, and Fireworks (Thomson-Delmar Learning)

Flash CS3/CS4 Professional Visual QuickStart Guide (Peachpit Press)

Adobe Flash How-Tos: 100 Essential Techniques (Adobe Press)

Flash CS3/CS4: The Missing Manual (O’Reilly Press)

Resources Tutorials from this workshop and more: http://education.calumet.purdue.edu/Tutorials/HECC Flashkit.com - Excellent Flash developer resource: http://www.flashkit.com/ Flash tutorials with lots of useful info: http://www.entheosweb.com/Flash/default.asp Adobe Flash Tutorial/Support Center: http://www.adobe.com/support/flash/tutorial_index.html

Tutorials from this workshop and more: http://education.calumet.purdue.edu/Tutorials/HECC

Flashkit.com - Excellent Flash developer resource: http://www.flashkit.com/

Flash tutorials with lots of useful info: http://www.entheosweb.com/Flash/default.asp

Adobe Flash Tutorial/Support Center: http://www.adobe.com/support/flash/tutorial_index.html

Clipart and Media Sources Gimp Savoy Photo Archive, http://gimp-savvy.com/PHOTO-ARCHIVE DHD Multimedia Gallery, http://gallery.hd.org/index.jsp Image After, http://www.imageafter.com Pics for Learning, http://pics4learning.com

Gimp Savoy Photo Archive, http://gimp-savvy.com/PHOTO-ARCHIVE

DHD Multimedia Gallery, http://gallery.hd.org/index.jsp

Image After, http://www.imageafter.com

Pics for Learning, http://pics4learning.com

More Media Sources The Smithsonian, http://smithsonianimages.si.edu Creative Commons: http://www.creativecommons.org Wikimedia, http://www.wikimedia.org AKM Music, http://www.akmmusic.co.uk/ Absolute Sound Effects Library, http://www.grsites.com/sounds/

The Smithsonian, http://smithsonianimages.si.edu

Creative Commons: http://www.creativecommons.org

Wikimedia, http://www.wikimedia.org

AKM Music, http://www.akmmusic.co.uk/

Absolute Sound Effects Library, http://www.grsites.com/sounds/

About Staci My blog: http://stacimilligan.edublogs.org My website: http://education.calumet.purdue.edu/Faculty/trekles Purdue Calumet Graduate Studies and license renewal program: http://www.calumet.purdue.edu/education/grad

My blog: http://stacimilligan.edublogs.org

My website: http://education.calumet.purdue.edu/Faculty/trekles

Purdue Calumet Graduate Studies and license renewal program: http://www.calumet.purdue.edu/education/grad