FF Attribute – a typeface (not only) for coding

Viktor Nübel
5 min readJun 20, 2018

--

The typeface FF Attribute–initially designed for the use in a code editor. (Promo image by FontFont/Monotype.)

FF Attribute is a type family of seven weights and an extended character set. The typeface comes in a monospaced version and a non-monospaced version.

In 2015, while working on a little side project, I spent a lot of time in the code editor instead of, as usual, in Photoshop or InDesign. I tried out many of the available monospaced fonts. The last years have seen something of a revival of this genre, probably because of the fact that coding and programming have become more and more common and widespread, including among designers.

I started experimenting with my own monospaced font. It took me a while to figure out the exact adjustments a font file needs to get accepted as a monospaced typeface by the system (in Windows, the key words are advanceWidth and isFixedPitch!), but once this was sorted out I started to design and use my own coding font.

The biggest challenges when creating a monospaced typeface are the very narrow letters, like i or l or 1, and the very wide letters, like M or W or Æ. This challenge grows when your are not only designing the weights Regular and Bold, but going into the extremes —from Thin to Black.

The biggest pleasure when designing a monospaced typeface: there is no kerning! To know you’re not going to have to deal with this last step of every type design process — the hours or days of checking and correcting hundreds of letter combinations — is a great relief.

All letters are equal — the spirit of monospace!

Coding Fonts

Dozens of scripts, extra tools and addons can help with the design and production process of a large font-family. For FF Attribute I established this workflow: I had two Multiple-Master files with a weight axis from Thin to Black, one for the normal, upright style and one for the italic style. The main application for the design was FontLab 5.04. To generate the seven inctances/weights and to create test fonts I had to switch to FontLab version 5.2 – the script for doing that would only work in this version. It generated post script and metric files and a bunch of other meta files that help to organize the naming and functionality of the whole type family, but it would not create installable font files. To do so I had to ran a command line batch file to generate otf- and ttf-files. Finally these 14 fonts files (7 weights in two styles) were processed through an autohinter, to increase the screen quality of the fonts.

Windows command line batch file (build.cmd) to generate test fonts.

This way the whole process of creating test fonts tooks approximately two minutes, doing it by hand would take ten at least. Sometimes in the process it felt more like programming the typeface instead of drawing it. Additional scripts helped with the design of small caps, small numbers and superscript. In the code editor there were files for the OpenType features and OpenType classes, the batch file for generating the fonts and a file for organizing the family naming.

All characters with a unicode, all weights and styles of FF Attribute.

Details

Designing and extending the typeface took more than a year. Every one of the seven weights of FF Attribute comes with over 1500 glyphs. This supports a wide range of Latin languages, Cyrillic, Greek and Vietnamese. Also there is a set of icons and box drawing elements, which is useful if the font works on the system command line level.

For a coding font certain design standards are requiered: a slashed 0 (or, in this case, a zero with a dot), I, l or 1 should all be easily and clearly recognizable and a semicolon, colon, brackets or question mark should be very visible.

The process is a long sequence of solving tiny design problems and making tiny design decisions… to take just one example, the t-issue: in order to work with a very short, classic bracketed/triangular top of the t, I run into the problem that this part became very black and fat in some weights and could make unusual spots in the text pattern, especially in the Regular weight (where as in the light weights this feels more like a design feature, in the normal weight this would disturb the reading process.) To solve this, I had to cut off a bit of the crossbar (see image), which is not really visible in small font sizes but takes a bit of the blackness from the letter.

Detail of the small letter ‘t’.

No Kerning?

To my surprise in 2016 FontFont decided to publish the typeface in their library. Together with the staff from FontFont we decided to accompany the monospaced typeface by a mono-faux version — FF Attribute Text is the proportional version.

In FF Attribute Text for the most problematic, distorted characters like i, m, w, etc., the design was normalized and the strict one-width-rule was set aside. This way it is possible to keep the character of the typeface but make the legibility much more natural. At this point the fun of ‘No kerning’ was gone…

Text version of FF Attribute — some letters need more space then other ones..

See the font in detail on www.fontdrop.info.
FF Attribute is available at FontShop and MyFonts.

--

--