PNG or JPG for Flash
- Started
- Last post
- 20 Responses
- georgietexan
I'm having a color issue when I convert my photoshop file to a PNG then inport in to Flash. The color is not matching the JPG files also in my FLA file?
anyone know why? which format do you prefer?
- ********0
best way to color match is to use websafe colors, some colors are not websafe and when you export it will convert to the closest web safe color, or write down the RGB values or Hex values and use them in all programs........in the end I use PNG when i need a transparent BG and JPG for all photos
- kbags0
agreed.
- era4040
ya, cuz png compression isn't as good and the files end up being bigger....
but sometimes you want hi- quality and need the alpha channel.
- kpl0
pngs won't come out right in flash...I only use them if I need an alpha channel.
I usually prefer pict myself. for some reason, the first time I import any pict it tells me it needs to import thru quicktime. So I do that, and images get a bit washed out. then I go back into the library, go to that image's properties then hit the update button, and colors are back to the original.
- gabe0
only mismatch in color from JPG to PNG i've seen is the PNGs sometimes end up very faded... not really a mismatch in color just a loss in color.
in photoshop, on the top-most layer of your image that is going to be a PNG, set a levels layer to .7
it will look dark in photoshop, but should look fine in flash
- ********0
don't use PNG use JPG
- PIXELRANGER0
PNG all the way.
Haven't used a JPG in a project in over 4 years.
- ********0
when i use png's for photos, its like 3x the filesize.... how do you get around this, pixelranger?
- PIXELRANGER0
What I do is I import everything as a PNG. No compression obviously. Then I set the Compression of the FLA to some lump Percentage that effects every Bitmap in the movie.
Then if there are pieces of lets say the interface that I want crisp, uncompressed or compressed at a higher or lower rate I change the compression on those images on an image by image basis. Just double click the PNG in the library and change the preference on an individual basis.
So lets say i compress everything in my movie at 80% in the Publish Settings. I might have pieces of my interface that are compressed at 90% or even Lossless Gif/PNG compression if they are small assets that I want kept crystal clear. Or if I use things that are in the background and can be compressed more then I will set them to a higher compression as well so that you get a mix of PNGs compressed to the movie setting..and then individual PNGs that are compressed or not compressed depending on what you want them to look like.
By doing this it is really no different than saving out a JPG at 80% from photoshop. Only difference is I can do it on the fly inside of flash rather than going back, opening up Photoshop and saving out the image again at a higher or lower setting. For one image its not a big deal. But to do that to tons of images over the lifetime of your project its a pain in the ass. Thats why I've never understood why people say that by importing JPGs you get lower flash files. Its all the same to me but its a matter not having to waste time by going back and forth between the two apps. I just think that sometimes people leave the settings in the Library at NO compression. By default if the PNG has more than 256 colors it will set the compression to JPG compression when you export the movie. if its under 256 colors it will not compress your PNG.
The problem people have is they go crazy importing these PNGs with tons of alpha which will ALWAYS increase file size. But.. A PNG with no alpha compressed at 80% and a JPG compressed at 80% and imported into Flash will very little compression differences although I've found the PNG to be lower. Yes sometimes there are color changes but it always depends on what you are importing.
Another benefit of doing this technique comes when using image sequences. Lets say I have a flash movie that has a big image sequence and I dont want to have to re-export JPGs from After Effects every time I want to play with the compression. Import everything as PNGs and then tweak your global export pref to something like 40%. Its just like importing in a sequence of JPGs at 40%. Then you can go thru the rest of your imported images that might make up the interface or other assets and tweak them individually to 80% or something. In this way when I want to change the compression I just change the setting in Flash, Export and I'm done without having to open up AE again.
- tymeframe0
i gotta try that
- versa0
pixelranger - that lengthy description was really informative - thx, i'm gonna give that a try in my photo intensive projects now
- ********0
great info there pixelranger :)
- georgietexan0
pixelranger thanks bro.
My PNG files look faded next to the JPG. Yes I only use websafe colors but yes I sometimes mix the two and I guess that's my problem.
thanks for the tips.
- abizzyman0
this may sound crazy... but I managed to get my color perfect by accident.
... no .jpg... no .png...
like so:
I placed separate layers of my photoshop document in illustrator...
.. then (not sure if this only works in Illus. CS)... I exported the illustrator file with the placed image as an swf (making sure to check the box that allows objects to be editted)...
... then imported the swf into flash. NO DIFFERENCE IN COLOR ... then take the object (or objects -> it's possible to design the entire thing in illustrator and export the whole thing as a swf file) and break the object apart and start saving peices as movie clips.
I swear this works.
to prove it:
.jpgs of the interface from illustrator:http://www.venuatgrayhawk.com/be…
and then the ENTIRE illustrator file exported as a swf:
http://www.venuatgrayhawk.com/be…
granted... i made changes between the index2 and index3...
... but the colors worked perfectly... EVEN MAINTAINED TRANSPARENCY -- whether it was a shadow from PS place into ILLUS. or vector objects drawn in illustrator.I didn't try using any layermodes in PS or Illus and then exporting... I'm curious to see if the color holds.
damn.. I hope that's not too confusing.
- ********0
also, i sometimes bump up the saturation in photoshop from 20-30. then you when do save for web, the colors drop out to normal. play with the setting till you get something you are satisfied with.
- xau0
Yo. Just import the psd into Flash. FLash MX uses QuickTime to parse the psd and all looks great. Maybe just a Mac thing tho (?).
TRY IT.
- abizzyman0
the quicktime works too (as told by xau)...
... but if you do it through illustrator.. you can design your entire interface (except text... you'llhave to retype it).
- smallT0
much appreciated PIXELRANGER.
For what its worth. I have better luck with Fireworks pngs than those created with PS. Go figure. I did the Pepsi challenge and they are smaller...
- era4040
hey, bizzy. what's that handwriting font ya got there? looks nice.
- toqueboy0
pixelranger...
hopefully you check this again...i hope...
are you using png 24 exclusively?
or 8?thanks