What’s the Difference Between Variable and Parametric Fonts?

Learn it now, because these shapeshifting fonts are only getting better, and more common.

AIGA Eye on Design
AIGA Eye on Design

--

By Angela Riechers

The development of new typefaces is inextricably linked to the technology available to make and reproduce them. Although the idea of parametric and variable fonts has been around since the late 1970s, it hasn’t been until fairly recently that designers the morphing, shape-shifting type — and the technology to create them — has become available. Both of these categories of type move away from the notion of a typeface delivered as a final, static, unchangeable product. Rather, their flexible formats allow a degree of randomness and user input to arrive at the final result.

For the uninitiated, a brief vocabulary lesson: generative or variable typefaces are typefaces that allow a single font file to behave like multiple fonts, with an infinite variety of potential weights, widths, and other attributes. Parametric fonts, on the other hand, operate between a set of defined parameters, providing widely adjustable alternates for x-height, stroke width, and letter width.

Variable fonts make responsive web design possible, allowing type to automatically adapt to the limitations of various screens and browsers. FIT Hebrew is a good recent example of a variable font:

Fit Hebrew is the first commercial variable font for the Hebrew language. Courtesy Oded Ezer.

A more analog example is FF Beowolf, one of the first typefaces to arrive at the party during the 1980s, when all forms of digital type were in their infancy. By 1990, it had been acquired by the Museum of Modern Art’s permanent collection. To create it, designers Just van Rossum and Erik van Blokland altered the standard programming in PostScript fonts to allow a degree of randomness that occurred after the type was set. The type would change as it went through the printer, resulting in unpredictable results each time.

Beowolf, an early experiment in variable fonts, is part of the Museum of Modern Art’s permanent collection. Courtesy MoMA.

After that, designers seeking to create generative type began developing the necessary coding and algorithms to get the job done. But it took until 2016 for generative type to take a huge leap towards the mainstream, when Google, Adobe, Microsoft, and Apple joined forces to jointly develop OpenType Font Variations. This technology interpolates a font’s entire glyph set or individual glyphs along up to 64,000 axes of variation (weight or width) and to define specific positions in the design space as named instances (bold or condensed).

To understand this technology in practice, look to the 2016 redesign of New York City’s New School identity, for which Pentagram partner Paula Scher employed a variable typeface by Typotheque founder Peter Bil’ak. The bespoke typeface, Neue, is governed by a custom algorithm which alternates regular, extended, and very extended widths of the same font within a block of type. The logo itself is designed to be reconfigurable and flexible as well.

Parametric systems work a bit differently than variable fonts, by interpolating (similar to morphing) from two or more master designs for each character. The most advanced and complex systems generate whole fonts from a single, cleverly designed master font.

The term parametric originates in mathematics, where it describes equations that use one or more independent parameters to express coordinates defining a curved geometric object or surface. Parametric type first appeared on the design horizon in 1977 when mathematician Donald Knuth introduced Metafont, a programming language reliant upon geometric equations to construct its letterforms. For type systems, parametric coding allows a user to globally apply changes to each component of a letterform — such as its stem width or serif — based on algorithmic values defined by the type designer. The coding allows designers to quickly tweak letterforms using sliders to get instant previews of the end results. For an example of a contemporary parametric typeface, take a look at Antique Gothic.

Antique Gothic was created by Prototypo, which, along with Metapolator, is a good example of a current project experimenting with parametric type. Dan Rhatigan, senior manager of Adobe Type views parametric type as reinforcing the idea that a typeface is not necessarily fixed until it’s delivered to someone. “I think of tools like this as grouped in a bucket with what a few folks are trying to do with delivering web fonts from source files, instead of delivering stuff that’s already been generated or produced,” he says.

Fonts drawn with existing traditional font editors can be loaded into Metapolator using the Unifed Font Object (UFO) format and the program will interpolate them with unlimited masters and axes. With this tool, a type designer is still part of the equation, mapping out the variables and saying, “OK. At this size we’re going to make it this thick. When it gets bigger, it’s going to be this thick.” In other words, it’s not a haphazardly randomized system; a qualified professional is using his or her expertise to define the range of the typeface’s appearance.

“It takes a certain amount of craft to experiment with the kind of variables to typography that software like Prototypo does automatically,” says Scher. “It saves you a couple of hours of work: You can see a typeface in different widths, you can see it with serifs and without, you can manipulate it very quickly. The possibilities are huge, because you can insert any font and explore the whole breadth of typography within that.”

For graphic designers, both variable and parametric fonts afford the ability to fine tune existing fonts to their needs across a range of media, making sure type looks its best on browser windows and mobile devices as well as printed collateral. Typeface designers have an opportunity to think about their craft in an entirely new way, building in a system of experimentation within the structure of the letterforms themselves. The future likely holds more typefaces with generative, responsive, and reactive qualities driven by clear and practical intent. Imagine, for example, a font that can react to the viewport of the web browser. Perhaps the greatest use for variable fonts will be in the virtual, dimensional worlds of AR/VR, where the rules for how type is designed and behaves don’t even really exist yet.

Angela Riechers is an award-winning writer, art director and educator living in Brooklyn, NY. She writes primarily for design-related publications, including Wallpaper, AIGA, Print, Metropolis, and Design Observer. She is Program Coordinator for SVA TypeLab at the School of Visual Arts in New York. Her favorite typeface at the moment is Knockout.

Originally published at eyeondesign.aiga.org on May 16, 2018.

--

--

AIGA Eye on Design
AIGA Eye on Design

The best new work by the world's most exciting designers - and the issues they care about, from @AIGAdesign's Eye on Design.