CLASSROOM IN a BOOK® INSTRUCTOR NOTES ADOBE® FLASH® CS3 PROFESSIONAL LESSON 1 2 Adobe Flash CS3 Classroom in a Book Getting Started The lessons in this book require assets, including Flash documents, that are included in the Lessons folder on the book’s CD. Before beginning to work with the les- sons, copy the files to each student’s computer’s hard disk. Though Flash CS3 Professional requires a minimum of 512 MB RAM, Adobe strongly recommends using this book with a computer that has at least 1 GB RAM, especially when using larger video files, as in Lesson 9. You may wish to use all the lessons in this book, or particular lessons. You can use the lessons in any order, but some tools and techniques are described in detail only in the first lesson in which they occur. Introduce students to additional resources, such as Adobe Design Center and Adobe Developer Center, where they can access information provided by other Flash users and by Adobe. LESSON 1 3 Adobe Flash CS3 Classroom in a Book Lesson 1: Getting Acquainted Lesson 1 uses a sample project to provide an overview Describe the difference between inserting a keyframe of the Flash workspace. Students are introduced to the and inserting a blank keyframe. When you insert a Tools panel, Library panel, Property inspector, and keyframe, the keyframe contains the frame’s original Timeline. They also learn about layers and keyframes. contents until you change it. When you insert a blank keyframe, all content is removed from the frame so that Starting Flash and opening a file you can add new content. Demonstrate multiple ways of opening a document in Flash: double-clicking the Flash document in Explorer Using the Property inspector or Finder, starting Flash and choosing File > Open, and Demonstrate that the options in the Property inspector selecting the document from the Welcome screen that change to reflect what’s selected. The Property inspec- appears when you start Flash. tor can display properties for the entire document, the selected frame, or the selected instance of a symbol. Emphasize the importance of saving the working copy Which options are available for an instance depend on of the file to the lesson’s Start folder. In many lessons, whether the symbol is a movie clip, graphic, or button Flash documents reference other asset files, which must symbol. (Symbols are covered in more detail in Lesson be in the same folder as the Flash document. 3.) To apply values you’ve set in the Property inspector, press Enter or Return. Getting to know the work area Identify and describe the following areas of the work- Using the Tools panel space: Timeline, Tools panel, Stage, Library panel, The Tools panel contains several tools for selecting, Property inspector, and the Edit bar above the Stage. drawing, editing, and navigating. Demonstrate that some tools are grouped together, and a tool may be If you have Adobe Creative Suite 3 installed, you can hidden beneath another. To select a hidden tool, click show students the similarities between panels in the triangle in the icon of the displayed tool, and then Flash CS3 and panels in other Creative Suite 3 select the hidden tool from the pop-up menu. applications. The Timeline is similar to the Timeline in Adobe Premiere Pro or Adobe After Effects. Beneath the tools is the tools options area. The options available depend on the selected tool. Demonstrate that Understanding the Timeline the options area changes as you select different tools. Invite students to move the playhead through (or When you select the Rectangle tool, the Object Draw- scrub) the Timeline to see the animation. As you move ing mode icon appears; when you select the Zoom the playhead, Flash displays the contents of the frame tool, the Enlarge and Reduce icons are available; on the Stage. Hide and show different layers on frames when you select the Pencil tool, the Pencil mode to demonstrate how layers are stacked and that each icons are available. frame may contain content from multiple layers. Keyframes are essential in animation. A keyframe in- dicates a change, whether it be in the position or other qualities of something on the Stage or the beginning or end of an audio file. Students will use keyframes in every Flash project, so it’s important that they under- stand the keyframe’s purpose clearly. LESSON 2 4 Adobe Flash CS3 Classroom in a Book Lesson 2: Working with Graphics Lesson 2 uses a sample project to introduce students to Object > Union. You can convert an object to a shape the drawing tools and simple animation. The project is by selecting it and choosing Modify > Break Apart. an animation of a bubbling liquid to be used as a logo or as a preloader. As they create the preloader, students Creating a simple animation learn how to use the Rectangle, Oval, and Line tools; In the lesson, students use a simple motion tween to import a bitmap fill; make selections; group objects; animate a bubble so that it moves from the bottom of and manipulate shapes. They also learn about the dif- the glass to the top, changing size as it does so. You can ference between drawing modes in Flash. also use a Timeline effect to achieve the same result. Timeline effects provide simple animation options. Flash drawing modes To show students an alternative method of animation, By default, Flash uses the merge drawing mode when you demonstrate the Expand effect. (Choose Insert > Time- draw rectangles, ovals, or lines. In merge drawing mode, line Effects > Effects > Expand.) the drawn elements are called shapes. Overlapping shapes merge together to form a single element on the Stage. The Expand effect expands, contracts, or expands and When you select a shape, the selected area appears dotted. contracts objects over time. This effect works best with Though the elements merge together, you can select each two or more objects grouped together or combined in separately. Each side of a rectangle’s stroke is a separate a movie clip or graphic symbol. Objects containing text element, for example. To select a shape’s fill and stroke, or letters work well with this effect. You can expand the drag the Selection tool around the entire shape. duration in frames; expand objects, squeeze them, or both; expand direction; set fragment offset in pixels; In object drawing mode, active when the Object Draw- shift the group center; or change fragment size. ing icon is selected in the options area of the Tools panel, rectangles, ovals, and lines are discrete elements, Breaking objects apart even when they overlap. The discrete elements are In this lesson, lines were created using the object draw- called drawing objects. When you select a drawing ing mode. To delete individual line segments, you need object, its fill and stroke are both selected. to break the lines apart, converting them into shapes. Emphasize for students the difference between shapes In primitive drawing mode, active when you use the and objects in Flash, and the advantage of shapes when Rectangle Primitive or Oval Primitive drawing tools, you want to select shape segments. drawn elements are discrete objects, but you can modify their corner angles or inner radius. Masking objects A Halloween mask hides what it covers; a graphic mask Merge drawing mode offers advantages in creating un- reveals what it covers. Students who have used Adobe usual, complex shapes. Object drawing mode lets you Photoshop may already be familiar with masks. move objects without concern that they will change in relationship to other objects. Primitive drawing mode In this lesson, the mask serves to keep the bubbles in the makes it possible to draw more complex shapes with- glass. The bubbles are revealed only where the mask exists, out having to merge multiple shapes together. so they disappear when they reach the top of the glass. By default, a mask affects only a single layer beneath it, but in Invite students to draw and manipulate elements us- this lesson, students mask multiple layers. In later lessons, ing each of these drawing modes so that they become students will also animate masks to change the amount of familiar with the differences and can recognize them an element that is revealed over time. as they work with them. You can convert a shape to an object by selecting it and choosing Modify > Combine LESSON 3 5 Adobe Flash CS3 Classroom in a Book Lesson 3: Creating and Editing Symbols Lesson 3 uses a sample project to introduce symbols, background of the DVD interface. However, many of instances, and imported Illustrator files as students the same options are available when copying and past- create a DVD interface. Students learn about buttons, ing artwork. If Illustrator is installed on the computer, rollover states, and transparency, as well. open the Illustrator file and copy and paste, or drag and drop, artwork from it to the Stage in Flash to demon- Importing Illustrator files strate how the options are similar. Flash lets you import Illustrator AI files, and to a large extent preserves the artwork’s editability and visual About symbols fidelity. The AI Importer also provides a great degree A symbol is a graphic, button, or movie clip that you of control in determining how Illustrator artwork is create once in Flash and then reuse throughout the imported into Flash, letting you specify how to import document or in other documents. A symbol can in- specific objects into an AI file. clude artwork imported from another application. Any The Flash AI Importer provides the following key symbol that you create automatically becomes part of features: the library for the current document.