Working with Bitmaps


Bitmaps can add visual depth and texture to your Flash project. Used in moderation, they can make all the difference in your visual design. They can also be the focus of an application, as in a slide show or picture gallery. Flash supports several bitmap file types, including JPEG, GIF, and PNG. If you have Quicktime installed, you can also import PSD, TIFF, and SGI files.

Importing Bitmaps

There are a couple of ways to bring bitmaps into your Flash project: Import them to the library or directly to the stage. To import to the stage choose File, Import, Import to Stage and select the file you want. You can also open an external library and drag the image to the stage.

Tip

When you import a bitmap directly to the stage, you might find that the image is much bigger than the stage. Before resizing the image, position it so that the upper-left corner is on the stage. Otherwise, you might have to do quite a bit of scrolling to find the reduced image.


Compressing Bitmaps

When authoring with Flash, you should be concerned about file size. Bitmaps can bloat your project, but you can shave off some of that file size within the Flash authoring environment.

In the library, right-click on the bitmap name and select Properties, or click on the Properties icon (the white i with a blue circle around it) at the bottom of the library panel. This brings up the Bitmap Properties panel (see Figure 9.5).

Figure 9.5. Bitmap Properties panel.


To compress the bitmap with the Bitmap Properties panel, uncheck the Use Document Default Quality option. Then select a compression type, check the Allow Smoothing option, and choose either Test or Update. The Photo (JPEG) compression setting results in lost pixels, so be sure to save a version you can revert to before proceeding. The Lossless PNG/GIF compression setting is best for traced bitmaps (see the next section) or bitmaps with simple shapes and few colors. You can achieve significant file size improvements with this technique. If your imported bitmap has already been compressed, you might want to go with the PNG/GIF option. If you've got a JPEG without any previous compression, you might want to go with double compression. This is something with which you need to experiment. There's a delicate balance between file compression and artistic integrity. If you overcompress your bitmap images, they will look terrible.

Tracing Bitmaps

There may be times when you need to work with a logo or flat artwork in a Flash project. You might receive this artwork as bitmap files that are smaller than you need for your project. As discussed previously, you can end up with ugly pixilated images if you resize them larger than the originals. Figure 9.6 shows a bitmap image that's been enlarged and looks pixilated.

Figure 9.6. Enlarging a bitmap can result in a distorted pixilation effect.


In such a case, it might be best to trace the bitmap. By using the Trace Bitmap command, you can convert a bitmap into a vector image. To trace a bitmap, Select its instance on the stage and then, from the main menu, go to Modify, Bitmap, Trace Bitmap to open the Trace Bitmap panel (see Figure 9.7).

Figure 9.7. Trace Bitmap panel.


When tracing bitmaps, there are several parameters to set. Each of these options enables you to control the quality of the resulting image and optimize for file size:

  • Color Threshold This setting determines how much color detail is preserved. The lower the threshold (from 1 to 500), the more colors are used.

  • Minimum Area This setting determines how many pixels should be included in the area for normalization. During a trace, the continuous range of colors in a bitmap is replaced with discrete areas of colors. The lower the minimum area, the more detailed the traced image will be.

  • Curve Fit This setting determines how closely the traced curves follow the original image.

  • Corner Threshold Much like curve fit, the corner threshold determines how precisely the traced image follows the original image.

If you set your resolution high with these four parameters, be prepared to wait a while. It's very processor intensive.

Optimizing Traced Bitmaps

Recall how the data is organized in a bitmap image: as a grid of colored dots (or pixels). When Flash traces a bitmap, it converts the data, pixel by pixel, and simplifies it into shapes of color bounded by lines and curves, essentially converting the bitmap into a vector graphic (see Figure 9.8).

Figure 9.8. Tracing a bitmap to a vector graphic.


Because tracing a bitmap results in complex shapes, it is important to reduce the complexity and smooth out the curves of these shapes when working with traced bitmaps. Smoothing the curves reduces the number of anchor points needed to describe the shapes in the image. This process is called optimization.

To optimize the curves of a traced bitmap, select the image or a portion of the image, and use the Optimize Curves panel by choosing Modify, Shape, Optimize. In this panel, you can set the level of smoothness desired, determine whether you want multiple passes to execute (which slows down the process, but can result in less distortion of the image), and indicate whether you want a report after the optimization is completed. If you've set the main toolbar to be visible in your workspace, you can click directly on the Smooth or Straighten buttons.

Note

I'm always looking for ways to keep the file size down, but sometimes traced images just look great! However, you've got to keep the end user in mind. Optimize those traces! A traced bitmap that hasn't been optimized can result in an even larger file than the original bitmap.


Can you further optimize a traced bitmap without losing too much image quality? Of course! One technique to try is to use the selection tool to select a rectangular or oval area on the edge of the image. Then smooth the curves of the selected area. Large shapes can be selected individually and smoothed. This can be tedious work, but selective optimization can pay off with a much smaller file size.

Breaking Apart Bitmaps

Breaking apart bitmaps makes the pixels available to be edited in the Flash authoring environment while preserving the clarity of the bitmap image. You might find this useful if you want to change the color of certain parts of the image. After the bitmap has been broken apart, you can manipulate it with tools such as the Eraser and the Paint Bucket. To change the color of part of the image, select the original with the Lasso or Magic Wand tools, and fill the area with the new color.

Another use for breaking apart a bitmap is to knock out the background of a figure or object. Zoom in on the image to gain more precise control over what pixels are masked with the eraser tool. The process doesn't actually get rid of the pixels and therefore doesn't reduce the file size, so you may want to do your knock-out processing before bringing the image into Flash.



Special Edition Using Macromedia Studio 8
Special Edition Using Macromedia Studio 8
ISBN: 0789733854
EAN: 2147483647
Year: 2003
Pages: 337

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net