A Flash Developer Resource Site

Results 1 to 2 of 2

Thread: Graphics Importing, Publishing Help Needed

  1. #1
    Junior Member
    Join Date
    Dec 2001


    Does anyone have a minute to give me a brief overview of what the best types of graphics (JPEG, GIF, PNG, etc.) to import into Flash are, and what are the best settings to select on each type (Compression, quality, smoothing, etc.)

    I'm looking for the best quality upon publishing as a .swf, not necessarily concerned with file size.

    Thanks for the help!!

  2. #2
    Senior Member RUSHVision's Avatar
    Join Date
    Dec 2000
    Pacific Northwest
    Here is a brief breakdown of the three formats you listed:

    JPEG - Primarily used to photographs or images with a lot of gradients. This is a "lossy" format, which means that during the compression process some of the image information is lost. Extreme compression will produce distortion in the form of weird squiggly lines called "artifacts" and general blurring. These artifacts accumulate each time you save in this format, so you want to make sure you are always saving from the original image instead of working from an image that has been previously compressed. You can create a progressive JPEG file, in which a low-resolution version of the image appears in a browser while the full image is downloading. This format does not support transparency.

    GIF - This one is generally used when you have lots of solid blocks of color. Your image is broken down into a palette of no more than 256 colors and can yield some pretty small file sizes. This format will support transparency, but still not the best choice for images with things such as soft drop shadows. This format is more suited to images with crisp lines, illustrations with sharp color, and text.

    PNG - There are two different kinds of PNGs...PNG-8 and PNG-24. This format supports transparency, but will generally produce slightly larger file sizes than the other JPGs or GIFs. In addition to supporting background transparency and background matting, the PNG-24 format supports multilevel transparency. Multilevel transparency allows you to preserve up to 256 levels of transparency to blend the edges of an image smoothly with any background color. However, multilevel transparency is not supported by all browsers.

    Regarding Bit Depth:

    PNG-8 and GIF support 8-bit color. JPEG and PNG-24 support 24-bit color.

    This is an excerpt from the Photoshop Help file regarding Bit Depth:

    "Bit depth--also called pixel depth or color depth--measures how much color information is available to display or print each pixel in an image. Greater bit depth (more bits of information per pixel) means more available colors and more accurate color representation in the digital image. For example, a pixel with a bit depth of 1 has two possible values: black and white. A pixel with a bit depth of 8 has 28, or 256, possible values. And a pixel with a bit depth of 24 has 224, or roughly 16 million, possible values. Common values for bit depth range from 1 to 64 bits per pixel."

    So, to answer your question...the best file format to use will depend on what kind of image you are using. If you have any kind of transparency, I would recommend using the PNG-24 format. For photographs and other continuous-toned images, I would consider using a JPEG with the amount of compression set fairly low. For logos and line art, the GIF format might be your best choice. If I have questions about which format to use, I will generally try several and see which one gives me the best results. Image Ready makes this easy by providing a preview of your optimized image before you export it along with the projected file size.

    You asked about the compression settings in Flash. Since you are not concerned with file size, I would not mess with these settings at all. I would do all of your image optimization outside of Flash and just use the imported image data. However, there are times when you will want to further adjust the compression settings within Flash, so here is a description of what they do:

    Allow Smoothing - This will smooth the edges of your bitmap with anti-aliasing.

    Compression - You have two choices here. You can either choose either Photo(JPEG) or Lossless(PNG). If you choose Photo, you can either select "Use Document Default Quality" or you can specify a new compression quality setting between 1-100. Lower numbers will yield smaller files, but will result in the loss of more image information. As a related note...the original imported image that resides in your Library will not be altered or modified in any way as a result of changing these settings. It is only the image that gets published with the SWF that gets affected, so don't worry about making permanent changes to your image by playing around with these settings. Choose Lossless(PNG) to publish the image with lossless compression, which discards no image data. To see how the settings you have chosen will look, click the Test button. This will give you a preview of the image and a file size breakdown that tells you how much the image will be compressed and the final file size.
    [Edited by RUSHVision on 12-28-2001 at 02:39 PM]

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts

Click Here to Expand Forum to Full Width

HTML5 Development Center