Draft
edit

What is interpolation?

At its most basic level, interpolation is finding a number between two other numbers.

The basic interpolation formula is: start with one value (a), than add a fraction (factor) of the difference with another value (b).

a + factor * (b - a)

Translating the formula into code:

def interpolateNumbers(factor, a, b):
    return a + factor * (b - a)

print(interpolateNumbers(0.3, 0, 100))
print(interpolateNumbers(0.3, 200, 500))
>>> 30.0
>>> 290.0

Interpolation can be applied to anything that can be represented as numbers: position, dimensions, colors, and glyph shapes too.

Terminology

masters
Data objects that are used in an interpolation system.
instances
Data objects generated by interpolating the masters.
interpolation factor

A number between 0 and 1.

  • factor=0: result is identical to first master
  • factor=1: result is identical to second master
  • factor=0.5: result is exactly between the two masters
extrapolation
Interpolation with factors outside the 0, 1 range.
axis
The particular change in an object when interpolating from one master to another.

Extrapolation

Extrapolation is using interpolation to find a number beyond two other numbers – using a factor that is less than 0 or greater than 1.

print(interpolateNumbers(1.2, 200, 500))
print(interpolateNumbers(-0.2, 200, 500))
>>> 560.0
>>> 140.0

Interpolating colors

To interpolate between two n-dimensional objects, we simply interpolate each dimension separately.

Here’s an example using (r,g,b) colors:

def interpolateColors(factor, c1, c2):
    # unpack color tuples
    r1, g1, b1 = c1
    r2, g2, b2 = c2
    # interpolate each color channel separately
    r = interpolateNumbers(factor, r1, r2)
    g = interpolateNumbers(factor, g1, g2)
    b = interpolateNumbers(factor, b1, b2)
    # return resulting color
    return r, g, b

print(interpolateColors(0.5, (1, 0.1, 0), (1, 0, 1)))
>>> (1.0, 0.05, 0.5)

Interpolation requirements

Interpolation works only if the two data objects being interpolated have the same “topology”.

  • same amount of dimensions
  • matching types of dimensions

Interpolating glyphs

A glyph is a collection of numbers too: the position of all points, anchors and components, the glyph’s advance width, etc.

The RGlyph object in FontParts has an .interpolate() method which takes an interpolation factor and two glyphs as input, as stores the result.

glyph.interpolate(factor, glyph1, glyph2)

The interpolation factor can be a tuple of two values, one for each dimension:

glyph.interpolate((factorX, factorY), glyph1, glyph2)

The RFont and RKerning objects also have an .interpolate() method.

Interpolation workflow

Interpolation can be used in different stages of a project:

Interpolating glyphs

In the design stage, you might want to interpolate a few glyphs only, to see how the result looks like – making quick tests with key glyphs to find the right interpolation factors.

Interpolating fonts

In the production stage, you can interpolate a whole font, or a series of fonts at once – without using the UI to speed things up.

Complete interpolation between fonts involves interpolating not just the glyphs, but also the kerning and some numerical font info attribuets, such as blue zones, OS/2 weight numbers, etc.

GlyphMath

MutatorMath

Complex interpolation with arbitrary number of masters, multiple axes, rules etc.

Superpolator

MutatorMath with a nice UI + other features.

Last edited on 28/03/2018