2. 1-1 OBJ Copyright 2003, Paradigm Publishing Inc. Dr. Joseph Otto Silvia Castaneda Christopher deCastro CSULA Macromedia Flash MX Introduction

3. 1-2 OBJ Copyright 2003, Paradigm Publishing Inc. What is Macromedia Flash MX? a software application that creates rich content Web sites multimedia devices - CDROMs

4. 1-3 OBJ Copyright 2003, Paradigm Publishing Inc.  Web designer or developer  Design appealing web pages or parts of web pages  Static images, lots of text  Interactive sites – animated logos, watch movies, click graphic buttons  Flash files – smaller – vector animation program – reuse objects  Create graphics and animation – flash document

5. 1-4 OBJ Copyright 2003, Paradigm Publishing Inc. Graphic Images - describes images using mathematical equations - small file sizes - fast download time - resized without becoming distorted vector - represented by pixels - large file sizes - slower download time - degrade in quality as they are resized bitmapped

6. 1-5 OBJ Copyright 2003, Paradigm Publishing Inc. .fla filename extension – contain – develop, design, test interactive content  Publish as a flash movie -.swf – browser – plug-in – flash player or shockwave

7. 1-6 OBJ Copyright 2003, Paradigm Publishing Inc. Flash File Types - automatically assigned to the end of the file name - can only be opened in Flash fla - assigned to movies converted to the Flash Player format - can be viewed in any Web browser swf

8. 1-7 OBJ Copyright 2003, Paradigm Publishing Inc. create eye-catching graphics create buttons for a user interface Graphics or other elements can be animated to produce stimulating effects and interactivity.

9. 1-8 OBJ Copyright 2003, Paradigm Publishing Inc. A developer creates the sequence of images or imports images and adds special effects. animation sound video This process is referred to as authoring.

10. 1-9 OBJ Copyright 2003, Paradigm Publishing Inc. The content has to be converted to a format that can be viewed by others. Flash Player included in most Web browsers

11. 1-10 OBJ Copyright 2003, Paradigm Publishing Inc. Flash Content on the Web background color behind the word changes as the mouse rolls over it and a new menu appears images move across the page in a sequence

12. 1-11 OBJ Copyright 2003, Paradigm Publishing Inc. Advantages of Using Flash  Vector Graphics  graphics created in Flash are stored as vectors by default  Streaming Technology  multimedia files begin playing instantaneously as data is being transferred  Ease of Use  easy to learn  Compatibility  movie will display consistently in any operating environment

13. 1-12 OBJ Copyright 2003, Paradigm Publishing Inc. The Flash Screen Title bar Menu bar Toolbox Timeline Stage Property Inspector Workspace Panels Information bar

14. 1-13 OBJ Copyright 2003, Paradigm Publishing Inc. Screen Components  Stage  where you draw objects and/or place items  Workspace  where you practice drawing techniques or place objects that will be animated on or off the stage  Layers - different areas that are stacked onto a flash workspace  Toolbox  contains the tools needed to draw and modify objects

15. 1-14 OBJ Copyright 2003, Paradigm Publishing Inc. Screen Components…/2  Timeline  where layers and frames are controlled  Panels  contain options for controlling or manipulating the objects on the stage  Property Inspector  displays information and options for the active object

16. 1-15 OBJ Copyright 2003, Paradigm Publishing Inc. Drawing Basic Shapes  Click the tool in the Toolbox for the shape that you want to draw  Choose the attributes  line colors, fill colors, line thickness, line styles, and so on  Draw the shape  position crosshair pointer  drag to ending point  release mouse button

17. 1-16 OBJ Copyright 2003, Paradigm Publishing Inc. ToolboxToolbox Arrow Tool (V) Line Tool (N) Pen Tool (P) Oval Tool (O) Pencil Tool (Y) Free Transform Tool (Q) Ink Bottle Tool (S) Eyedropper Tool (I) Hand Tool (H) Black and White No Color Subselection Tool (A) Lasso Tool (L) Text Tool (T) Rectangle Tool (R) Brush Tool (B) Fill Transform Tool (F) Paint Bucket Tool (K) Eraser Tool (E) Zoom Tool (M, Z) Stroke Color Fill Color Swap Colors Options vary depending on active tool

18. 1-17 OBJ Copyright 2003, Paradigm Publishing Inc. Selecting Shape Attributes…/3 hold down the left mouse button and drag to create an oval hold down the Shift key while dragging to create a circle

19. 1-18 OBJ Copyright 2003, Paradigm Publishing Inc. Starting a New Document File, New or Ctrl + N - a new document is created - document on the screen is moved to the background - bottom of Window menu lists open documents File, New from Template - templates included with Flash

20. 1-19 OBJ Copyright 2003, Paradigm Publishing Inc. Selecting Objects Arrow Tool methods: - click object - double-click object - Shift + click - draw a selection box Lasso Tool Subselection Tool draw a lasso around an irregular group of objects click outline to display the points that define the object

21. 1-20 OBJ Copyright 2003, Paradigm Publishing Inc. Creating a Basic Animation  Animation  simulation of movement created by playing a series of slightly different graphics over a period of time at a fast rate  Sequence of images stored in frames  default frame rate is 12 fps (frames per second)  Images created in keyframes  automatically generates copies in the frames between the keyframes  Animate by changing contents at various keyframes

22. 1-21 OBJ Copyright 2003, Paradigm Publishing Inc. TimelineTimeline Frames Current Frame Rate Elapsed Time Frame Numbers Playhead

23. 1-22 OBJ Copyright 2003, Paradigm Publishing Inc. FramesFrames  Ordinary Frames  the frames that Flash generates  the frames between the keyframes  Keyframes  the frames that you create where you modify the images  identified by a dot inside the frame solid dot indicates content empty dot indicates blank frame 1 is automatically considered a keyframe

24. 1-23 OBJ Copyright 2003, Paradigm Publishing Inc. Creating the Animation create the content select the frame in the Timeline Insert, Keyframe

25. 1-24 OBJ Copyright 2003, Paradigm Publishing Inc. Creating the Animation…/2 modify the content for the next portion of the movie repeat inserting keyframes and modifying content as desired

26. 1-25 OBJ Copyright 2003, Paradigm Publishing Inc. Viewing the Movie  Pressing Enter allows you to view the movie's animation  The playhead moves along the Timeline as the movie is being played