Type design with Font Forge

I am learning how to use Font Forge to create fonts. The book seems a little shitty, a little mix of authors and sources, some of whom don’t seem to know English as a first language. It’s certainly not professional and they constantly talk about professional font design tools.

My goal is to produce an uppercase Celtic No. 4.

Questions and goals

In the short term, I should carefully study a single open-source typeface as vector outlines and make notes. Perhaps Charter? One of my favorites. It would be good to accumulate a deep knowledge about some of these typefaces.

Learn more about the differences between OTF and TTF

Notes

Type design is a system, lettering is one-off ‘beautiful collection of letters’.jpg

UPM refers to units per M (largest letter, EM square) OTF UPM convention of 1000, TTF of 1024 or 2048.

Your baseline, x-height and cap height guides are configurable under the Element label. Keyboard shortcuts are highlighted by the single character underline on the menu item label.

Why should control points be on the extreme of the curves for font characters? To ease rasterization. I need to read about rasterization. There are exceptions, when you want to change the slope of the curve, and for certain discontinuities.

A line is described by two points, a spline by four points (handles + points).

FF does offer Boolean add and subtract: Subtract = ‘correct direction’ Add = ‘Remove overlap’

Serif vs. Sans serif has no good conclusion about readability at this attraction, I think you need to get specific about the type design itself.

I need to read more about how font readability is measured.

Videospan and Adhesion are the early words used to test type designs. You start with an o then add an n.

I need to get into the habit of using programs to generate sample texts:

Adhesion text is the name of one of these programs
JAF generator is another

Accents affect required line-height (nice visual example of Czech and English text, same font, same line-height, Czech felt cramped).

When drawing punctuation, start with a period.

You will need to escape brackets and hashtags in the FF preview window, since they have meaning.

You can and should automate positioning of diacritics using anchor points.

Lining refers to the height of the numerals. Use old-style inside text like 123 but use tablular for tables of data, by itself to be scanned.

One of FF’s perks is its font weight interpolation algorithm which the books claims is quite sophisticated.

The chapter on Spiro curves was almost superfluous, I learnt almost nothing, with the exception of a step by step guide to produce an S.

There was a beautifully idiotic line about ‘fonts are an API for text to access associative feelings in readers’!!!! Seems stupid

As a general rule, err on too much wordspace since it aids readability.

Curves Bezier - Cubic (3rd order? x + y + z) - Quadratic (4th order? x + y + z + a) Spiro

Points in FF

Curve point (round label) handles link by straight (but not neccessarily horizontal or vertical line)
H/V curve point (lozenge label) handles linked by horizontal or vertical lign
Coins (square label) independent handles, for discontinuities in the outline
Tangent (triangular label) producing a curve from a straight line, one handle

Italic refers to a calligraphic style that was popular in Italy in the 14th century. It used to be used to set entire texts.

THERE IS A GUTENBURG BIBLE ON MANHATTAN. Annaliese was telling me. Also, it’s funny that it took 300 years for printers and typographers to write books about typography — how long was the equivalent span for the web? We have been navel gazing from the off! I will arrange a visit with Roy.

I am up to page 133.

I read the rest of this book in the backyard of the Surf Cafe Saturdays in Soho where Roy bought an ill-fitting suit (intentionally).

Side bearings - Space on either side of a glyph. They won’t necessarily be the same. Symmetric characters tend to have the same side-bearings

What is the process for determining side bearings for your font? Starting working out the ones for ‘o’ with a string of ooooooos. Then incorporate ‘n’ into the string ooononononononon. Then use the left edge of n for letters like bhkmpr and the left edge of o for edcq etc.

Start with H for uppercase characters.

Kerning

Only ever refers to the specific space between two letters. Not a general property of a single letter. WTAV and the most important letters to kern. Font Forge comes with an auto kern algorithm.

The word kern comes from Latin cardo meaning hinge

Validation

Once the design is complete, on to the task of producing font files for different operating systems. It’s a difficult problem and the requirements vary. A few typical ones:

Integral coordinates (all coordinates are integers, not floats)
Outermost points go clockwise (required by all formats)
Remove all intersecting curves
Remove stray points (> 32bit number away)
Make sure no more than 1500 points per glyph by convention
Have points at all curve extrema
Catch lines which are near-horizontal but not quite, near vertical, near italic.

Evaluating legibility

Check the distinctiveness of L & 1, O & 0, Z & 2, 1 & 7

Hinting

Part of the rasterization process. Typically handled by the OS. Mac and Linux ignore all font hinting rules in the file. Windows requires them. Use the tool ttfautohint to produce these hints.

Serifs were evolved to aid stone cutting

Look into ‘Panose’ which is a system for classifying fonts

‘Gothic type’ started as an insult to the German blackletter. The Italian type designers were working on Roman revivals.

Generating fonts

OTF and TTF are the two major formats. For TTF use ‘All layers quadratic’ function.

For both, use the ‘simplify’ tool to reduce file size and shape complexity. For both, use the ‘add extrema’ tool to add points at curve extrema. For both, use the ‘round’ tool to make sure all coordinates are integers.

Resources

Useful tool to learn bezier: https://bezier.method.ac/

Optical Compensation by Thomas Phinney and FontLab Type Review Videos Lato: The Making Of Thomas Phinney’s Type Design Resources http://pomax.github.io/bezierinfo/ Excellent guide to the math of Bezier curves

Useful discussion of text rendering: https://medium.com/@evanwallace/easy-scalable-text-rendering-on-the-gpu-c3f4d782c5ac

Index of calligraphic works: http://www.digital-scriptorium.org/highlights/