Old 19-06-2003, 07:13   #1 (permalink)
pixelpyro
Senior Member
 
Join Date: May 2003
Posts: 658
Pixel fonts

Hi Guys,

Not sure what is going on but I'm trying to use Pixel fonts (such as silkscreen or FFF harmony) problem is eveytime I try to break the text apart the text looks shite.

i have posted an example the - extended version of the font isn't to bad but the regular fills in as you will see.

http://www.pixelpyro.co.uk/flash/text.html

Any ideas / tips

Cheers

PP
__________________
feel the heat.
  Reply With Quote
Old 19-06-2003, 08:55   #2 (permalink)
roto
This is it - ground zero.
 
roto's Avatar
 
Join Date: Apr 2003
Location: Paper St.
Posts: 4,200
Send a message via AIM to roto Send a message via Yahoo to roto
this might help...

Here's a GREAT bit of information a friend sent me a while back re: using pixel fonts in Flash. I'm going to copy/paste everything because a little refresher never hurt anyone (if you are familiar with some of the things he reminded me about):

Before we continue, I don't know how much are you familiar with fonts, structure, etc, so I'll asume you don't know this stuff I'm going to tell you.

Every font, even the ones you know for years, have a structure, therefore, they are specifically design for different kinds of use.

For ex. did you know that:

Frutiger/Human777: was designed many years ago for the Charles de Gaulles Airport in France. The idea was to design a NON-SERIF font (in spanish, we call this kind of typography, palo seco) that would be able read in any speed, at any angle, at different sizes. That's why, all the vocals and letters like c, s, etc have their angles, just a bit opener than the ones in helvetica, etc.

Verdana: is a font that was specifically designed by Microsoft for ELECTRONIC USE. If you have some "print" experience, you'll notice that "printed" verdana, SUCKS big dick. I mean it's horrible when is used above 10, 12 points.

Having said this, let's check this stuff:

1) Is your typography a PIXEL FONT/BITMAP FONT compliant?

Ex. Pixel fonts: kroeger, standard, hooge

Ex. Bitmap Fonts, that aren't pixel fonts, but they're designed for screen use: Tahoma, Arial, Verdana, Times

Ex. Any other font, designed NOT as a pixel or bitmap font: Helvetica, Frutiger, Futura, Square, etc.

(this are the type of fonts, that, even if you do everything correctly, you wont' get crisp results, BECAUSE of their own structure, they weren't designed to be used on screen with aliases)

2) If you have a Pixel Font or Bitmap Font compliant, but you still don't get crisp results, check if they are in the correct size.

Ex. Font's like kroeger, only work if you use them at 8 points, SPECIFICALLY. Not 7, nor 9. 8. "Standard" family in the other hand, only work when used in 9 size. So, sometimes, even if you do everything correctly, like choosing the right font family, you won't get a crisp results because of the wrong sizes used. One of the ways to avoid this is, to try different sizes and check them with Test Movie, then, and only then, when you already know the precise size of the font you'll use, you create your symbol (either graphic, button, or whatever) and NEVER, EVER change the size of the object, cause that will affect, of course, the size of the text object inside as well. Even a little variation like, 8.1, 8.2 will make everything useless.

Ex. another example is that, Tahoma, work great in Flash, BUT ONLY when used above 10 points, even thought we all know that Tahoma it is prepared to use from size 7.

3) If you have a pixel font or bitmap font compliant, AND you do use them at the right size, BUT you didn't placed the object on a exact pixel on your movie.

Ex. Flash it's a vector animation program (illustrator, corel, freehand are other vector programs), therefore, everything rendered in there, from draws to fonts, are drawn by the CPU as a result of mathematical operations, in difference to pixels/bitmap formats (jpg, gif, tiff, psd are common bitmap formats) that in order to render something on the screen, they just use stored info in every pixel.

Why's this important? Because if you look closer at your "inspector" tab on Flash, you'll see that, every object is placed on a movie, based on a X: Y: info that aren't made by perfect pixels. So, in Flash it is possible to have a 10 x 10 pixel square located at coordinates x: 23.3 y: 43.5 in the movie. This doesn't seem like a big trouble when using vector squares BUT IT REALLY IS WHEN YOU USE PHOTOS OR, IN YOUR CASE, PIXEL/BITMAP FONTS.

So, what you want to do is to select your text object, and check on the inspector that it is located on a EXACT PIXEL coordinate, like x:23.0 y:43.0 (notice the .0 after the number, instead of a decimal or fraction like .2, etc).

If you have been using flash for a while, you'll notice how some pictures, when animated, sometimes are rendered with some errors, like chopping parts (usually in the borders) and some glitches. That's because the guy who used flash, didn't checked for exact pixels either.

In Flash MX you can avoid those nasty .X decimals at the end by selecting on the VIEW menu, the SNAP TO PIXELS option.

------------------------------------------------
I hope this helps
__________________
fun: HGC v.4 | last.fm: DT | me | oi! f*ck u roto: ...via meebo!

New to interweb design? Your friends at dt can help.
  Reply With Quote
Old 19-06-2003, 09:00   #3 (permalink)
roto
This is it - ground zero.
 
roto's Avatar
 
Join Date: Apr 2003
Location: Paper St.
Posts: 4,200
Send a message via AIM to roto Send a message via Yahoo to roto
PS - Here's a site my Paraguayan friend who wrote the above works on: http://www.telecel.com.py/

As you can see in the flash movie that loads at the top...all fonts are crisp so he isn't just a good tutorial giver
__________________
fun: HGC v.4 | last.fm: DT | me | oi! f*ck u roto: ...via meebo!

New to interweb design? Your friends at dt can help.

Last edited by roto : 19-06-2003 at 09:03.
  Reply With Quote
Old 19-06-2003, 09:02   #4 (permalink)
Mr Fred
Magazines™
 
Mr Fred's Avatar
 
Join Date: Mar 2003
Location: Glasgow..
Posts: 11,275
Quote:
Ex. Font's like kroeger, only work if you use them at 8 points, SPECIFICALLY. Not 7, nor 9. 8. "Standard" family in the other hand, only work when used in 9 size. So, sometimes, even if you do everything correctly, like choosing the right font family, you won't get a crisp results because of the wrong sizes used. One of the ways to avoid this is, to try different sizes and check them with Test Movie, then, and only then, when you already know the precise size of the font you'll use, you create your symbol (either graphic, button, or whatever) and NEVER, EVER change the size of the object, cause that will affect, of course, the size of the text object inside as well. Even a little variation like, 8.1, 8.2 will make everything useless.


all true but also you acn use multiples ie

set size 8 (allows you to use 16,24,32,40 etc)



also one point to remember is that movies within movies have to be on exact pixel coordinates as well


and finally for buttons i would use transparent pngs and just add a tint to the over state to change colour- so much easier than faffing positions
  Reply With Quote
Old 19-06-2003, 09:08   #5 (permalink)
roto
This is it - ground zero.
 
roto's Avatar
 
Join Date: Apr 2003
Location: Paper St.
Posts: 4,200
Send a message via AIM to roto Send a message via Yahoo to roto
I've also found that sometimes with pixel fonts...EVEN when I have everything pefectly snapped to pixels, etc. etc. I still get 1/2 blurry text and half perfectly rendered text when I test my movie. However, if I break the text apart and distribute to layers (while still having "snap to pixels" selected)...I get perfect results.

japanmik...do you know why this is?
__________________
fun: HGC v.4 | last.fm: DT | me | oi! f*ck u roto: ...via meebo!

New to interweb design? Your friends at dt can help.
  Reply With Quote
Old 19-06-2003, 09:09   #6 (permalink)
pixelpyro
Senior Member
 
Join Date: May 2003
Posts: 658
Hi Oto,

Thanks but i have done all that in terms of making sure its pixel perfect location. Font is a pixel font from FFF and was used at 8 point.

O ya and remember to use the SNAP TO PIXELS from the start because if you don't and have an object placed at location 145.3 and then turn on snap to pixels when you move it 1 pixel to the left it doesn't snap to the pixel it will shift the equvilant of a pixel so it will move to 144.3.

So I have no idea

PP
__________________
feel the heat.
  Reply With Quote
Old 19-06-2003, 09:12   #7 (permalink)
roto
This is it - ground zero.
 
roto's Avatar
 
Join Date: Apr 2003
Location: Paper St.
Posts: 4,200
Send a message via AIM to roto Send a message via Yahoo to roto
pixelpyro...that did it! Flash is too damn picky
__________________
fun: HGC v.4 | last.fm: DT | me | oi! f*ck u roto: ...via meebo!

New to interweb design? Your friends at dt can help.
  Reply With Quote
Old 19-06-2003, 09:16   #8 (permalink)
pixelpyro
Senior Member
 
Join Date: May 2003
Posts: 658
You guys Mac or PC?
__________________
feel the heat.
  Reply With Quote
Old 19-06-2003, 09:32   #9 (permalink)
roto
This is it - ground zero.
 
roto's Avatar
 
Join Date: Apr 2003
Location: Paper St.
Posts: 4,200
Send a message via AIM to roto Send a message via Yahoo to roto
PC here...
__________________
fun: HGC v.4 | last.fm: DT | me | oi! f*ck u roto: ...via meebo!

New to interweb design? Your friends at dt can help.
  Reply With Quote
Old 19-06-2003, 09:36   #10 (permalink)
pixelpyro
Senior Member
 
Join Date: May 2003
Posts: 658
Just wondering if it's a Mac thing as i just cant make it happen and it's beginning to piss me off!
__________________
feel the heat.
  Reply With Quote
Old 19-06-2003, 09:58   #11 (permalink)
roto
This is it - ground zero.
 
roto's Avatar
 
Join Date: Apr 2003
Location: Paper St.
Posts: 4,200
Send a message via AIM to roto Send a message via Yahoo to roto
[[[cough]]]

no comment (make the inverse "switch" )
__________________
fun: HGC v.4 | last.fm: DT | me | oi! f*ck u roto: ...via meebo!

New to interweb design? Your friends at dt can help.
  Reply With Quote
Reply



Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools Search this Thread
Search this Thread:

Advanced Search


Contact Us - Web Design Forums - Archive - Top
Search Engine Optimization by vBSEO 3.0.0 RC8