1 Flash Basics Exercise Guide. 2 1. Making Animated Text  1.1 Open Flash 5.0 working environment frame 1  1.2 Highlight frame 1 of the first layer Insert.

Slides:



Advertisements
Similar presentations
INTRODUCTION TO ADOBE FLASH CS4
Advertisements

Flash Raining Text. Open Project Create Project – Action Script 3 Select Text Tool Type in some text – From the Properties Menu – Choose Font, Font Size,
Flash animation For beginners. Lesson objectives To understand how to animate a ball To understand how to loop animations To learn how to use animation.
CIS 205—Web Design & Development Flash Chapter 3 Appendix B on Creating Animations.
© Anselm Spoerri Lecture 10 Flash –Recap –Key Components & Tools –Animating Bitmaps –How to modify Color and Transparency of Bitmap –Animating along Motion.
© Anselm Spoerri Lecture 11 Flash –Build Flash Website with Animated Navigation Structure –Decide on Overall Navigation Layout, Import Images & Organize.
Macromedia Flash Cartoons & Buttons Your Presenter: Laura Silberstein
Introduction to Macromedia Flash 8
Creating Flash Buttons Button Making Rollover Effects Enlarging the Clickable Area Giving Buttons Behaviors Behavior Options.
1 Flash and Animation Presented by : Behzad Sajed Khosrowshahi.
Roentgen photo effect. This detailed, thoroughly explained lesson will show you how to create very attractive roentgen photo effect. You can use this.
Chapter 3 Working with Symbols and Interactivity.
XP Tutorial 5 Buttons, Behaviors, and Sounds. XP New Perspectives on Macromedia Flash MX Buttons Interactive means that the user has some level.
Introduction to Flash FYS100 Creative Discovery in Digital Art Forms Spring 2007 Burg.
Exercise : Animated Navigation Structure in Flash 1.Develop Answers to “What did you learn in ITI program?” “What do you have to offer?” “What are your.
1 Flash Basics by Dr SC Li. 2 File Types  In general, Flash 5.0 generates 3 types of files:  ???.fla  Flash ’ s working file  ???.swf  Flash movie.
Flash MX II. Flash MX – Tweened Animation There are two methods for creating an animation sequence in Flash –Frame-by-frame animation –Tweened animation.
CT1514.  What is Motion Guide Layer?  Controls the movement of objects in a Motion tween animation  How to create a Motion Guide Layer?  Click on.
© 2011 Delmar, Cengage Learning Chapter 3 Working with Symbols and Interactivity.
Copyright © 2003 Pearson Education, Inc. Chapter 3, Slide 1 by Michael Kay The Web Wizard’s Guide to Flash.
Working with Symbols and Interactivity
Creating a Logo – Lesson 3 1 Creating a Logo Lesson 3.
© 2010 Delmar, Cengage Learning Chapter 3: Working with Symbols and Interactivity.
CSC 361/661 Digital Media Spring 2010 Professor Burg.
XP Tutorial 4 Special Animations. XP New Perspectives on Macromedia Flash MX Special Layers for Animation Animation Using a Motion Guide Layer.
DIAMOND SHINE EFFECT. IN THIS STEP BY STEP LESSON, I WILL SHOW YOU HOW TO CREATE VERY ATTRACTIVE DIAMOND SHINE EFFECT USING SOME SPECIAL FLASH TIPS AND.
EYEGLASSES SHINE EFFECT. IN THIS LESSON, YOU WILL SEE HOW TO APPLY SHINE EFFECT ON EYEGLASSES ON THE PICTURE USING THE COLOR MIXER PANEL AND MASK.
Creating Buttons – Lesson 71 Creating Buttons Lesson 7.
Click your mouse for next slide Flash – Morphing and Shape Tweening You have designed some motion animation with the last lesson There is another type.
Adobe Flash CS3 Revealed Chapter 3 - WORKING WITH SYMBOLS AND INTERACTIVITY.
Agenda – Week 8, Day 2 Tuesday Intro to Flash Animation process Computer animation Lesson 1 – Overview Lesson 2 – Drawing Lesson 4 – Layers Lesson 8 –
Chapter 4 Creating Animations. Chapter 4 Lessons 1.Create motion tween animations 2.Create classic tween animations 3.Create frame-by-frame animations.
Week 11 Hands on Flash Pelekanou Olga INF221 INTRODUCTION TO MULTIMEDIA.
2006 Adobe Systems Incorporated. All Rights Reserved. 1 INTRODUCTION TO ADOBE FLASH CS3.
Motion Tweening – Lesson 81 Motion Tweening Lesson 8.
Introduction to Flash Animation CS 318. Topics Introduction to Flash and animation The Flash development environment Creating Flash animations  Layers.
Flash CS 5 Interface BY NSCHEWCZYK | ©2012. MENU BAR A bar at the top of the window. It lists menu options including: File, Edit, View, Insert, Modify,
Distributed Multimedia Programming Week – 4A Buttons Movie Clips.
Building the Events Components– Lesson 111 Building the Events Components Lesson 11.
BASIC MOTION TWEEN Studio 8 1. Draw a square (blue fill, no stroke) on the upper-left area of the stage.
1 Flash Basics by Dr SC Li. 2 Ordinary Movie vs. Flash Movie AnimationVector GraphicsInteractivity MPEG MovieFlash Movie.
Adding Text and Navigation to the Home Page – Lesson 51 Adding Text and Navigation to the Home Page Lesson 5.
Flash animation For beginners. homework Your homework is over two weeks so please write in each week of your planner for the next two weeks For homework.
Creating an Animated Map – Lesson 91 Creating an Animated Map Lesson 9.
Flash Develop Rich Internet Content and Applications –Design motion graphics or build data-driven applications Flash Document = “.fla” filename extension.
Unit 7 – Desktop Publishing Animation Animation Skills Lesson – Overview of Adobe Flash Canvas TimeLine Tools Properties.
Video in Macromedia Flash (Optional) – Lesson 121 Video in Macromedia Flash (Optional) Lesson 12.
FLASH!!!!!!!!!!!!!!!!!!!!!!!!! A TUTORIAL BY BRITTANY HESS AND MARGARET DENTON.
CIS 205—Web Design & Development Flash Chapter 3 Appendix on Using Buttons.
Flash Concepts and Demos - Overview Recap Unit 2 –Buttons (Simple Text and Animated Button) –Gradient Tool –ActionScript (stop, getURL) –Embed Flash Movie.
XP Tutorial 3 Creating Animations. XP New Perspectives on Macromedia Flash MX Elements of Animation Layers are used to organize the content of.
Creating buttons Mak Mang Tao. What is a button? It is an object to make interactive effect through the pointer of the mouse movement It is a four-frame.
Flash 1. Document Properties Set frame rate and dimensions of project Set frame rate and dimensions of project (default width=550 and height=400)
© Anselm Spoerri Lecture 10 Flash –Recap –Key Concepts, Components & Tools –Demonstration –Buttons: Simple Text Button | Animated Button –Gradient Tool.
CIS 205—Web Design & Development Flash Chapter 3 Working with Symbols and Interactivity.
Flash Demonstration – Unit 3 Create Multi-Part Animation –Animate Images –Fade-in and Fade-out Text –Add Interactivity to Instance of MovieClip –Animated.
Flash Slideshow with Fade Transition Slideshow #1-Themed Images Slideshow #2-Instructional Images.
 Motion Tween allow us to move a shape on the stage from one place to another.  In order to use motion tween, the shape to be moved must be converted.
Packages that we use Within ICT we primarily use Dreamweaver CS3 and Flash CS3 This is embedded in an Adobe Design Premium CS3 package (Go to Start >
Flash Interface, Commands and Functions
Macromedia Flash Tutorial
CT1514 Flash-2.
INTRODUCTION TO ADOBE FLASH CS4
Flash animation For beginners.
Animate Some more advanced concepts
Chapter Lessons Create shape-tweened animations Create a mask effect
Develop Rich Internet Content and Applications
Flash Concepts and Demos - Overview
Let Flash do Guessing at Animation for you.
Presentation transcript:

1 Flash Basics Exercise Guide

2 1. Making Animated Text  1.1 Open Flash 5.0 working environment frame 1  1.2 Highlight frame 1 of the first layer Insert > Keyframe  1.3 Then click Insert > Keyframe Window > Tools  1.4 To open the Tools panel: click Window > Tools ‘ A ’  1.5 Click the ‘ A ’ (Alphabet) option  1.6 To create an area for inputting text, drag the mouse along the stage  1.7 Type in the text required  1.8 To chance the properties of the text, highlight the text and click the ‘ Text ’ on the top menu bar and choose the desired options.

3 1. Making Animated Text black arrow Insert > frame  1.9 Click the black arrow of the Tools panel, then hightlight the frame 1. To add in more frames, click Insert > frame Drag the small rectangle at the end frame to frame 45  1.10 Drag the small rectangle at the end frame to frame 45  1.11 To create tweening motion, click Insert > Create Motion Tween Insert > Keyframe  1.12 Highlight the end frame (the small rectangle), and click Insert > Keyframe  1.13 Highlight the end KeyFrame and drag the text to your desired position.

4 1. Making Animated Text scalerotate  1.14 You could change the text ’ s other properties, such as, size, orientation (rotate) and color etc by highlighting the text and right-click, choose either scale, rotate, etc. Panels > Effects > alpha  1.15 To make the text transparent, you may highlight the text and right-click it, then choose Panels > Effects > alpha File > Save  1.16 Then click File > Save As to save the file on your desktop.

5 2. Adding layers of Text Insert > Layers  2.1 To add new layers, Insert > Layers  2.2 Following steps , create a piece of text black dotsmall rectangle  2.3 Reduce the number of frames by 5 by dragging the black dot or the small rectangle of the corresponding timeline;  2.4 Then highlight the timeline and drag it to frames  2.5 Following , create another piece of text and dock it to frames 70-75

6 2. Adding layers of Text Actions.  2.6 To stop the movie at frame 45, highlight frame 45 and right-click it and choose Actions. ‘ stop ’  2.7 On the action panel, select the ‘ stop ’ command by double-clicking it. Actions.  2.8 To stop the movie at frame 60, highlight frame 45 and right-click it and choose Actions. Then follow step 2.7. Actions.  2.9 To stop the movie at frame 70, highlight frame 45 and right-click it and choose Actions. Then follow step 2.7.

7 3. Adding hot buttons Insert > Layers.  3.1 To add new layers for the hot buttons, click Insert > Layers.  3.2 To draw a simple button, click the rectangle icon on the Tools Panel, and drag a desired rectangle on the stage.  3.3 Then click the black arrow on the Tools panel and highlight the button drawn on the stage. Insert > Convert to Symbol  3.4 To convert the graphic to an object (button), click Insert > Convert to Symbol. ‘ button ’  3.5 On the Symbol Panel, choose the ‘ button ’ option and give a name to the symbol, says, ‘ button1 ’

8 3. Adding hot buttons  3.6 Then double-click the button and a timeline with 4 frames, representing the UP, OVER, DOWN and HIT events. Panels > Fill ‘ Linear Gradient ’  3.7 Highlight the UP frame, and change the colour profile of the button, For example, you may highlight the button and right-click it, then choose Panels > Fill and select the option ‘ Linear Gradient ’.  3.8 To change the texture of the button, you can vary the colours of the two ‘ buckets ’ at the two ends of the colour bar. Insert > KeyFrame  3.9 Highlight the OVER frame and click Insert > KeyFrame and repeat Step 3.8.

9 3. Adding hot buttons  3.6 Then double-click the button and a timeline with 4 frames, representing the UP, OVER, DOWN and HIT events. Panels > Fill ‘ Linear Gradient ’  3.7 Highlight the UP frame, and change the colour profile of the button, For example, you may highlight the button and right-click it, then choose Panels > Fill and select the option ‘ Linear Gradient ’.  3.8 To change the texture of the button, you can vary the colours of the two ‘ buckets ’ at the two ends of the colour bar. Insert > KeyFrame  3.9 Highlight the OVER frame and click Insert > KeyFrame and repeat Step 3.8.

10 3. Adding hot buttons Insert > KeyFrame  3.10 Highlight the DOWN frame and click Insert > KeyFrame and repeat Step 3.8. Insert > KeyFrame  3.11 Highlight the HIT frame and click Insert > KeyFrame and repeat Step 3.8.  3.12 You should ensure that the timeline of the button spans between frames  3.13 Highlight the button and drag it to the desired position on the stage. Window > Library ‘ button1 ’  3.14 To add more buttons to the stage, click Window > Library and drag the symbol ‘ button1 ’ onto the stage.

11 3. Adding hot buttons  3.15 Repeat Actions  3.16 To create an action to the button, highlight the button and right-click it. The choose the Actions option and ‘ goTo ’ 60  3.17 For the first button, select the command ‘ goTo ’ and type in 60 for the frame number. ‘ goTo ’ 70  3.18 For the second button, select the command ‘ goTo ’ and type in 70 for the frame number. ‘ getURL ’ select _blank  3.19 For the third button, select the command ‘ getURL ’ and type in the URL as and select _blank as the option for the browser window.

12 4. Adding audio Insert > Layers  4.1 Click Insert > Layers to accommodate the audio object Window > Library Sound-technoloop ’  4.2 Highlight the first frame and click Window > Library. Drag the audio file named ‘ Sound-technoloop ’  4.3 Extend the audio timeline so that it spans between frames  4.4 Then save the file and publish it in terms of.swf,.html and.exe files and compare their differences.