AI-kerning for typlr.app

What kind of service nowadays does without a Powered by AI label? I would like typlr.app to also get a beautiful nameplate. To do this, I came up with a prototype of automatic kerning and tested it in operation.

Usually, the typedesigner handles kerning manually or uses some kind of optical algorithm. But why not try machine learning for this.

The prototype has a simple architecture. This is a convolutional neural network, with two inputs and a classifier at the output. There are two 128-by-128 pixel bitmap images at the input. All letters are centered and have the same size.

Architecture

The classes at the output are the values of the distance from the extreme borders of the letters, rounded to five units and limited in the range from minus 250 to plus 250.

Апроши

To measure the letter-to-letter distance, you need to extract the pairs and the kerning value from the font file and add them together.

Google fonts with an OFL license were selected as a training sample. There are more than 3,000 free fonts in the Google font repository. Only two hundred random fonts were taken for the test.

Speaking of the package. Convolution is a special architecture of neural networks that uses certain "filters" to analyze the characteristic qualities of images. An example of the visualization of the second layer for letters.

Filters visualization

The model was trained for 9 epochs in batches of 16 observations from a sample of 408884 pairs of Latin uppercase and lowercase letters. Where, by the 9th epoch, an accuracy of 54.9% was achieved on the test sample.

There are unexpected predictions in the results, but there is a noticeable correct trend, as in the VA or TJ pairs. It is important to keep in mind that the sample was random and had no other additional parameters. The fonts in the examples did not participate in the training.

Graphik LC test


Graphik Bold LC test


Times New Roman test

The new feature is built into the typlr.app font editor, but is only available for testing.

Typlr Sans. In pairs — top without kerning, bottom with predicted kerning

Evgeniy, what have you done!

Hi! My name is Evgeniy Agasyants. I am a designer of interfaces, logos, and everything that can be shown on the screen or printed on paper. Produced photo shoots.

In my free time I create fonts and develop a web font editing service typlr.app