Dawn Pedersen Art Institute

Introduction Prior to Flash CS3, the movement of Illustrator and Photoshop documents into Flash was difficult. At that time, Flash was developed by Macromedia and the other two were developed by Adobe. With the purchase of Macromedia by Adobe, all this has changed. Flash lets you import Illustrator and Photoshop files directly into Flash. Flash typically allows you to edit each piece of imported artwork after it is imported.

Importing Illustrator CS4 Documents Illustrator is a vector-based illustration application Vector graphics is the use of geometrical primitives such as points, lines, curves, and shapes, based on mathematical equations, to create images—Flash works in vectors too. Illustrator uses layers just like Flash does Illustrator allows you to apply special effects, like a drop shadow, to individual pieces of a composition

Importing Illustrator CS4 Documents The Illustrator File Importer in Flash provides you with a great degree of control in determining how your Illustrator artwork is imported You can specify which layers and paths will be imported, and what type of graphic each will be in Flash (e.g. a movie clip symbol)

Importing Illustrator CS4 Documents Here are some more key features of the Illustrator File Importer: Preserves editability of commonly-used Illustrator effects Preserves editability of gradient fills Preserves the number and position of Bezier control points, the fidelity of clipping masks, and object transparency

Importing Illustrator CS4 Documents Here are some things to keep in mind: Flash supports only the RGB color space; if the Illustrator image is in CMYK (for print), you’ll need to convert the file to RGB in Illustrator first To preserve drop shadow, inner glow, outer glow, and Gaussian blur effects in Illustrator, import the objects to which these filters are applied as movieclips

Illustrator File Import 1. Create a new Flash document. 2. Import x-factor.ai into the Flash library (File > Import > Import to Library…) 3. The import dialog box will appear—review the items available for import: Each of three layers is visible, along with its associated paths The star layer contains a drop shadow, so Flash has assigned that to become a movie clip

Illustrator File Import 4. Select the blades and sail layers (not the paths). 5. Select Create movie clip. 6. Because we won’t be doing any ActionScript, we don’t need to create any instance names. 7. For the Convert layers to: dropdown, select Flash Layers. 8. Click OK.

Working with an Imported Illustrator File 1. To move your imported file onto the stage, simply click-and-drag the x-factor.ai graphic symbol from the library onto the stage. 2. To edit the symbol, double-click on the image on the stage. 3. Notice how the Flash layers reflect the layers from the Illustrator file. 4. Right-click (Mac: Control-click) on the first frame of the star layer, and select Create Motion Tween.

Working with an Imported Illustrator File 5. Drag the right edge of the new motion tween over to frame Click in frame 10 of the star layer. 7. Select the Free Transform tool. 8. Hold the shift key (to constraint the angle,) and rotate the star 90 degrees clockwise. 9. Click in frame 20 of the star layer. 10. Hold the shift key (to constraint the angle,) and rotate the star another 90 degrees clockwise.

Working with an Imported Illustrator File 11. Click-and-drag from frame 20 in the blades layer down to frame 20 in the sail layer. 12. Press F5 to insert a frame. 13. Press the Enter key (Mac: Return) to test the animation. The star should spin around half- way. 14. Return to Scene 1 (just below the document tab.) 15. Click in frame 20 of Layer Press F5 to insert a frame. 17. Test the movie.

Importing Photoshop CS4 Documents As with Illustrator CS4, the process of importing layered Photoshop documents has been streamlined. Photoshop typically creates graphics in bitmap/ raster format (pixel-by-pixel drawings) Photoshop uses layers just like Flash does Photoshop allows you to apply special effects, like a drop shadow, to individual layers of a composition

Photoshop File Import 1. Create a new Flash document. 2. Import banner.psd onto the Flash stage (File > Import > Import to Stage…) 3. The import dialog box will appear—review the items available for import: Two text layers Five image layers

Photoshop File Import 4. There are two new options at the bottom: Place layers at original position—ensures the contents of the Photoshop file retain the exact position they had in Photoshop Set stage to same size as Photoshop canvas—when the file is imported, the Flash stage will be resized to the dimensions of the Photoshop document

Photoshop File Import 5. Hold down the Shift key and click the first two layers to select them. The Merge Layers button lights up. This means you can combine the selected layers into one layer. This works for adjacent layers only. 6. Deselect the layers. 7. Click the check box beside the first layer. This tells Flash to ignore importing that layer. 8. Reselect the check box.

Photoshop File Import 9. Click the name of the first layer. The import options appear on the right side of the dialog box. Notice that the importer recognized that this is a text layer. You have three choices as to how the text will be handled. You can put the selection in its own movie clip. 10. Select the Editable text import option.

Photoshop File Import 9. With the first text layer still selected, click the check box for Create movie clip for this layer. Notice the placement of a movieclip icon on the layer strip. 10. Enter Headline as the Instance name. 11. Click the David layer. Notice how the import options changed for a bitmap. 12. Select Bitmap image with editable layer styles so that it maintains layer transparency.

Photoshop File Import 13. Shift-click each of the remaining four bitmap layers to select them all at once. 14. Select the Create movie clips for these layers option. 15. Click OK to complete the import. 16. Review the individual imported Flash layers, and the symbols located within the banner.psd Assets library folder.

Working with Logos 1. Go to 2. Find a logo you like and click to go to its individual page. 3. Click on Download and make note of what type of file is offered (AI for Illustrator, PS for Photoshop, PDF for Acrobat, EPS for a more generic vector format.) 4. Agree to the terms of use, etc. until you execute the download.

Working with Logos 5. If the file is EPS or PDF, open it in Illustrator and save it as an Adobe Illustrator (.ai) file. 6. For either AI, PDF, or EPS files, open them in Illustrator and convert them to RBG before import (File > Document Color Mode > RGB Color) 7. Create a new Flash file. 8. Import the logo to your Flash stage, using your new knowledge of the Import dialog box options.