Pixel (Flash) Fonts VS Illustrator CS
Hello!
Pixel fonts are blurry in all of the CS versions of Illustrator, even if placed at full x/y values. Seems like the only Illustrator versions that shows pixel fonts the crispy way are Illustrator 10 and below. (I wrote to Adobe about it last year [2007, or even 2006], and I still didn’t get an answer [surprise!].)
Does anyone know the trick for crispy looking pixel fonts in any of the CS versions? I’d like to design my Websites in Illustrator CS... I’m done with 10!
Thanks.


















28.Apr.2008 10.38am
You can’t blame Adobe for using Illustrator in such a strange way. Illustrator isn’t based on pixels, so how should the pixel fonts be rendered in a good quality? You need an app that is based on a pixel grid and you need to set the view to 100% (1 pixel on the screens equals 1 pixel of your design).
28.Apr.2008 11.35am
Yes. Thank you: I design my Flash Websites at 100%.
I’ve been working with Illustrator 10 to design my Flash Websites for five years. (Designing a Flash Website in Photoshop is completely inappropriate knowing that Flash is vector-based.)
But it’s frustrating to witness that Flash fonts have always looked great in the previous versions of Illustrator (10 and below), but not in the actual CS versions.
This means I’ll eventually have to design directly in Flash, but I’m so much more comfortable designing in Illustrator!
That’s why I’m trying to know if anyone is aware of the following:
1) How to make Flash fonts look good in the CS versions of Illustrator;
2) If this is not possible, WHY did Illustrator change that? I’m sure I’m not the only one cursing.
Thanks!
28.Apr.2008 11.52am
When you export to flash though you don’t have problems then - do you? It’s just while you are in Illustrator itself, correct?
I suspect it has something to do with a change to the rendering engine. I wonder if they could give you a choice about that like they do in photoshop. Actually I should check to see if there is one...
28.Apr.2008 11.59am
You can turn off anti-aliasing in the preferences. This will stop the “blurring”. But like I said: this will only give you a nice looking pixel font if the grid of the font and the grid of the Illustrator view will match coincidentally.
If you just do your layout in Illustrator and then move it to Flash, why do you care about the appearance of the fonts in Illustrator?
28.Apr.2008 12.01pm
Exactly!
But no... There doesn’t seem to have a «crisp/smooth» choice in the Type palette like in Photoshop.
Thanks again!
28.Apr.2008 12.05pm
In reply to Ralph:
You can turn off anti-aliasing in the preferences. This will stop the “blurring”.
- - This will make all of the other items on the artboard aliased as well.
If you just do your layout in Illustrator and then move it to Flash, why do you care about the appearance of the fonts in Illustrator?
- - Because the look and feel isn’t the same at all. Therefore, the design process isn’t the same, and the presentation process isn’t the same either...
Thanks again.
28.Apr.2008 12.20pm
Effect > Rasterize
Here is a tutorial.
28.Apr.2008 12.33pm
Thanks.
This seems to be the solution.
I still find it weird that I’ll need to do that extra step everytime I’ll create another text box, but if it works, ok then! (It probably would’ve been better to have a “crisp/smooth” option in the Type palette like in Photoshop, but still...)
Seems like this is it! Peace!
28.Apr.2008 1.13pm
You can save a little time by saving the effect as a graphic style, which is very simple to do: Select one of your already-rasterized text boxes and drag it to the graphic styles palette. This will create a blank white icon in the graphic styles palette. When you select a text box and click on the icon, the same rasterize effect settings will be applied. Since a blank white icon is not very identifiable, it helps to give it a name (double click on it) and set the graphic styles palette to one of the list views.
28.Apr.2008 1.14pm
(I didn’t know about this rasterize effect, either, until now. Pretty neat.)
28.Apr.2008 2.33pm
Great! I’ll try that!
Much appreciated. Thanks!
28.Apr.2008 3.15pm
I don’t want to kill the spirit, but if you’re using Illustrator to design your sites there’s a good chance you don’t really need Flash. One can remake any AI with just plain old html/css – if you care about usability, that is.
29.Apr.2008 12.24am
Frode, what’s all this “if you care about usability, that is” stuff? Much as I venerate usability ( and I do you know...) the world is not made of usability alone. Not all individuals or business’ want or would even benefit from usability alone.
29.Apr.2008 7.30am
I’m no evangelists on these matters, but I find it good to take use of the internet’s possibilities. Flash is, btw, an amazing tool.
29.Apr.2008 1.06pm
To be frank, I really don’t think this is the matter of the subject here, but I’ll still take time to answer.
It’s simple: I’m used to Illustrator to design with. I don’t want to waste too much time having to get used to Flash’s tools. I work on a MAC, and my programmer works on a PC. So I have to break apart the fonts anyway when I give him the Flash docs. (Please don’t ask anymore questions relating to our/my method of work... It would be too long and not on the subject. Thanks. We all have our own ways of working for a lot of different reasons. That’s it, that’s all.)
Illustrator is vector-based, and so is Flash. I think it’s logical.
What wouldn’t be logical, would be to design the interior of a novel with Photoshop for obvious reasons.
Thanks.
29.Apr.2008 10.25pm
Please forgive me if I came across harsh. Good luck with your work, Krissserz!
30.Apr.2008 1.32pm
No problem!
Peace to all!
30.Apr.2008 1.32pm
No problem!
Peace, and thanks again to all!
1.May.2008 8.51am
Something else that may be useful: In Indy you should use a full point–grid & lock/place all elements on this. Makes for more consistent anti-aliasing when rendering to pixels.
. . .
Bert Vanderveen BNO
1.May.2008 12.37pm
I would think that would work - *if* your output resolution was a multiple of your grid resolution. So for example if your grid is point-based, and you export at 100 ppi, the grid won’t help. But if you export at 72 ppi, it would.
Regards,
T