Preparing Bitmaps for Flash Flash

Flash is a vector-based application, but that shouldn’t stop you from using bitmaps when you need to use a bitmap. There are many situations in which either the designs or the nature of the client require that photographic images be included in a Flash project. You can import a wide variety of bitmap image types, including .JPEG, .GIF, .BMP, and .PICT using the method described previously.

Considering that it’s a vector-based program, Flash 5 supports bitmap graphics extraordinarily well. However, because the most common use of Flash movies is for Web presentations, you always need to keep file size in mind slower Internet connections still dominate the Web. Here’s what you can do to offset this problem:

  • Limit the number of bitmaps used in any one frame of a Flash movie.
  • Remember that, regardless how many times the bitmap is placed on Stage, the actual bitmap (or its compressed version in the .SWF file) is downloaded during the first occurrence of the bitmap (or its symbol instance).
  • Try spreading out bitmap usage, or hide a symbol instance of the bitmap in an earlier frame before it is actually needed.

Basic tips for preserving bitmap quality
When you choose to use bitmap images, remember that they won’t scale as well as vector drawings. Furthermore, bitmaps will become distorted if your movie is resized so that the bitmap is displayed larger than its original size. Here are a few points to consider so that you can avoid this, or at least minimize the effects:

  • Know your audience and design for the largest screen (at the highest resolution) that your audience may have. (Or, if you deviate from this, know that audience members with optimal equipment will see a low-quality version of your work.)
  • Measure your hypothetically largest image dimensions in pixels. (One way to determine these dimensions is to take a screen capture of your mockup, and then measure the intended image area in Photoshop. Another way is to use the Info Panel.)
  • Create or resize your bitmap image to those hypothetical dimensions. If there are any rotations or skews to be applied, do them within your image-editing application prior to importing into Flash.
  • Import it into Flash at that size, and then scale it down in Flash to fit into your movie.

The advantage of the previous method, or similar methods, is that the movie can be allowed to scale for larger monitors without causing the bitmap images to degrade. The disadvantage is that it will require sending the same large bitmap to all users. A more sophisticated solution is to use JavaScript to detect browser dimensions and then send the appropriate bitmaps to each user. Other, simpler—albeit partial— solutions might include the following:

  • Just don’t let your movie resize!
  • Set the bitmap’s compression to lossless.
  • Trace the bitmap to convert it to a vector graphic.

More about preparing bitmaps
Before sizing and importing bitmaps, you need to consider how you will set the Dimensions for the Flash movie in the HTML tab of the Publish Settings. You also need to know whether the bitmap is to be scaled in a Motion Tween. If the Flash movie scales beyond its original pixel width and height (or if the bitmap is scaled in a tween), then any placed bitmap images will be resized and appear at a lower resolution with a consequent degradation of image quality.

If you are unsure of the final size that you need for a bitmap in Flash, then import a low-resolution version of the image into Flash (being careful not to erase or overwrite your high-resolution version in the process!). Then, make a symbol with a graphic behavior and place the low-resolution bitmap into that symbol. Whenever you need to use the bitmap, place its symbol on the Flash Stage. Then, during final production and testing, after you’ve determine what pixel size is required for the better quality bitmap, create and import a higher resolution image, as follows:

  • Double-click the icon of the original low-resolution bitmap in the Flash Library to access the bitmap’s properties.
  • In the Bitmap Properties dialog, click the Import button and select the new, higher resolution version of the bitmap.
  • Upon reimport, all symbols and symbol instances will update automatically.

Be aware that Flash doesn’t resize (or resample) an image to its viewed or placed size when the Flash movie (.SWF file) is created. We tested the same source image, resized it into two different pixel dimensions, and placed it in two different Flash movies. In both movies, the image was viewed at 200 × 300 pixels. The first version of the image had a 400 × 600 pixel dimension, while the second version had a 200 × 300 pixel dimension exactly half the size of the first. In one Flash movie (we’ll call it Movie A), the first version was imported and resized (using the Info Panel) to the size of the second. In the other Flash movie (Movie B), the second version was imported and placed as is, occupying the same portion of the Flash Stage as Movie A. Even though both Flash movies contained a bitmap of the same view size on the Flash Stage, the resulting .SWF files, which used the same level of .JPEG compression on export, had drastically different file sizes. Movie A was 44.1KB, whereas Movie B was 14.8KB! Movie A is nearly three times larger than Movie B. However, when a view larger than 100 percent was used within the Flash Player, the difference in resolution was readily apparent in the higher quality of Movie A.

All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd Protection Status

Flash Topics