Here’s a few ideas I hope will prove my point.

Play games

The Rather Difficult Font Game
This game shows you some text in a certain font then asks you to name the font from one of them in the list. It isn’t as difficult as the name sounds!

Deep Font Challenge
Head down to the shooting gallery to blow away the letters from the typeface he wants or doesn’t want.

Cheese or Font
Hmm, it’s odd how cheeses and typefaces often have similar names. See if you can tell the difference.

Kern Type
Many fonts contain extra information telling the computer how to adjust the spacing between individual pairs of letters. If you think of an AV for example the top of the V might start before the A ends or be very close. This game lets you move the letters around until you think you have optimal spacing then you can see how well you did.

Shape Type
The ultimate font game! See if you can reshape disported letters back to their original forms by adjusting the lines and bezier curves. The computer will score your efforts by comparing to the original.

Find a font

FontShop newsletter
This newsletter is both infrequent and interesting so it gets to come directly to my inbox. It contains interesting new fonts, news and designer spotlights and is a great way of discovering new typefaces to use.

IdentiFont
Asks you a series of specific questions about letters in the font on a continual process to narrow it down to the hopefully right one.

WhatTheFont
This tool is a little more automated, upload the picture and it should identify the letters although you may need to fine-tune the recognition (also available as an iPhone app)

So you need a typeface infographic
This flowchart takes you through a bunch of decisions to choose a typeface. Don’t expect to find anything too original though!

Smarten your site

If you have a web site you might want to look at using a custom font to help stand-out from the crowd now that they are compatible across many browsers. Yes, I should do this for damieng.com :)

Font Squirrel
Font squirrel have a great site full of many free fonts and have prepared the necessary font and CSS files required for the subset available for use on web sites.

Google web fonts
Google have almost 300 fonts available in their free web font directory right now and with just a couple of clicks can provide the necessary HTML, CSS import or Javascript necessary to use them in your pages. The fonts are served up from their servers too so you don’t need to worry about files or bandwidth.

Fonts Live
Monotype’s hosted service is similar to Google’s but contains just their own commercial fonts including well-known ones such as Museo, Gill Sans, Bodoni, Rockwell and many of Microsoft’s typefaces. Prices start at about $40 a year for small sites (250k visits a month) but they have 30-day free trials.

MyFonts WebFonts
MyFonts have a huge collection of fonts – some 40,000+ – most of which are available to use on the web for the same price as buying the font. This makes it cheaper than FontsLive but you need to host the files and CSS on your own server.

Offline fun

Playing cards
These Helvetica based playing cards are very stylish, bold and modern. If you’re going to play cards why not do so with something a little different.

Typographical calendar
Get a daily dose of typography in this compact little desk calendar. The designer’s equivalent of a word-a-day.

Helvetica The Movie
Not just a movie about the design of this iconic font but also the modern movement it was part of. If you like this keep an eye out for Linotype: The Movie due in Feb 2012.

Typography t-shirts
Zazzle has a lot of typography t-shirts as does TypographyShop and Ugmonk.

Create your own

If any of that has been enough to pique your interest why not have a go at designing your own font?

FontStruct lets you start simply by building your own from a library of pre-build shapes you place on a grid. It’s like LEGO for typography and is very easy go get started.

If you have an iPad then you can also try out iFontMaker for an easy way to make hand-drawn fonts (it lacks fine editing facilities). I actually used a Pogo Sketch for my Damien Typewriter  but it is too soft so you could try other styluses. Once you’re done it publishes to their web gallery where you can download the TrueType font and a Web Font too.

If you enjoy that but crave more control then try the free FontForge editor which runs on many platforms and lets you create real fonts or hack apart other peoples (remember to not redistribute changes to other peoples fonts unless the licence allows it).

If you get stuck on some letters then try my favourite Designing Type book that devotes a page or two to each common character and shows how a number of well-known typefaces express it.

[)amien

Typographica opened today with a critique of the Roboto font which boils down to this:

The similarity to Helvetica is obvious but that similarity can be drawn with many modern typefaces – the other comparisons are tenuous indeed:

• FF DIN has little resemblance other than having straight edges on rounded letters. Lots of faces do that. Envy Code R does extensively :)
• Myriad is more open in it’s whitespace, ends t with a slant and features a different approach to shoulders on mnpqr
• Ronnia only shares the single horizontal stem which is also present in many monospace bitmap fonts

Yes, some of these differences are subtle when you put them side by side but subtleties are what give the typeface its character.

There are only so many ways to draw letters with consistency and readability especially if you want a modern sans look. That’s exactly why copyright refuses to cover letterforms in the USA.

So coming to the font itself at first glance, yes, on my laptop it doesn’t look as pretty as Helvetica when blown up for comparison but here’s something you should consider.

Typefaces are designed for a specific environment

Consider the following typefaces:

• Bell Gothic has big counters and deep ink-traps so that high-speed printing on cheap paper retains the form
• ClearView Highway is designed to be quickly readable with headlight glare
• Cambria has many little flourishes that only look good with sub-pixel positioning

Use a typeface outside its intended environment and you’ll easily believe it’s a bad design, ugly or unrefined as those very characteristics that made it great for that environments completely fail to fit new surroundings.

Even the famous Helvetica has an environment of whitespace, bold colours and clean-lines where it shines. That makes it a top choice for corporate logos.

Roboto is the work of independent type designer Christian Robertson and until I see it on a Droid device I’ll cut him and Google some slack – from the screenshots I’ve seen online it looks like a good fit.

You have to at least respect Google for continuing to improve typography by commission fonts. Microsoft are the only other major UI player doing this as Apple’s sole contribution to typefaces in the last 10 years has been a hack-job on the open-source Deja-Vu Mono to rename it Menlo, move some bars around and to trash the hinting in the process so they have something to replace the ageing Monaco with.

If you want to download the font yourself here is a complete set of the files taken from the SDK (unlike the other zip floating around this one has all variants + the licence).

Download Roboto Font Family (ZIP of TTF) (399 KB)

[)amien

IBM CGA Adapter (1981)

The IBM PC’s first color graphics card was known as the Color Graphics Adapter.

Unusual characteristics

• Mix of serifs and non-serifs depending on space
• Off centre ‘|+:’
• Squished ‘Q’ to avoid using descender
• Wide ’0′
• Bubbly ‘!’
• Inconsistent ‘t’ point and lack of serif on ‘j’

Rationale

The large bold letters work well on the low-resolution displays at the time and many of the quirky were unlikely particularly noticeable there.

Influences

Unknown.

Apple Macintosh (1984)

Apple’s second attempt at a GUI (after the Lisa) was the Macintosh. The system font was called Chicago initially as a bitmap font which was replaced with a scalable TrueType version. With Mac OS 8 it was replaced with the similar Charcoal typeface and then dropped entirely in Mac OS X which uses Lucida Grande for the UI.

This font was dusted off again in 2001 and with a few minor tweaks became the system font of the iPod (classic & mini) until the higher resolution color display model.

Unusual characteristics

• Proportional letters not fixed-width
• Some symbols are not bold at all ‘#%”/\*@^`’
• Lovely flourish on ‘&’
• Curve on ‘a’ actually touches the lower bowl
• Designed specifically to avoid diagonal strokes (jaggies) on the Mac’s low-res screen

Rationale

The high-resolution display let the designers really pay attention to detail and even though it was only monospaced it really looks beautiful for the time. It was little wonder that when Jobs went to NeXT they went with incredibly high-resolution mono displays again (at least initially).

Influences

It’s unlikely they were digital.

Commodore Amiga 1.x (1985)

The Amiga started with ex-Atari engineers desperate to design a 16-bit machine that was eventually purchased by Commodore. It offered incredible graphics and sound for the time that put Mac’s and PC’s to shame. Despite shipping with many fonts and supporting proportional text the default system font was the fixed-width Topaz/8.

Unusual characteristics

• As well as some letters touching some symbols such as ‘\/’ touched horizontally allowing nice ASCII art
• Unusual lower-case ‘g’ somewhere between double and single story
• Unusual almost comic-like ‘!’
• Some non-bold pixels for flourishes on ‘t&’
• Pixels missing on some curves ‘aS’ especially obvious in low resolution
• Over-extended ‘r’ looks odd in any resolution
• Alternate Topaz/9e – 10×9 (2 for descenders) – modified some glyphs like ‘g’ and available from Preferences as Text 60

Rationale

The Workbench booted in white-on-blue (shown) and was intended for use either with their own Commodore monitors or home TVs. Despite the choice of a serif font it worked quite well on these displays although interlace was quite unusable without specialized displays.

Influences

Very similar to the IBM CGA system font, very likely to be derived from there.

Technical

The Amiga shipped with it’s own font editor called ‘Fed’ found on the Workbench Extras disk in the Tools folder.

Commodore Amiga 2.x (1991)

Commodore’s update to the Amiga saw all sorts of changes in the ROM and Workbench for the GUI including some revisions to the font and the ability to change what font the workbench used.

Unusual characteristics

• Over-extended top of ’1′
• Open elements on ‘%@’
• Messy ‘Q’ is hard to distinguish
• Alternate Topaz/9e – 10×9 (2 for descenders) – modified some glyphs like ‘g’ and available from Preferences as Text 60

Rationale

The Workbench booted in black-on-grey (shown) and the new font looked a lot more friendly as well as being a more legible choice for home TVs.

Influences

Obvious modification of the prior 1.x font to remove serifs and improve legibility.

Technical

WBScreen allowed you to choose which font to display in Workbench including some of the proportional fonts included.

Atari ST Low/Medium Res (1985)

The Atari ST was Atari’s answer to the Commodore Amiga after they failed to purchase back the talent and technology. The machine’s GUI was based on GEM from Digital Research.

Unusual characteristics

• Descenders are cut very short on ‘pq’ despite ‘gy’ not following this style
• Inconsistent positioning between ‘,’ and ‘;’
• Ugly braces ‘()’ from the 8-bit font retained

Rationale

The font was very clear and worked well in both square pixel (low resolution) and rectangular pixel (medium resolution) modes.

Influences

Almost identical to the Atari 8-bit font but with the capital letters, symbols and numbers extended a pixel higher (inverse symmetry was no longer a concern) and more consistent/cleaner lower-case letters ‘sj’.

Technical

It is possible to change the system fonts used by the GEM desktop using the ST Font Loader.

Atari ST High Res (1985)

Unusual characteristics

• Very tall letters – some glyphs 14 pixels high but still only 6-7 pixels wide
• Avoids every trace of a serif except usual ‘Iil’ monospace hack
• Short descenders on ‘pq’ still
• Inconsistent choices for ‘c’ and ‘R’ and ‘w’

Rationale

Given that this screen mode was only available on high-resolution monitors it is very rectangular and failed to really take advantage of the unique situation in which it would be used.

Influences

Very likely based on the medium resolution font with some redrawing.

IBM PC VGA (1985)

Unusual characteristics

• Very tall letters – some glyphs 14 pixels high but still only 6-7 pixels wide
• Top bar of ‘T’ is two pixels thick
• Too-high double quotes ‘”‘ also styled inconsistently
• Another bubbly ‘!’ like the Amiga’s Topaz 1
• Inconsistent sizing between ‘,’ and ‘;’
• Very large ‘$’ even bigger than the capital ‘S’

Rationale

A reasonably nice serif font that gave a serious look if somewhat inconsistent in places.

Influences

Almost certainly based on the original CGA font.

Technical

Can be overridden by tools like fontedit.com.

[)amien

It’s quite easy to find bitmap copies of these fonts and also scalable traced TTF versions but there’s very little discussion about the fonts themselves. Let’s remedy that by firing up some emulators and investigating the glyphs.

Commodore PET (1977)

Commodore’s first business machine was the PET which came with a built-in monitor and a full character set unlike other machines at the time.

Unusual characteristics

• Primarily sans-serif but serifs present on ‘BDJa’
• Slightly stylized ‘£’

Rationale

The font is good choice for the original PET and it’s original monitor. It was unfortunately also used on the Vic-20 despite having half the screen resolution where it made a poor choice.

Influences

While not visibly influenced from anything else an almost direct rip of this font appears to have been used in the Apple Lisa debugger.

Technical

Unknown.

Apple ][ (1977)

Apple's first professionally built computer was the Apple ][ which from rev 7 onwards added lower-case letters.

Unusual characteristics

• Uppercase letters can touch descenders on the line above as the full height is used
• Only first 7 columns per glyph otherwise would have been 35×24 text
• Vertical stems for '[]{}’ are 2 pixels wide (bold)
• Very small slashes ‘/\’
• Upper-case is consistent although ‘A’ is very angular, ‘G’ unpronounced
• Lower-case less consistent – ‘gf’ has soft curves, ‘mw’ square, ‘nhr’ ignore curve of ‘u’
• Numbers – unusual ’3′ but ’96′ over-extend

Rationale

The font is well suited to the default high-contrast white-on-black (often green-on-black) given the machine was intended for use on their own monitors.

Influences

The upper-case, numbers and symbols were copied from the Signetics 64 × 8 × 5 character generator 2513 chip used in the Apple I and II in revision 0 to 6.

The later Texas Instruments TMS9918 Video Controller Chip used on Sega, Nintendo, Colecovision and TI/99 machines re-used this font with only a couple of pixels changed.

Technical

Changing the font requires replacing the 2 KB 2716 pinout ROM with your own EPROM or alternate ROM.

Atari 400/800 (1979)

Atari’s entry into the home computing market put out some very capable machines with all sorts of hardware tricks (the creative geniuses behind it would go on to form Amiga). The same font was used on all Atari 8-bit models from the original 400/800 to the XL and XE models in the late 80′s.

Unusual characteristics

• 6 pixels uppercase causes some vertical imbalance especially on ’9′
• Braces are overly bold being 3 pixels wide.
• Less than and greater than symbols are too tall.
• ‘MWw’ make great use of width to nice effect
• Bar on ‘G’ too low, ‘U’ overtly square, ‘X’ very blocky, ‘S’ does not extend enough

Rationale

The machine boots in a low-contrast blue-on-blue and is designed for use with TV’s which explains some of the odd characteristics above like the square U to distinguish it from the V. It is likely the 6-pixel choice is to allow the letters to be centered when using inverse letter mode.

Influences

Unknown.

Technical

One byte per row, 8 sequential bytes making one glyph. You can reprogram this by poking address 756 with the page number of the new font (default of 226 for ROM location 0xE000).

POKE 756, 226

Acorn BBC Micro (1981)

The Beeb, as it was affectionately known, has its own font which could display in three different modes – one wider and one narrower but many users might not recognize it all as it booted into ‘Mode 7′ utilizing a Videotex chip (used in the UK for text-on-TV and travel agents as well as in France for Minitel) that had a different font of its own.

Unusual characteristics

• Drops bold in tight spaces e.g ‘$&@’
• Outlines the tail on the ‘Q’ to make it much clearer
• Unique and beautiful ‘*’
• Does not extend low bar on ‘e’ as much as expected and ‘f’ seems to wide
• Vertically squished ‘?’
• Style of single-quote ‘ is inconsistent with comma

Rationale

The machine generally shipped with good quality monitors and the combination of high-contrast colors and this bold font made it very readable indeed.

Influences

It’s quite likely it was influenced by the Atari 8-bit font but with larger capitals and ascenders and a much more consistent look.

Technical

The system font is stored at 0xC00-0xC2FF with each character being represented by 8 sequential bytes (left pixel is high bit).
You can replace the font used by system text routine OSWRCH (0xFFEE) using the VDU command 23 followed by the ascii code and then 8 rows of data, e.g.

VDU 23,65,11,22,33,44,55,66,77,88

Sinclair ZX Spectrum (1982)

Sinclair’s successor to the ZX81 added color and lower-case letters – again preserving the upper-case and numbers from it’s predecessor but finally mapping them to ASCII. This font was re-used on Jupiter Ace and Timex machines but the ZX Spectrum was the most popular.

Unusual characteristics

• 6 pixels uppercase leaves many unevenly balanced ‘BEFS’ and ‘X’ with ugly 2×2 center
• Full stop is 2×2 pixels (bold) but colon, semi-colon and comma are not
• Capital ‘MW’ are very slight with latter hard to distinguish from ‘V’
• Uneven styling ‘c’ omits curves, ‘e’ is soft ‘g’ is not, ‘f’ and ‘k’ are thin
• Only the copyright symbol uses to the top row of pixels

Rationale

While the machine has a default high-contrast scheme the video output was poor because of the quality of the RF modulator and home TVs it was connected to. It looks like the designer decided to increase spacing between letters after the ZX80 from one to two pixels which greatly limited what could be done with the letters themselves. This was likely done for the same reasons it was done on the Atari 8-bit – namely to allow the letters to be centered when using inverse text modes.

Influences

Sinclair ZX81 (no lower case), ZX80 (7 pixels wide).

Technical

The system font is stored at 0x3D00-0x3FFF with each character being represented by 8 sequential bytes (left pixel is high bit). You can replace the system text routine (RST 10) by poking the new fonts memory address into the system memory map at 23606/23607 minus 256 bytes (the first 32 characters are non-printable, 32×8 = 256)

LOAD "newfont" CODE 49152, 768: POKE 23606, 0: POKE 23607, 191

Commodore 64 (1982)

Commodore took to take their success with the PET and applied it to the home first with the VIC 20 and then later with the wildly successful Commodore 64.

Unusual characteristics

• Inconsistent shapes/style across ’147,&<>@Q’
• 2×2 pixel of ‘.’ is not carried through to ‘;:!’
• Ascenders not as tall as capital letters

Rationale

The bold font was essential for the low-quality TV’s Commodore were aiming at. The inconsistencies across the font may have been intentional to help make the letters look different (A vs 4, 1 vs I, 7 vs T) given the limitations of the displays or just poorly implemented (see below).

Influences

Lower-case is identical to the Atari 8-bit font and likely copied wholesale as they do not match the upper-case well. Symbols, numbers and upper-case are a bolded version of the PET font that looses the serifs and also could explain the odd reproductions of 1, 2, 7 & 4.

Technical

See comment from Paolo below for details!

Amstrad CPC (1984)

Alan Sugar’s foray into the UK market came a little later than the other 8-bits in 1984 with the Amstrad CPC series.

Unusual characteristics

• Full use of 7 pixels for upper and 1 pixel for lower means glyphs can touch
• Serif choice is unusual and not consistently applied because of space constraints
• ’0′ is wider than would be expected (copied from
• Very distinctive curves on ‘CGOQ’
• ‘X’ looks like a different style because of high mid-point

Rationale

Sugar wanted the machine to look more professional than other home computers at the time. The choice of a serif based font to look like PCs which also featured serifs (at a higher resolution) reflects that desire.

Influences

Very similar to the IBM CGA font with some adjustments (fixes) to the horizontal positioning of some symbols. Many characters completely identical and some bearing style similarities too (wider 0, X choosing one side to be longer than the other). Some other characters bear similarity to the BBC Micro (Q uses the same trick to keep it distinguished) and a number of symbols and lower-case letters being the same where serifs would not fit.

The Amstrad CPC manual shows the system font but is different in some areas. It is possible it is a transcription problem (z is shifted up one pixel, missing pixels on ’37PRz~’ and extra pixels on ‘#b’ ) although it could have been an earlier version from the designer as ‘rG?’ are subtly different.

Technical

Redefine using the Amstrad BASIC command SYMBOL that takes an ascii code and then 8 comma-separated values one-per-row in much the same way as the BBC with the VDU 23 command. SYMBOL AFTER must be set first e.g.

SYMBOL AFTER 32
SYMBOL 65,11,22,33,44,55,66,77,88

MSX (1983)

The MSX differs from the other machines here in that it was a standard rather than a specific machine. It was very popular in Japan and did hit UK shores although I only knew a single person that had one apart from our school which had acquired several Yamaha models to control MIDI keyboards. Given the multiple manufacturers it’s not surprising that some models had slightly tweaked fonts but the one shown here seems to be the most popular.

Unusual characteristics

• Full use of 7 pixels for upper and 1 pixel for lower means glyphs can touch
• Only 5 pixels wide for the letters
• Pixels touching on the curves of ‘db’ etc. look quite ugly
• Very angular curves on ’5′

Rationale

An unusual choice that feels very quirky.

Influences

Most likely influenced by the Apple ][e.

Technical

Unknown.

Mac users should try Cathode – a retro terminal emulator I helped add some of these fonts to.

For more system font analysis read the sequel Typography in 16-bits: System fonts.

[)amien

Bitmap v scalable fonts

Bitmap fonts are incredibly easy to make. Using a program like Softy or BitFonter you decide the size of your letters and start plotting pixels. You can see exactly how it will look because you draw every glyph (letter/symbol/number) in every size you want to support. This can obviously be very time consuming and doesn’t let you take full advantage of the resolution of the device and the capabilities it offers. A printer can handle in excess of 300 dpi while a display is typically 72 dpi (Mac) or 96 dpi (Windows) with LCD’s supporting sub-pixels due to the individual layout of the red-green and blue elements you can’t feasibly pre-plot every single combination and even if you could the file size would be rather large.

Rather than having specific set of pixels to turn on or off TrueType, OpenType and PostScript fonts contain a series of instructions that tell the computer the shape using a series of points, lines and curves. This means the computer can scale the glyph to the size that is required and then take full advantage of the device being rendered honoring the users preferences for anti-aliasing (smoothing using shades of grey), sub-pixel precision (smoothing using hints of red, green and blue to take advantage of the layout of colour elements in an LCD display), desired contrast and gamma settings etc.

Grid fitting

Such a scaled glyph won’t fit perfectly within a pixel grid and a small sizes and low resolution it can look awful. It is also necessary to ensure that the vertical part of the letter I (known as a stem) looks very similar to the stem of other letters at the same size – we don’t want some letters looking bold – and that the top of the letter o aligns nicely with the top of the i etc. (in most fonts). The glyphs themselves don’t know what is a stem, what should align with other glyphs etc.

Many renders include logic to try and improve un-hinted fonts such as the drop-out control in Windows through to the full auto-hinter in FreeType. If you’ve ever used free fonts from any of the numerous web sites around you’ve probably seen that it doesn’t get it right and it looks like this: 

The first few versions of Envy Code R looked like that because to address this problem you need to learn a process called hinting, which let’s the designer give the renderer “hints” on how to choose the pixels.

Hinting

Font hinting started off as stem and edge identification so that glyphs would maintain the right proportions when sized and rendered on these low-DPI devices. It became apparent that a much more fine-grained level of control was required and so a stack-based byte-code language was developed as part of the TrueType specification to allow designers finer control in how points are adjusted to better take advantage of the display characteristics.

A TrueType font can contain extra blocks which describes, using a sequence of bytes that represent instructions and their arguments, the process by which to align the points and therefore make decisions about how best to fit the letter into the grid by retaining and adjusting various elements.

The important blocks are:

Each instruction (opcode) has a mnemonic that is representative of what it does and these are documented in Chapters 5 through 6 of the TrueType specification (along with much other useful relevant information). Actual per-glyph instructions are stored with each glyph outline in the glyp block.

Rasterizing & rendering

There are many different ways a TrueType font can end up on your screen with a lot of variants between how vendors chose to render the font and what options they expose to developers and users to fine-tune the experience.

• Windows – User choice of 1-bit, 4-bit grey-scale anti-aliasing, ClearType, ClearType tuning and display DPI plus WPF and DirectWrite per-app options
• Mac OS X – User choice of sub-pixel anti-aliasing strength and 1-bit cut-off plus per-app 1-bit option (e.g. Terminal)
• Java – Per-application choice of 1-bit, grey-scale or sub-pixel rendering
• Flash – Per-application choice of 1-bit or grey-scale
• FreeType – Rendering library that exposes a number of runtime and compile-time settings

This is of course ignoring the other rendering engines out there such as the Adobe’s Photoshop, RiscOS, D-Type rendering engine, Font Fusion (used on BeOS) etc. and prior versions of those renderers listed above (Flash and Mac OS changed significantly). Getting it pixel-perfect on every combination is impossible but we can try :)

Tools

Instructing fonts is a painstaking process at the best of times and few people deal directly with the low-level instructions instead relying on tools, stem identification and higher-level languages to achieve the same result. Some tools that have support for hinting instructions are:

• FontLab Studio 5
  Comprehensive font-production package for Windows and Mac that includes auto-hinting and it’s own higher-level link language that it can generate TrueType instructions from but it does not support viewing or modifying existing TrueType instructions and does not handle diagonals well. Rendering preview includes mono, grey-scale and ClearType. (Commercial $649)
• Fontographer 4.1
  Rather dated font-production package for Windows and Mac. (Commercial $349)
• FontForge
  Comprehensive font-production package that runs on X11 that includes auto-hinting and the ability to disassemble and edit existing TrueType instructions as well as debug them with stepping. Includes basic mono/grey-scale rendering options. (Open source)
• Microsoft Visual TrueType
  Hinting instruction tool from Microsoft that uses it’s own higher-level VTT Talk language that compiles down to TrueType instructions that you can further edit. Includes a comprehensive set of preview rendering options but is not capable of disassembling existing instructions. (Commercial, free with signed licence agreement)
• TTX
  Python scripts that can convert a font into an editable XML representation and back including disassembly and assembly of TrueType hinting instructions. (BSD)
• TTIComp
  Command-line tool that provides an alternative C-like hinting language. (GPL)
• Xgridfit
  FontForge scripts to provide an alternative XML-based hinting language. (GPL)
• TrueTypeViewer
  Windows tool for displaying TrueType fonts and glyphs including debugging and descriptive disassembly of instructions. (GPL)
• TTHMachine
  Real-time editing of hinting instruction mnemonics and observing their effects which is useful for learning. (Free, no longer supported)

[)amien

These discoveries form the basis of much of the technology we use today and include the desktop metaphor, the graphical user interface, laser printers, object orientation and Ethernet.

Xerox manufactured a number of high-end machines including the 1973 Xerox Alto which, being GUI based, shipped with a number of proportional bitmapped fonts.

What is interesting to me however is the mono-spaced font used by the SWAT debugger (but not by the command prompts, they were proportional – ahead of their time!) and so, based on a screen-shot of SWAT, I thought it needed to live again!

I’ve had to make up a few of the symbols and letters that weren’t shown and filled out the symbols for the Windows 1252 Latin-1/ISO-8990-1 code-page and with the absence of any solid information online give it a name so here is Alto Mono!

Download Alto Mono (TrueType, Windows FON, BDF) (30 KB)

When using the TrueType version choose 6 point on Windows and 8 point on Mac OS X.

The Xerox manuals are also fun to browse though with such section headings as “Things the user doesn’t really need to know…” and “How to get out of trouble” and the comments about SWAT’s odd syntax and interface.

Don’t forget to check out my reproduction of the PalmOS system font. Not monospaced but very clear at small sizes – great for the Visual Studio output window ;-)

[)amien

It’s been a struggle but finally after countless hours here it is, the next release of my Envy Code R monospaced (fixed-width) font designed for programmers.

Many glyphs have been redrawn since preview #6 including braces, lower-case y, 6 & 9, ampersand, dollar-sign, hash etc. One pixel was removed vertically height to make the box drawing balanced and allow more lines per screen.

These new box-drawing, shading and symbols make Envy Code R a great font for the command-prompt (Consolas and Lucida Console lack box-drawing completely). To use them you will need to run the included registry file and reboot to operate correctly from a command prompt’s properties dialog.

This typeface contains over 550 glyphs providing full complements for DOS, Windows and Mac versions of the US, Western, Central Europe, Turkish, Baltic, Icelandic and Nordic code-pages. This hits several Unicode ranges including Basic Latin, Latin-1 Supplement, Latin Extended A & B, Box Drawing, Block Elements, Letterlike Symbols, Number Forms, Arrows… although not all of these ranges are complete yet.

As well as regular and bold variants this version includes a full italic version too and the obligatory italic-as-bold hack to get italic syntax highlighting in Visual Studio as shown here in my favourite 10 point with my Humane theme.

And for those of you that like the font a little larger it now looks good and the odd sizing issues are all gone!

Okay, enough with the teasing, you’ve waited far too long…

Download Envy Code R Preview #7.2 (TrueType) (169 KB)

These files are free to download and use from damieng.com but CAN NOT be redistributed either by other web sites or be included in your package, download, product or source repository at this time.

[)amien

Joining Microsoft

For those who haven’t been following my blog long I took a job at Microsoft Canada Development Centre as a developer on LINQ to SQL. It turns out my H-1B Visa has been approved and I will be moving down to Redmond in October.

Joining a company of Microsoft’s size is a daunting experience. The sheer number of people, departments, systems, procedures and intranet sites to navigate and learn plus of course the actual job of jumping into the product and seeing where we go from here. I’ve also been helping out a little on the forums and internal lists and getting involved in the regular scheduled update meetings.

Of course you also hear all sorts of interesting news just before it becomes public knowledge such as publishing XNA apps to Xbox Live! and Office getting ODF and PDF support.

On the personal front…

A whirlwind couple of weeks full of new employee orientation, relocating, getting lost, filling in forms, exploring, meeting a couple of hundred people and catching up with a few old friends including one from Guernsey all of which lead to a quiet blog.

There have been some personal stories of getting lost, baby sharks and falling in lakes which will be kept to email now – there’s no way those 500+ subscribers are here for my personal bits! I’ll be sending out an email this week so if you haven’t seen something by the weekend and we’re friends ping me and I’ll forward you on a copy.

Some photos are up on Facebook with a few more to follow.

Envy Code R

Of course what everybody really wants to know (according to my inbox) is where Envy Code R preview #7 is.

It is coming, but every time I think I’m close to a release I find another annoying glitch all related to hinting.

Hinting is the process whereby you tell the rendering system how to shape the characters to better fit into a pixel grid. It consists of a table saying at which sizes to smooth and apply instruction plus a program that adjusts the font as a whole for a given size and then a program per-glyph that tells it how to adjust the points in relation to each other with delta hints providing modifications for specific point sizes.

It’s a complicated process if you’re doing it at the lowest level with a tool such as Microsoft’s Visual TrueType but is made easier with a tool like FontLab Studio 5 which has an autohinter that often gets things wrong but is a lot easier to work with and works with hints at a higher level of abstraction.

Which is why I parted with $999 on FontLab and I’m going to investigate a donate option to try and recoup some of those costs.

The bold variant is the only one now requiring hinting and I’m hoping to have it done in the next 24-48 hours. The regular variant looks just great… as does italics.

[)amien

These look great – even more so when you consider there are no embedded bitmaps and very few delta hints.

There is still a lot of work to do – all the foreign characters, symbols and box-drawing characters (another 600 glyphs) require hinting and I should test it on the Mac, Java and Flash font rendering engines to make sure there are no show-stoppers there.

Preview 7 will consist of of just a plain style regular and bold because I need to get this out – it’s been too long since the last release. Preview 8 will add back italics and the Visual Studio italics-as-bold hack shortly afterwards.

Check out Talios’s shots using Java/Linux and Eddy Young’s shots in NetBeans.

A newer version of Envy Code R is available.

[)amien

Many articles later, some playing around with Microsoft Visual TrueType and much frustration and experimentation later I think I’m on the right path.

Here is how Envy Code R is looking on Windows right now with standard font smoothing.

ClearType doesn’t look as good and I’m still learning the black art and the implications of each type of hinting instruction.

Strangely, these hints seem to be ignored on the Mac which is still rendering everything a little too thick especially on curves. Perhaps that is why so many developers create a Mac-specific version?

Once I’m happy with how the regular version works I’ll put it online for download and then whip the bold and italic variants in to shape and any feedback into regular for the proper 0.7 release.

A newer version of Envy Code R is available.

[)amien