đž Archived View for gemini.zachdecook.com âē capsule âē 2021-02-20-font-creation.gmi captured on 2024-08-18 at 16:51:18. Gemini links have been rewritten to link to archived content
âŦ ī¸ Previous capture (2021-11-30)
-=-=-=-=-=-=-
Back in the day, penmanship was an important skill. It was also my worst skill. "When you get to highschool, you'll have to write all of your papers in cursive." That was a lie. Here in the early 21st century, we type, tap, or even dictate to record compressed words. But have we gained more in legibility than we've lost in expressability? Do printed paragraphs have to be less suggestive than calligraphic communications? Enter fonts.
"How do you make a font?", one might ask. Well... the answer's not that simple, and is quite personal. Over the last decade, I've created 5 fonts which I consider worthy of being shared. How you make the font also varies based on what the purpose of the font is. For each font, I used a different piece of software.
This first font is a stylized handwriting font. I wanted to have "my own" font for publishing things, rather than searching the internet for something everyone else has already seen before. It's most similar to Dieter Steffmann's "Marker Felt". The name comes from the method of creation: it was made using a sharpie. Specifically, on one of those "create a font from your handwriting" websites.
Comparison of ZachsSharpie against Marker Felt: "How vexingly quick daft zebras jump!"
I printed out the sheet, wrote each character, scanned it, and uploaded it. Within minutes, I downloaded my own custom font and it was... barely visible. Probably something to do with the contrast. For take two, I upped the thickness by just using a sharpie instead of using my pencil. This created the typeface which iconically adorns my http website.
Download ZachsSharpie if you want to imitate my leaderhead!
Do I recommend this method for font creation today? Unfortunately, myscriptfont.com no longer exists. There doesn't seem to be a website where you can upload a scanned chart and get a ttf, no strings attached. If you know of any free software which does this, please contact me. I would happily host an instance so others can easily create their first font.
The next font came from an interest in a foreign language, and the love of monospaced fonts. bbbsmooth started as "bababang", a 10x10 pixel font which covers the Bengali unicode block (similar to Devanagari), used for the language Bangla (āĻŦāĻžāĻāĻ˛āĻž). I wanted to have Bengali text look good amongst computer code.
I created it using the site fontstruct.com. First, I decided on my grid size. I chose the most complicated character, āĻ, the aspirated 'a' vowel. I made that whole alphabet, the numbers and special symbols, and eventually got back to adding the ASCII characters as well. To make it "bbbsmooth", I added more shapes to my pallete, and started placing them around the existing blocks, making up some rules to my method as I went.
download bbbsmooth -- no promises that the monospacedness is accurate though.
view bbbsmooth on fontstruct.com
If you know you want to make a grid-based font, and don't mind running a proprietary javascript program (desktop only) to do it, then this may be a good choice. I'm not convinced though that this tool could produce a crisp pixel-perfect font suitable for programmers (such as Andreas Larsen's Monoid).
When I started working full-time, probably my earliest distraction was reading about and looking at emoji on emojipedia. Creating an emoji-font seemed to be something you could only to if you were a large company, and redesigning an emoji-font would take just as much effort.
"Why can't I have my own emoji font, and why's it gotta be so difficult to make these?", I thought. As I had been learning about SVGs, I applied my knowledge and created a system in python where each emoji is defined by a YAML file. With the program SCFbuild, making an emoji font from a bunch of SVGs was easy.
A few discouraging notes in the development of this:
Download some version of the font
Still, I managed to create almost 50 glyphs before getting tired of the project. Should you use this method to create a font? Sure! If you want an SVG-in-OpenType font, feel free to create a font deriving from fossmoji's source! Following the scene, it looks like maybe COLR fonts will take off (as the web browser giant supports them). It might not be too difficult to replace SCFBuild with nanoemoji to get these COLR fonts instead.
View the homepage for fossmoji
Yeah, this is a sans-serif font, though it has nothing to do with a finger-snapping villian. Sanos was named after its parent-font, "Tinos": a font metrically compatible with Times New Roman. Why make a TNR-compatible font? It was all for the music engraving software Verovio, (more on Verovio some other dayš). For automatic spacing, it assumes the font characters are the size of those in Times New Roman. Fortunately, there are several of these: Liberation Serif, Tinos, and Thorndale. Unfortunately, none are sans-serif, which was an important feature for My.Hymnary.org's presentation system we were developing at work.
A musical score with Sanos, a sans serif modification of Tinos.
I opened up Steve Matteson's apache-licensed font using Fontforge, and started tweaking away! My biggest gripe with sans fonts is the Ambiguous Illness: that is, the tendency of the capital I and lowercase l to be indistinguishable. I've been using my preferred solution since grade school: keep the foundation and canopy on the big I. Besides this decision, the modification was fairly straightforward. Credit to Steve Matteson, of course, for Tinos.
FontForge is really powerful, but pretty clunky; it takes a lot of getting used to. Use it if you have to. Improve it if you'd like to. Modifying an existing font is a good way to get something consistent yet unique. I recommend this method for those who don't mind getting their hands dirty.
When Devine Lu Linvega created the text editor "left", it loaded its font from famicom chr files. I didn't find the "nasu" editor comfortable for editing fonts, so I created my own program to convert text into the chr fonts.
Source code for txt2chr, also the repository where type.txt is stored.
type.txt is an 8x8 4 color font, which covers all ASCII characters (yes, even the nonprintable ones). It was written and is maintained in plain text, just by replacing characters in a grid. Currently the use of colors is very minor.
left editor with the font type.txt, editing the file type.txt, showing the newline character.
Should you use left and txt2chr to create your next font? Maybe. It's really easy, but most font-supporting software won't support this file format to use as a font. That includes newest versions of "left". One thing's for sure: making a 8x8 pixel font is much easier than making and maintaining the text editor which uses that font.
So, there's my little five-font adventure for you. I think all computer users should try making and using their own fonts some time, but maybe it's fair to say not everyone shares this stripe of creative drive.
