1. 3-1 OBJ Copyright 2003, Paradigm Publishing Inc. Working with Layers, Libraries, and Importing Graphics Macromedia Flash Design & Application

2. 3-2 OBJ Copyright 2003, Paradigm Publishing Inc.  Describe the purpose of using layers in a Flash movie. Describe the purpose of using layers in a Flash movie.  Insert, rename, and delete layers. Insert, rename, and delete layers.  Move layers to change the stacking order. Move layers to change the stacking order.  Hide and lock layers. Hide and lock layers.  View objects on a layer as outlines. View objects on a layer as outlines.  Distribute objects to layers. Distribute objects to layers.  Create a mask layer. Create a mask layer.  Create a guide layer. Create a guide layer.  Create a layer folder. Create a layer folder.  Describe the role of libraries, symbols, and instances. Describe the role of libraries, symbols, and instances.  Create and modify symbols. Create and modify symbols.  Create and modify instances of a symbol. Create and modify instances of a symbol.  Convert an existing graphic to a symbol. Convert an existing graphic to a symbol. Performance Objectives

3. 3-3 OBJ Copyright 2003, Paradigm Publishing Inc.  Insert symbols from another movie's library and from a common library. Insert symbols from another movie's library and from a common library.  Create a library file with your own reusable objects. Create a library file with your own reusable objects.  Import a bitmapped image to Flash and adjust the bitmap properties. Import a bitmapped image to Flash and adjust the bitmap properties.  Break up and edit a bitmapped image. Break up and edit a bitmapped image.  Use a bitmapped image as a fill for a closed shape. Use a bitmapped image as a fill for a closed shape.  Convert a bitmap image into a vector graphic. Convert a bitmap image into a vector graphic.  Copy and paste graphics from other sources to Flash using the Clipboard. Copy and paste graphics from other sources to Flash using the Clipboard.  Import a FreeHand vector image and a Fireworks bitmap image to Flash. Import a FreeHand vector image and a Fireworks bitmap image to Flash.  Optimize a vector object. Optimize a vector object.  Describe sources of images for importing to Flash. Describe sources of images for importing to Flash.  COMMANDS REVIEW COMMANDS REVIEW Performance Objectives

4. 3-4 OBJ Copyright 2003, Paradigm Publishing Inc. Organizing Content with Layers  Organize images, sounds, videos, animations, or any other elements  Complex movies with many layers can also be organized with layer folders  similar to the process you use to organize the data files on your computer  Layers operate in a similar manner as stacked transparencies on an overhead projector  Name layers with descriptive titles  makes finding and editing easier  Layers are stacked with the topmost layer in the Timeline overlapping objects within the layers below it  The layer hierarchy is referred to as the stacking order

5. 3-5 OBJ Copyright 2003, Paradigm Publishing Inc. Multiple Layers in Flash Manage layers in this section of the Timeline panel. Active layer Each layer has its own set of frames. Scroll bars to scroll frames and layers. Each object on the stage is controlled separately through its corresponding layer. Each object on the stage is controlled separately through its corresponding layer.

6. 3-6 OBJ Copyright 2003, Paradigm Publishing Inc. Layer Management Tools Pencil indicates the layer that is being edited. Show/Hide All Layers Lock/Unlock All Layers Show All Layers as Outlines Delete Layer Insert Layer Folder Add Motion Guide Insert Layer Double-click layer icon to display Layer Properties dialog box.

7. 3-7 OBJ Copyright 2003, Paradigm Publishing Inc. Inserting Layers Each new Flash document contains one layer named Layer 1. New layers are inserted above the active layer. Insert Layer button OR Insert, Layer Right-click, Insert Layer

8. 3-8 OBJ Copyright 2003, Paradigm Publishing Inc. Renaming Layers double-click the current layer name, key the new layer name, press Enter

9. 3-9 OBJ Copyright 2003, Paradigm Publishing Inc. Deleting a Layer Deleting a layer removes the layer from the Timeline as well as any content on the stage that is associated with the layer. Delete Layer button OR Right-click, Delete Layer If you delete the wrong layer by mistake, use the Undo feature to restore the content to the stage. If you delete the wrong layer by mistake, use the Undo feature to restore the content to the stage.

10. 3-10 OBJ Copyright 2003, Paradigm Publishing Inc. Using the Clipboard Objects can be cut or copied and then pasted to layers. Edit, Cut or Ctrl + X MOVING select the object first Edit, Paste or Ctrl + V Edit, Copy or Ctrl + C COPYING select the object first Edit, Paste or Ctrl + V

11. 3-11 OBJ Copyright 2003, Paradigm Publishing Inc. Moving a Layer layer is moved in the Timeline point to layer name or layer icon and drag to desired location -gray bar indicates where layer will be repositioned

12. 3-12 OBJ Copyright 2003, Paradigm Publishing Inc. Hiding and Locking Layers Red Xs indicate the layers are hidden. This layer is locked. Show/Hide All Layers Lock/Unlock All Layers Solid black dots indicate the layer is not hidden or locked. Hiding Layers - to temporarily remove the display on the stage of all content or content on individual layers Locking Layers - to prevent changes to objects on all layers or individual layers

13. 3-13 OBJ Copyright 2003, Paradigm Publishing Inc. Viewing Objects as Outlines Color-coded to the layer - allows you to see which objects are associated with the layer if you cannot remember These layers are displayed as outlines. This layer is not in Outline mode. Objects in Outline mode.

14. 3-14 OBJ Copyright 2003, Paradigm Publishing Inc. Distributing Objects to Layers Used to split objects on a single layer into separate individual layers. Modify, Distribute to Layers or Ctrl + Shift + D Flash will create a new layer for each separate selected object. Each new layer is named Layer # where # is the next layer number in sequence.

15. 3-15 OBJ Copyright 2003, Paradigm Publishing Inc. Creating a Mask Layer A masked layer partially conceals objects in the linked layer immediately below the mask. Filled objects on the mask layer provide the window with which overlapped objects below the mask filter through to the stage. layer immediately below mask layer Mask Layerappears on the stage

16. 3-16 OBJ Copyright 2003, Paradigm Publishing Inc. Creating a Mask Layer…/2  Insert the content  Insert a new layer  Draw filled objects overlapping the content  Right-click the new layer  Click Mask

17. 3-17 OBJ Copyright 2003, Paradigm Publishing Inc. Creating a Mask Layer…/3 Both the mask layer and the lower layer are automatically locked. Mask icons

18. 3-18 OBJ Copyright 2003, Paradigm Publishing Inc. Creating a Guide Layer -used to assist with the placement and alignment of objects in the authoring process -not exported when the movie is published Guide -used to direct the path along which a connected object on another layer will travel during an animation -is exported when the movie is published but is not visible to the end user Motion Guides Flash includes two types of layers that can assist with the placement of objects.

19. 3-19 OBJ Copyright 2003, Paradigm Publishing Inc. Creating a Guide Layer…/2 designate the layer as a guide insert a new layer and draw lines or shapes that will be used for alignment purposes

20. 3-20 OBJ Copyright 2003, Paradigm Publishing Inc. Creating a Guide Layer…/3 Resize object so it fits within the guide.

21. 3-21 OBJ Copyright 2003, Paradigm Publishing Inc. Layer Properties Dialog Box Modify, Layer Alternate method for working with layers.

22. 3-22 OBJ Copyright 2003, Paradigm Publishing Inc. Creating a Layer Folder Related layers can be grouped together and moved below a layer folder in the Timeline. Insert Layer Folder Layer folder Click here to collapse layer list for the Graphics folder. Drag the Timeline panel's blue border up or down to decrease or increase the panel's height. These three layers are grouped within the Graphics layer folder.

23. 3-23 OBJ Copyright 2003, Paradigm Publishing Inc. Libraries – Symbols and Instances  Every Flash document includes a library which is used to store reusable objects  symbols, imported bitmaps, sound files  A symbol is any object that you want to reuse in either the current movie or another movie  drawn object, text block, button, movie clip, imported logo  created or converted  becomes master copy of the object  Each occurrence of a symbol on the stage is called an instance  can be modified

24. 3-24 OBJ Copyright 2003, Paradigm Publishing Inc. Advantages of Using Symbols  Can be reused many times  drag from Library panel to stage  more efficient than copying and pasting  Can be reused in other movie files  File size is greatly reduced  stores information about the master copy of the symbol once  Changes made to the master copy automatically updates each instance  reduces time  ensures consistency

25. 3-25 OBJ Copyright 2003, Paradigm Publishing Inc. Creating a Symbol Insert, New Symbol or Ctrl + F8 key a descriptive name animation that has its own timeline interactive object created or imported

26. 3-26 OBJ Copyright 2003, Paradigm Publishing Inc. Symbol Editing Mode Symbol name Registration Point -draw object around this center point, move it after drawn, or cut and paste to exit OR Edit, Edit Document or Ctrl + E click Back button click Scene number

27. 3-27 OBJ Copyright 2003, Paradigm Publishing Inc. Inserting and Modifying an Instance Window, Library or F11 click name drag from Preview pane to stage Inserted instances can be modified without affecting the master copy of the object.

28. 3-28 OBJ Copyright 2003, Paradigm Publishing Inc. Editing a Symbol  Double-click any of the instances of the symbol on the stage  opens symbol editing mode  make required changes to master copy  exit symbol editing mode  other instances automatically updated or  Right-click the symbol name in the Library panel  click Edit at the shortcut menu  opens symbol editing mode  make required changes to master copy  exit symbol editing mode  other instances automatically updated

29. 3-29 OBJ Copyright 2003, Paradigm Publishing Inc. Converting an Existing Object to a Symbol Insert, Convert to Symbol or F8 select the object first

30. 3-30 OBJ Copyright 2003, Paradigm Publishing Inc. Inserting Symbols from Another Movie's Library File File, Open as Library or Ctrl + Shift + O navigate and double-click file name background of another movie's library panel is displayed in gray When you drag an instance to the stage, Flash automatically inserts a copy of the symbol in the current movie's library.

31. 3-31 OBJ Copyright 2003, Paradigm Publishing Inc. Inserting Symbols from Common Libraries Flash includes common library files containing objects that you are free to use. Window, Common Libraries When you drag an instance to the stage, Flash automatically inserts a copy of the symbol in the current movie's library.

32. 3-32 OBJ Copyright 2003, Paradigm Publishing Inc. Creating Your Own Common Library  Create the symbols you want to store  If you convert existing objects to symbols, delete the symbols from the stage after conversion  leaving copies on the stage uses unnecessary disk space  Use Save As  descriptive file name  C:\Program Files\Macromedia\Flash MX\First Run\Libraries  Exit Flash

33. 3-33 OBJ Copyright 2003, Paradigm Publishing Inc. Library Management Group related symbols in folders that can be expanded and collapsed in the Library panel. Toggle Sorting Order Wide Library View Narrow Library View Delete Properties New Folder New Symbol

34. 3-34 OBJ Copyright 2003, Paradigm Publishing Inc. Importing Graphics from Other Sources File, Import or Ctrl + R You may want to insert pictures created outside Flash. e.g. company logo, digital or scanned picture click to choose the file format of the graphic which you want to import Imported bitmap images are automatically stored in the movie's library and a copy of the image is inserted in the active layer on the stage. Use pictures sparingly.

35. 3-35 OBJ Copyright 2003, Paradigm Publishing Inc. Bitmap Properties Each imported bitmap has a set of properties associated with it. select file name click Properties button

36. 3-36 OBJ Copyright 2003, Paradigm Publishing Inc. Bitmap Properties…/2 controls the file size -use Lossless for bitmaps with uncomplicated objects and few color variations deselecting causes the Quality text box to appear 100 is the highest quality click to view the change in picture quality and file size controls the quality -antialiasing is where jagged edges are smoothened by surrounding the edges with shades of gray or color

37. 3-37 OBJ Copyright 2003, Paradigm Publishing Inc. Breaking Apart and Editing Colors in a Bitmap Modify, Break Apart or Ctrl + B A bitmapped image can be broken apart and then edited. Magic Wand Modifier Magic Wand Properties Lasso Tool + a higher number indicates a wider breadth of colors

38. 3-38 OBJ Copyright 2003, Paradigm Publishing Inc. Using a Bitmap as a Fill  Draw the shape to be filled  Import and break apart bitmapped image  Click Eye Dropper tool and click broken apart bitmap  Eye Dropper tool changes to Paint Bucket tool  Click Paint Bucket over shape to fill  Delete broken apart bitmap

39. 3-39 OBJ Copyright 2003, Paradigm Publishing Inc. Converting a Bitmap to a Vector Graphic Flash converts a bitmap to a vector graphic by analyzing the pixels in the bitmap and then creating vector shapes from adjacent pixels that are considered to be the same color based on the color threshold setting. Modify, Trace Bitmap two adjacent pixels are considered the same color if their RGB values are less than the value entered here progress bar indicates progress of conversion

40. 3-40 OBJ Copyright 2003, Paradigm Publishing Inc. Importing Bitmaps Directly to the Library File, Import to Library imports a bitmap directly to the current movie's library -does not place a copy on the stage

41. 3-41 OBJ Copyright 2003, Paradigm Publishing Inc. Copying and Pasting Images Using the Clipboard  Images can be inserted into Flash using the standard Windows copy and paste commands  in the source application select the graphic and click Edit, Copy  switch to Flash and click Edit, Paste  Flash pastes a bitmap as a grouped object on the stage

42. 3-42 OBJ Copyright 2003, Paradigm Publishing Inc. Importing a FreeHand Vector Graphic  After selecting the file name in the Import dialog box, the FreeHand Import dialog box appears  control over how layers and pages are converted in the Flash movie

43. 3-43 OBJ Copyright 2003, Paradigm Publishing Inc. Importing Other Vector Graphics Files  Adobe Illustrator vector graphics can be imported into Flash with control over the placement of layers  after importing, ungroup all of the objects in order to edit  Other vector graphics can be imported by converting to the Flash swf player format in the source program

44. 3-44 OBJ Copyright 2003, Paradigm Publishing Inc. Importing a Fireworks Drawing into Flash  Fireworks graphics can be imported by converting to Flash as png files with layers and editable objects intact or as a single flattened bitmapped object

45. 3-45 OBJ Copyright 2003, Paradigm Publishing Inc. Optimizing Graphics Modify, Optimize or Ctrl + Alt + Shift + C Optimize vector graphics within Flash to reduce file size and increase processing efficiency. drag the slider to increase or decrease the amount by which you want Flash to optimize the object message appears indicating the amount of reduction that has taken place

46. 3-46 OBJ Copyright 2003, Paradigm Publishing Inc. Sources for Artwork for Flash Artwork can be downloaded from the Internet for free or for a small fee. Always read the policies carefully before downloading a free graphic for use in a Flash movie. privacy policy terms of use policy

47. 3-47 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you break apart a bitmap? Modify, Break Apart or Ctrl + B

48. 3-48 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you copy a selected object? Edit, Copy or Ctrl + C

49. 3-49 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you convert a bitmap to a vector graphic? Modify, Trace Bitmap

50. 3-50 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you convert an object to a symbol? Insert, Convert to Symbol or F8

51. 3-51 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you create a new symbol? Insert, New Symbol or Ctrl + F8

52. 3-52 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you cut a selected object? Edit, Cut or Ctrl + X

53. 3-53 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you display the Common Library panel? Window, Common Libraries

54. 3-54 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you display the Library panel? Window, Library or F11

55. 3-55 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you distribute objects to layers? Modify, Distribute to Layers or Ctrl + Shift + D Flash will create a new layer for each separate selected object. Each new layer is named Layer # where # is the next layer number in sequence.

56. 3-56 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you exit symbol editing mode? to exit Edit, Edit Document or Ctrl + E

57. 3-57 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you import graphics? File, Import or Ctrl + R click to choose the file format of the graphic which you want to import

58. 3-58 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you import graphics to the library? File, Import to Library imports a bitmap directly to the current movie's library -does not place a copy on the stage

59. 3-59 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you insert a layer? Insert Layer button OR Insert, Layer Right-click, Insert Layer

60. 3-60 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you insert a layer folder? Insert Layer Folder

61. 3-61 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you change the layer properties? Modify, Layer

62. 3-62 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you open the library from another movie? File, Open as Library or Ctrl + Shift + O navigate and double-click file name

63. 3-63 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you optimize a selected object? Modify, Optimize or Ctrl + Alt + Shift + C

64. 3-64 OBJ Copyright 2003, Paradigm Publishing Inc. Commands Review How do you paste an object from the Clipboard? Edit, Paste or Ctrl + V

65. 3-65 OBJ Copyright 2003, Paradigm Publishing Inc. Creating Animation and Guidelines for Flash Project Design Coming Next