Wednesday, May 25, 2011

Flash Assignment 5 – Importing Artwork

Photo credit: Jay Kleeman, uploaded via Flickr, Creative Commons License


5.1 Importing JPEG Files:

A bit of review here.  In this section we revisit the topics of importing assets to the library, dragging and dropping to the stage, using layers, ruler guides and resizing.


5.2 Importing GIF Files:

The GIF file is an olde tyme graphics file format that is still used to some extent for simple images that lack the complexity of something like a photograph.  The principal shortcoming of the GIF is that it is limited to 256 colors.  However, the GIF file format does support animated images, and also supports pixel transparency, making it a viable format for some use cases. 

In this exercise, we make use of the swap feature alluded to earlier.  We have an example of a JPG image that was converted to a movie clip object and then incorporated into a Flash project with a motion tween.  Upon review, it is decided that the project will benefit if the JPEG image is converted to a GIF, and the white background is pixels are replaced with transparent pixels.  We do not venture into the machinations of how this is accomplished, as that is beyond the scope of this exercise.  The point is, having made that modification to the image, we do not need to recreate the movie clip object and the motion tween with the new GIF image. 

Having imported the new GIF into our library (File => Import => Import to Library), we simply double click on the movie clip object in our library to enter symbol editing mode.  Then, we select the JPEG image within the movie clip that we want to replace.  Once selected, we can utilize the swap button within the properties panel.  This provides us with a dialogue box that allows us to select another object from the library to take the place of the JPEG that we want to replace.  Selecting our newly-imported GIF, we now have our new-and-improved movie clip intact.  Presto!

5.3 Importing PNG Files:

The PNG file format is another popular graphics file format in use today.  PNG (Portable Network Graphic, or PNG’s Not GIF) has the advantage of supporting transparency, like GIF images do, but also has the capacity to render millions of colors, like JPEG.  In addition, PNG uses lossless compression techniques, which preserves image quality.

Flash fully supports the use of PNG graphics.  Importing this type of image to the library or stage is accomplished in the same way as with other image formats.

5.3, 5.4 Importing Artwork from Adobe Photoshop/Illustrator:

In the examples above, Flash imports graphic files as single-layer bitmapped images.  This may be fine for something like a simple photograph, which is nothing more than a single layer bitmap anyway.  However, as we have seen in our lessons on creating and modifying artwork in Flash, graphic images may often be made up of many separate layers, and each layer itself may be composed of several independent vector objects.  Importing such a complex image into Flash as a single-layer bitmap would clearly be limiting, as it would prevent the image from being further manipulated or animated in the way it might otherwise be in a Flash movie. 

Fortunately, if one has used another Adobe Creative Suite application such as Photoshop or Illustrator to produce artwork, those files can be imported to into Flash directly from their native file format, and elements such as editable text and layers can be preserved.

The import process is similar to those described above, however one is prompted with a dialogue box allowing one to choose how the target graphic files are translated into Flash.  For instance, One can elect to preserve the layer structure in a piece of artwork, converting each to a Flash layer.  Alternatively, each layer in a Photoshop or Illustrator image could be converted to a keyframe in a Flash movie clip.  Editable text can also be preserved, or converted to a vector shape.  Sadly, it appears that individual vector objects may not be preserved; vector graphic objects are converted to bitmaps, so they lose their individual identity and my not be resized or deformed.  Apparently, the seamlessness of transitioning from Photoshop or Illustrator to Flash has some room for improvement.  

The Import Photoshop Document dialogue box.

No comments:

Post a Comment