Typophile

node 13342

Kind of not sure how to get started but I would really like to create a pixel font for a website I’m designing. This isn’t something I’ll be doing much of, and I have no idea how to begin.

Is there anyone that has suggestions as to where I can start to find some information about this? What are the tools people usually use for this?

Thanks!
Scott

unknown

Twenty-plus years ago, the Chyron IV character generator used by many television stations had a function for creating true pixel fonts, but that technology has long since been eclipsed. Nowadays, I am reasonably confident that all of the pixel typefaces you see are TTF, PS1 or OT fonts that have been designed to reproduce cleanly without antialiasing.

Here are a few tricks for creating a workable pixel font:

1) Work with a clearly defined grid: 7x7 is probably the smallest workable area.

2) The smallest design unit is a true square. All other elements will be composed of whole-number multiples of the height or the width of that square.

3) Have fun and take chances.

If you would prefer not to re-invent the whell, there are a lot of serviceable and clever examples already available: Yuji Adachi is one of my favorite pixelware designers.

unknown

Scott, Nick is his being usual insightful self. But:

> all of the pixel typefaces you see are TTF, PS1 or OT fonts that
> have been designed to reproduce cleanly without antialiasing.

Superhinted TT fonts (like the previous generation of the MS core fonts) are this sort of thing. But they take a lot of effort. Which is why so many people now make what are called “pixelfonts”, which has come to mean something different than “bitmap font”, because it involves the use of an outline font to map pixels to a “virtual grid” - basically little outline blocks of one sort or another that map to exact bitmaps at a certain point size. The main reasons for this are that: Flash didn’t support “true” bitmap fonts; and increasing (like MacOS now) bitmap fonts are not [properly] supported. Furthermore, if you want to handmake grayscale bitmap fonts (which I’ve been doing) you can only do it through pixelfonts (at least robustly and portably).

> 1) Work with a clearly defined grid: 7x7
> is probably the smallest workable area.

But please don’t make really small pixelfonts! We have too many, and their expressiveness is necessarily in proportion to their unreadability.

> 2) The smallest design unit is a true square. All other elements
> will be composed of whole-number multiples of the height or the
> width of that square.

Except if you make grayscale ones…

> 3) Have fun and take chances.

Yes!

hhp

unknown

Thanks, Hrant, for the additions and clarifications. I hate to see questions go unanswered:, if I can offer even a small morsel of information, I go ahead and do so, because…

1) If I’m wrong, I am confident that someone will contradict me (like a duck on a Junebug, as we used to say in Texas); and

2) I am not afraid of being wrong. I have been very wrong about some things in the past (like, I voted for Ronald Reagan in 1980), and will doubtless be wrong many times in the future (but, hopefully, never that wrong).

unknown

We’re quite alike then! Although over the years I’ve realized the need to back off. Yes, I have been backing off. :-) Which is why Norbert actually passed me on the Prolific Posters list… well, at least until I woke up this morning.

hhp

unknown

We’re quite alike then!

Please tell me that it’s the other stuff I said, and not that you voted for Reagan in 1980.

unknown

I don’t vote, of course.

hhp

unknown

That’s a pity, really. I have to go along with the Lotto theory: if you don’t play, you can’t win; likewise, if you don’t vote, you can’t bitch. Of course, I could be wrong about that.

unknown

If You Play, You Can’t Save A Dollar.

hhp

unknown

N: if you don’t play, you can’t win.

H: If You Play, You Can’t Save A Dollar.

N: If I’m wrong, I am confident that someone will contradict me.

No matter: it’s win-win for me. If I’m wrong, I’m right…at least about being called on it.

Captured from web.archive.org on 18 Jul 2006. view this capture