You’ve got open source and public domain video footage, operating systems, software tools, photos (hello, Creative Commons flickr search), music … why not fonts, as well?
Open fonts are especially useful to visualists, because it means fonts can be freely embedded in web applications, remixed and edited, and otherwise abused.
Free Fonts of Fonts
My current favorite resource is Orgdot’s open source font page. If you love pixel/LED fonts, you’ll find some truly top-notch choices here, plus links to many, many other resources. Lovers of typography could easily spend a weekend doing nothing but creating animations and visuals out of the pixel fonts from this site and the various linked repositories:
Orgdot open source: pixel and LED fonts for Flash
I’ve got these pixel fonts specifically slated for some experiments with Processing. Could open source typography catch on the way Creative Commons / open source licenses have for other media? Possibly, but so far the efforts are a little immature. One of the best resources is Bitstream, which has open sourced its Vera font family:
Vera Open Source Fonts [Bitstream]
What’s nice about Bitstream’s fonts is that they’re fairly neutral, making them ideal for visualist projects and remixing / destroying into glitchy versions of themselves. “Remixed” Vera variants could start to spread among CC-minded fontographers. So far, I haven’t seen much outside of Linux-land, though. I want to see some degraded Vera faces. Given how little I know about font editing software, destroying a font should come fairly easy to me, so I’ll try to give it a shot!
There is one effort to bring Creative Commons fonts into a central repository, linked to the other excellent CC resources out there. It’s still very early in development, though, and I found it difficult to navigate (no rank by rating, really?), and many thumbnails were missing.
To give you an idea of the eccentric state of the library: there’s a font made out of rat footprints. Seriously. I love the idea, though, and I could imagine it may expand in the future if the community grows in popularity.
Flash Fonts
Back to the more practical, though, let’s talk about embedding fonts in projects. Part of the advantage of open fonts is you know you can do so without pesky copyright violation concerns. It’s particularly easy to do in Flash:
The first step is to place an embed metatag in your ActionScript code. In ActionScript 3, this needs to be outside the class declaration; I put mine right after the import statements. For example:
[Embed(source="C:\WINDOWS\Fonts\SWIF1.TTF", fontName="SWF!T_v01", mimeType="application/x-font-truetype")]
Because I’m sometimes dense, it didn’t occur to me that you need to escape the backslashes. Typing C:WINDOWS won’t work; double up those slashes to C:\WINDOWS and it will. (You’ll get an obscure “something’s wrong” warning if you get any of this wrong.)
Here, I’ve embedded directly from my Windows fonts directory (same process for the Mac), but you may want to copy the font into your project file if you’re likely to pass around the project file itself. You can use relative paths, so if it’s in the path of your project, you’re set.
All fonts in Flash are contained in text fields. It was built as a web app, so they assume you’re setting up forms for people to actually use — even though some of us are making weird typographical art. (Hey, I’ll forgive them for not knowing that.) In ActionScript 3, you create a text field as a container for your text, assign it to the display list (the new rendering mechanism, which saves you from all the layer ordering problems of the past), then assign formatting to that text field.
For example, using a text field called “t”, you would declare variables for the text field and a “formatter” to apply formatting:
private var t:TextField = new TextField();
private var formatter:TextFormat = new TextFormat();
Then, elsewhere in your code, you’ll add that field to the display list so it will show up on the screen, and set formatting options (like which font to use):
addChild(t); // Adds our text field to the display list
t.autoSize = TextFieldAutoSize.LEFT; // Sets the text field to auto-size so we don't have to manually set the pixel width
t.embedFonts = true; // Use an embedded font rather than the local font
formatter.font = "SWF!T_v01"; // Choose the font
(Without setting the value for embedFonts to true, the font will try to use a locally-installed font.)
You can use that formatter object to apply other formatting, as well. I’ve been playing with animating some of those values, by calling a function like this using some kind of animation timing:
var fontSizer:int = (Math.random()*36)+36;
formatter.size = fontSizer;
t.setTextFormat(formatter);
Once this is done, your font moves with the Flash file. I love this for performance applications with Flash, because it means my Flash files are portable and can run off any machine I want. (In this case, I’m working on a project for Boston CyberArts, where I’ll need the Flash file to function on a choreographer’s machine — more on that soon.)
At this point, I would talk about using PFont with Processing for embedding fonts there, except — again, because I’m dense, perhaps — I had trouble getting that to work. Unless I’m mistaken, Processing requires separate fonts at each type size for anti-aliasing to work. I hope to play with this more and follow up, hopefully with something actually artistic involving fonts in Processing. But if you have any hot tips out there (hello, Processing professors), please feel free to share.
Other font tips? Flash and Processing ideas? Questions? Comments away!