Printer Friendly Version

BellaOnline's Flash and Animation Editor

How to Import Photoshop Files Into Flash Professional CS3

In the last tutorial, we took a look at the various options you have when importing vector, shape, text and layer styled PhotoshopR images in to FlashR Professional CS3. If you remember, these Photoshop layers can still be edited after importing into Flash. Also you can automatically convert a layer into a movie clip symbol. But, that is only half of the story.

For the rest of the story, we will use the same image from the last tutorial which has these four layers.

1. Bitmap layer with layer style
2. Vector text layer without layer style
3. Vector shape layer with layer style
4. Bitmap layer without layer style

Choose Your Layers

To import an image into Flash, click File, Import to Stage. This will open the Import to Stage dialog box. At the upper left, you will see a hierarchical representation of the layers of the Photoshop image. When we compare this list with the Layers Panel in Photoshop., you can see that Flash has kept the Photoshop layer hierarchy intact. The small icons at the right in each layer will help you remember the layer's contents and you can put a checkmark in the box for each layer that you wish to import. This is a nice feature when you are at the mockup stage. You can use several different layer combinations to create Flash movie mockups from this one source file.

Publish Settings

We have already discussed the import options for each of these layers. Now, let's take a look at the Publish Settings. Go to the right side of the panel just under where we set the import options in the last tutorial and you will see the Publish Settings drop-down menu. This section of the dialog box works much like the Save for Web and Devices feature in Photoshop. Your choices are Lossy and Lossless. Lossy will convert the layer into a JPEG image. Choose this option from the menu and then click on the Calculate Bitmap Size button. Flash will calculate the compressed size of this layer. The Lossless option will convert the layer into a PNG image. Choose this option and calculate again. Depending on the image and your purpose, choose the one that is best for your needs.

Convert Layers To

Now go to the bottom left of the dialog box and the Convert Layers To drop-down menu. In this menu, you have two choices again. The Flash Layers option will put each Photoshop layer on its own Flash layer. The Keyframes option will do the same and will also add a keyframe. For both options, the imported layer is given the same name as the Photoshop layer and will appear in the Flash Library.

Place Layers at Original Position

The next option we have is to Place Layers at Original Position. What does that mean? Most of the time, you have spent much time in Photoshop creating your design and the position of the elements in your design has already been decided. So you will want to keep these elements at the same X and Y coordinates when the image is imported into Flash. If you do not choose this option, the entire layer will be centered on the Flash stage.

Set Stage Size to Photoshop Image Size

The last option is a time saver; especially if you are importing the image as the first step to creating your Flash movie. The default size for a Flash movie is 550 x 400. However, if your image is a different size, you can choose this option and Flash will automatically resize the Stage to match the image.

Flash Timeline, Library Panel and Properties Inspector

Once you have completed the Import to Stage dialog box and imported your image, you will see that each Photoshop layer has indeed been placed on a different Flash layer, has been named the same and has been added to the Library Panel. If you check the Properties Inspector, you will see that the moon layer has been converted to a movie clip with "moon" as the Instance Name.

Flash and Animation Site @ BellaOnline
View This Article in Regular Layout

Content copyright © 2013 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.

| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2016 Minerva WebWorks LLC. All rights reserved.

BellaOnline Editor