October 2007 Archives

U-489

Posted at 2:38 PM

We arrived at the bed & breakfast in the Berkshires and my headache had worsened. Forgot to pack some Advil. Damn. I went in the front door of the inn and an old man asked if I needed help.

“Hi, I was wondering if you had any aspirin?”

“Well I dunno. Let’s see what she has!”

Well that’s odd, I thought, assuming there was a little store inside — or at least those little individual packets for sale. Must be the owner of the inn. Maybe “she” runs the shop in the lobby. He led me to a large living room where an old woman sat in a chair by the fireplace.

“This gentlemen is looking for some aspirin.”

“Hmm, lemme see,” she said, as she plunged her left hand deep into her left pants pocket. She must’ve fished around in there for a good 20 seconds.

“Ah ha! I found one,” pulling something out. She then carefully tipped her hand so the pill would softly fall into the old man’s palm (so that he could walk over to me and do the same).

I looked down at a single white pill in my hand. U-489 was imprinted on it (or something like that), with no other clue that this was indeed an over-the-counter pain reliever.

I clenched my fist around it and said, “Thanks”.

“Come prepared!” the old man shouted as I walked down the steps outside, firing the mysterious pill into the bushes.

I’ll never leave home without aspirin again.

A Type In the Right Direction?

Posted at 11:35 AM

We hear news that Webkit now supports the @font-face CSS property, enabling the designer to specify downloadable fonts in their web pages. I can remember getting excited about this back in June after hearing Håkon Lie talk about it during @media London (check out Richard Rutter’s thoughts on this as well). Legal and security issues will prevent us from using most fonts of course, but I like to focus on the positive here. There are some perfectly useable, free fonts out there — and more choice is better than little or no choice, right?

I wholehartedly agree with Jon Hicks, who writes:

Personally, I’m just happy that we’re reaching a point where we’re having this conversation!

Right! What’s important, I think, is that this helps move things along. Perhaps it will stoke the fire in terms of a real conversation between type foundries and browsers on how things could work while protecting the font maker. Then again, maybe it won’t.

Stephen Coles at Typographica writes something I’d like to counterpoint:

In general, web designers aren’t typographers. Their specialty is in the realms of interface, hierarchy, and navigation. Their training does not include making decisions about what typeface to use for long passages of text.

While this certainly could be true for many, it doesn’t mean that web designers can’t become good typographers — especially when given the chance with more of a variety of typefaces to work with. The worry that all web pages will be suddently ruined with crappy free fonts everywhere overshadows the fact that some good can come out of the ability to at least have a choice to use those crappy (and/or potential useful) fonts. Give us all a chance, eh?

For instance, and maybe this is fresh on my mind after releasing a *cough* icon-based pixel font *cough* just days ago, but imagine using a downloadble dingbat font for displaying icons instead of GIF or JPEG images. Suddenly text and icons become truly scalable together. Just a small example — but one I’d love to experiment with.

34 Comments

DingBit

Posted at 10:50 AM

I’m pleased to announce a new product shipping today over at the IconShoppe. Chameleon16 is a new pixel font for Mac and Windows, hand-crafted using only the finest pixels available. It’s based on the Chameleon Original icons that we’ve been hocking over here to support our growing latte addiction.

Initially, I’d thought to just convert the GIF images to a bitmap font so that the customer could change the color and add effects at will. The minimalist nature of the icons begs of it, and having the 16×16 icons in font format would sure be handy. But while I was at it, why not create new alphanumeric characters to go along with it, and create a real font in the same style?

As the name suggests, Chameleon16 is designed to be used at 16px. And like its pixel font predecessors, it also works at multiples of that base (32px, 48px, 64px, etc.) for retro, extra blocky goodness.

Since each character is a 16×16 tile, it admittedly has limited use for setting large chunks of text. You’re not going to use this font to display client invoices or proposals. But interesting things can happen when you start playing with kerning and line height, and I’m excited to see some interesting applications where it could be used creatively.

The TrueType font includes standard alphanumeric characters as well as the entire Chameleon Original icon set as alternate characters and costs just $39 bucks. As a special promotion, the first three orders also get a free copy of Bulletproof Web Design, Second Edition that hit store shelves last month First three orders received!.

Special technical geek notes

The process of creating the font was a learning experience, and I would compare it (at times) to removing stubborn wallpaper. I first created the characters in Photoshop, then used a program called BitFonter to turn those into a bitmap font, assigning each character, adjusting metrics, etc.

Over the course of the last six months or so I began chipping away it, navigating the spotty documentation, and teaching myself the wonders of font metrics, character encoding and more. In the end, I needed to create additional outlines of the bitmap characters and export these into TypeTool which could then generate a proper TrueType file (after having problems letting BitFonter do this). If I knew what I was doing this wouldn’t have taken long.

I avoided using something like Fontographer (also by FontLab) because I was creating a bitmap font and BitFonter’s pixel editor seemed a natural choice — and for creating and editing pixel fonts, it’s great (or at least slightly more intuitive). It’s the output and documentation that was confusing, and my respect for real type designers has grown tenfold after this little project.

So, my advice for those looking to create their own pixel fonts: learn Fontographer, or remember that you’ll need TypeTool in order to generate a TrueType file from BitFonter’s outlines.