FLASH font display odd

[cmabill]

hello all

is there any one out there who could help me with this, maybe it's a easy task to you, but I have have exhausted with no answer.

I made several picture in Photoshop with some text, the font size of text is 24pt, which I think is big enough, then I imported these pictures into Flash to make a silde flash, which works very well.

but when I upload the flash file into my website, the font looks very odd, and some of the letter becomes bold while others still sharp. I have tried to save the photoshop file in sharp, web so as to make it better, but it seems no use. pls see the attached picture below.

I am newbie to web design and Adobe software, pls take patience to give me the detail steps if you could help with this. thank you.

Bill

[JasonHippy]

When you're saving your image out from photoshop, what file-format are you using?
I'll assume that you are using a lossey format (.jpg, .png etc)

Also when you import your image into the flash IDE, what quality settings are you using?

For now, I'll assume that you are importing the image into the library for your flash project and then using it in a Movieclip or a Sprite and using the default settings for the image quality.

It's been a while since I've done anything with Flash, but I seem to recall that when you import lossey images (.jpeg, .png etc) into the Flash IDE; the IDE usually tries to compress the image a little when you export to .swf. So you get a smaller .swf at the expense of the quality of the embedded images. I can't remember what the default quality value is for images (75%?), but there is a way to set the quality of each image you import into your project in the flash IDE (I can't remember if it's a global setting in the export settings, or if it's a per-image setting in the library). If you set the export quality of each image to 100%, it should be uncompressed in the swf and should appear exactly the same as the original, but this will increase the file-size of your swf.

An alternative to embedding images is to dynamically load them at runtime. Loading external images can sometimes be better than embedding them in your .swf. It makes your swf smaller and the image will display at full quality because it is uncompressed. The only caveat is that you may need to create a pre-loader to load all images at the start of your swf, or at least preload the first few images before starting the slide-show and loading the rest in the background, on the fly. (tutorials for creating pre-loaders and dynamically loading external assets in flash can be found all over the internet!)

Another thing that can affect the quality of lossey images in Flash is scaling. So for example, if you use a lossey image in a Movieclip or a Sprite which is slightly larger and the image is scaled up, or stretched to fit the container, you will also get problems with the image not appearing correctly (distorted text, pixelated background, loss of aspect-ratio etc.).

To get around this problem, you either need to ensure that all lossey images you embed or load into your swf are exactly the size you want them, or are slightly larger than you want them and then scaling them down in your Movieclip/Sprite in your swf. Scaling lossey images down usually looks OK as long as the aspect ratio is kept the same, but scaling lossey images up almost always looks terrible!

Otherwise, if scaling up is required, or cannot be avoided you should use vector graphics (.svg graphics created using something like Illustrator, or Inkscape, or in the Flash IDE itself) where possible. Vector graphics can be scaled infinitely up or down with no loss of quality.

Another thought: Seeing as your image incorporates text, would it make sense to just create the background image in Photoshop (without the text) and then create and display the text in Flash? So when the image is displayed, flash overlays some text for those frames?

That way it won't matter if the lossey background image does get scaled, the text will always appear as it should. But note: If you are doing the text in flash, you need to consider either using a common font, or if you are using a custom/non-standard font you should consider embedding the font, or at least a sub-set of glyphs from the font to ensure that viewers of your swf can see the text correctly.
When you embed fonts in the flash IDE you can choose to embed the whole font, or a sub-set of glyphs. So if your text will only contain the letters a..z, A..Z and 0..9, you can choose to embed only those glyphs.

Again, it's been a while since I used the Flash IDE, so I can't remember the exact steps to to do this, but there should be information/tutorials online about embedding fonts in .swf files from the Flash IDE!

So to sum up, the text problem is most likely caused by:
A. Lossey image quality settings too low in the Flash IDE, resulting in compression and some minor data loss in the embedded image in the final swf.
B. The lossey image has been scaled-up or stretched in Flash to fit a larger Movieclip or Sprite, reducing the quality of the image.

Courses of action:
A: Check the export settings for images in the Flash IDE.
B: Ensure lossey images are either the exact size or slightly larger than you need and scale down to fit containers.

Alternatives:
A: Dynamically load images rather than embedding them in the swf.
B: Create background image with no text and use Flash to display/overlay the text.
C: Use vector graphics (.svg) instead of lossey formats (.bmp, .jpg, .png etc) wherever possible.

Sorry I can't give particularly detailed instructions on any of the options presented. About 4 or 5 years ago, I worked at an elearning company where I did quite a bit of Flash development alongside my C++ systems stuff (which was my main gig there). But I'm working elsewhere now and I'm a full time Linux user at home, so I haven't done anything with the Flash IDE for a looooong time. In fact, since Adobe stopped developing the Linux version of the Flex SDK I haven't done anything with Flash at all!

Anyway from memory and bitter experience, those are the most obvious things that spring to mind regarding your image related problem. Hope it is of some help!