Compressing Flash swf's for html pages

Posted on 2011-09-13
Last Modified: 2012-05-12
I have some flash swfs on a website that I need to compress. I placed the images in photoshop and made them the size I wanted. Then imported the layers into the flash library. After that, I used the images in movie clips to make the animation. Aside from that I have done nothing to compress as I do not know how to shrink the files further. The main swf on the first page is 10mb. It takes a while to load. I am planning on adding a preloader (in as 2.0) but have not figured out how to add one yet. The other swfs throughout the site range from 128kb to 1.1 mb. Once those have loaded once then they don't take long to load when I go back to that page again. Also, the background is a png because they wanted it transparent and a jpg kept giving me a solid background. This is the site where you can see my files:

I have been researching online for tips on compressing but there are so many I am tired of searching and wanted to know the best, quickest way.

Thanks in advance for your help.
Question by:designrox
  • 4
  • 3
  • 2
  • +1
LVL 70

Expert Comment

by:Jason C. Levine
ID: 36534141
Hi designrox,

What DPI are the images?  There's no way this should be 10 megs...
LVL 19

Accepted Solution

quizengine earned 400 total points
ID: 36534623

I grabbed the swf from the website and decompiled it into a fla.

You have the image quality settings at their highest - 100%. There's nothing wrong with that if you want the best quality, but the price you pay is higher filesize.

Image compression is very good at removing detail that we don't notice, so I suggest you do some experiments with lower quality settings and see what's what. Even a small amount of image compression (2-5%) can yield a big drop in filesize and no appreciable change in image quality.

To edit the image quality settings, go to your library panel, select a bitmap (icon = pic of a tree), right click it and you will see the Bitmap properties panel. Make a small change to the compression settings. Do this for each of the images, then publish your swf and evaluate it.

If you don't see any change in image quality, but are paranoid that someone else might, do a 'blind taste test' where you run three swfs (each with different quality settings) onscreen at once, and ask someone else to tell you which quality settings are which. If you make small changes to the settings I bet you they'll not be able to tell.

Assisted Solution

Jen0910 earned 100 total points
ID: 36536136
Flash will only display at screen resolution, 72dpi. I'd go back into photoshop and make sure your image resolutions are 72 (image-->Image size), and re-export all of your jpeg's with the SAVE FOR WEB setting, not just save as a jpeg. Save for web will compress specifically for the web, and give you a much smaller file size as well as other controls, which is what you need. That will significantly help your flash file size to begin with.

Once you have your images within flash, you can use the process quizengine mentions, drop the image quality settings. I have not noticed much difference between 100% and 80% in flash, so I usually start at 80% and go down until i get to an unacceptable quality ;) You can also drop the overall quality in the Publish Settings dialog box.
Does Powershell have you tied up in knots?

Managing Active Directory does not always have to be complicated.  If you are spending more time trying instead of doing, then it's time to look at something else. For nearly 20 years, AD admins around the world have used one tool for day-to-day AD management: Hyena. Discover why


Author Comment

ID: 36537360
The photoshop file I used to lay out the images before importing them is 72 pixels/inch. Since I needed all of the images I just used one file and put each item in a different layer, then used the import to library feature in flash and imported the layers I wanted from my file. So I thought I had done ok with image size. I will try what quizengine said as I cannot go back and reexport everything at this point.

What is the best way to bring in an image into flash without the background? I thought saving for web as a jpg would give it a white background and then I would have to go through all the trouble of deleting that in flash again. Are pngs or gifs better?

Thanks for the help everyone.

Expert Comment

ID: 36537401
Save for web as a PNG with no background. When you import layered photoshop PSDs you are not compressing anything at all-I would avoid doing that. GIFs are smaller files but you will see significant quality differences.

Always Save For Web with flash when its destination is a website/web advertisement.
LVL 19

Expert Comment

ID: 36537471
PNGs and the best to import to Flash as they preserve any transparencies you set.

I always choose *not* to compress my images before importing into Flash. This way, I can control the quality / compression levels through the Bitmap properties and Publish settings in Flash. This keeps my options open and I should never have to reimport files again.

Expert Comment

ID: 36537795
Ha, I'm exactly the opposite. Flash compression is not the best for the visuals. You can compress out of photoshop and aim for the same file size you get with compression in flash, and the compressed image out of photoshop is going to look better. I always aim for the least amount of compression in flash as possible. As long as you know the destination and what you want out of your project, that's never a problem. There's also the "update" button in the flash Library panel if you ever want to change/update the image so you dont have to re-do everything you've done with it in flash.

Preferences, preferences, preferences ;)

Author Comment

ID: 36538087
When I go to the bitmap properties, the compression says Losless png/gif and it says it's 50% or less of the original. If I change it to jpg then I can change it to a different percentage. Should I change them all to jpg?

Author Comment

ID: 36538245
I went ahead and changed them to jpg and set the quality at 70% and my main file is now 1.1 mb. THANKS YOU GUYS!!!!

Author Closing Comment

ID: 36538254

Featured Post

Is Your AD Toolbox Looking More Like a Toybox?

Managing Active Directory can get complicated.  Often, the native tools for managing AD are just not up to the task.  The largest Active Directory installations in the world have relied on one tool to manage their day-to-day administration tasks: Hyena. Start your trial today.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

For those who don't know, Adobe Dreamweaver is a popular commercial web editor that enables you to design, build and manage complex websites. The editor is a WYSIWYG (What You See Is What You Get) web editor, which means that you can create your web…
I have been doing hardcore actionscripting for some time; and needless to say I have faced a lot of problems in just understanding others' code rather than understanding what the code executes. A programmer's life can become hell when there are a lo…
The goal of the tutorial is to teach the user how to select the video input device. Make sure you have an input device that in connected and work and recognized by Adobe Flash Media Live Encoder and select it in the “video input” menu.
This Micro Tutorial will teach to how to utilize bit rate in Adobe Flash Media Live Encoder.

803 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question