THE NEXT BIG THING—IN FONTS
We’ve been hearing about OpenType Variations.
Where did they come from, and where are they going?
KERNAL OF AN IDEA: Skia, a 1993 variable font, was made in TrueType GX, the Apple answer to Adobe’s Multiple Masters. Code by Font Bureau’s David Berlow, design by Matthew Carter, Skia is still in the Mac system, if you can find an app to set it.
DESIGN AND TECH are hard to separate today, even if you wanted to. And you can’t start a magazine about design without talking about the latest technology. In type, that’s Variations, announced last year at ATypI in Warsaw on an Olympian plinth with representatives of Google, Apple, Microsoft and Adobe.
A variable font is one digital file that can produce a multitude of styles. As Canadian type designer John Hudson put it: “A single font that behaves like multiple fonts.”
The same variable font might set text in light, or regular weights—or bold, black or every-thing in between. It could set all the widths from compressed to expanded. And you can blend these to come up with, say, a light wide style with the same font.
Google is gung-ho about Variations because combining styles eliminates the data that are duplicated for every style in a family. Instead of separate outlines for each style, variable fonts interpolate styles along an axis, like weight. The target style is created on the fly. One variable font file can be as versatile as an entire family of fonts, but at a fraction of the file size.
For graphic designers, not always troubled about network resources, this is a benefit. How many times have we done a site design with a sweet palette of fonts, and been told that we had to cut the number of fonts down to six—from, uh, 30?
Webmasters worry about latency since any delay is unacceptable to users. They leave..
The big companies are focusing on the weight, width, and optical size axes—where they can get the most savings for network resources. These (plus slant) are the first to be included in the OpenType Variations official specs.
Google commissioned David Berlow to design a proof-of-concept font late last year. He came up with Amstelvar, which starts with the three axes. (Disclosure: I started the Font Bureau with David.)
Then Google went for a second demo showing more axes with design features, like serifs! This is Decovar—one font that can morph from bracketed serifs, to slab, to chiseled, to no serifs at all, or even rounded terminals. The stems can be plain or can sprout goth-like decorations.
Out of one, many
Infographic: David Jonathan Ross (whose DJR foundry distributes at Type Network).
THIS REVOLUTIONARY IDEA is actually more of an evolutionary step. Some saw it coming for 30 years. Variations fits with the parametric design theories proposed by Gerrit Noordzij, now 86, the design guru at the Royal Academy in the Hague.
Noordzij said in the ’70s that by programming design we can achieve the fluidity of handwriting. His school pushed the idea of defining parameters (algorithms) to make typography respond to all kinds of data, with the goal of improving the way we read. We’re not there yet, but variable fonts can make it possible.
Meanwhile, Berlow was think-ing about the connection between type and the screen, and saw a pattern in the history of type—from handset to machine composition to phototype to digital type to desktop to the web to the “internet of things.”
He used computers to produce the master drawings for fonts at Mergenthaler in the ’80s using Ikarus, the first outline design software for type.
By the ’90s, after switching to desktop systems and TrueType, Berlow thought: Why not get the Ikarus-style interpolations to work on the fly? In ’91 Adobe released Multiple Masters, which let a desktop designer mix different weights and widths, and save as individual font instances. The new variable fonts interpolate along axes—optimizing for middles. But it wasn’t the trickiness of designing them that held back Multiple Masters; there were plenty of MM fonts released. It was the users, civilian graphic designers, who were puzzled by how to use it.
Even more short-lived was Apple’s first variable fonts in 1995, TrueType GX. (TrueType was their answer to PostScript.)
GX was part of an elaborate rethink of the Mac’s visual layer, called QuickDraw GX. And Berlow was there designing variable fonts for the Mac OS. And rather than interpolating from the extremes like MM, GX worked from the middles.
There were a number of cool GX fonts, including Jam by Erik Van Blokland and Zycon by Berlow. Skia, the GX font he produced for Matthew Carter, is still in the Mac OS. The rest were swept away when Steve Jobs returned to Apple in ’97.
Twenty years later, it’s all back. The question is: What of it?. It’s good for Google’s bandwidth, but what does it mean for us?
What it does
AGAIN, a reduction in font data may allow a richer font menu for a web site. That’s pretty important for plain old graphic designers.
For example, you can keep the selection of type sizes in your brand guidelines that you worked so hard on. Sites like The New York Times, which has defaulted to Georgia, can use the Imperial that readers are familiar with in print.
Similarly, advertising campaigns can retain their typographical branding everywhere. (Hello, Google!) That seems basic, but essential.
The exciting benefit for designers is expression. Most big projects need a couple of dozen type styles, not four. And with a Variations font, you can tune into the right style for each part of the design. You can get that Semi-semi-Bold. Or a preposterously thin compressed.
Update: Adobe previews variable font UI
A key step in getting variable fonts into the hands of graphic designers was announced by Adobe at the big Adobe Max conference this October in Vegas. They’re making it work in the applications that graphic designers use every day, like Photoshop and InDesign.
VARIABLE: Weight axis working for Robert Slimbach’s Acumin—in just one font file.
One preview on YouTube shows how variable fonts can be used (soon) in Photoshop—which expands the advantage from web type to desktop type.
Also announced: Several variable fonts in Adobe Typekit. Dan Rhatigan explains how Adobe is jumping on Variations in the Typekit blog post.
Down the road, as our programming skills catch up with the potential of Variations, we can make typography much more context sensitive. As Hudson has pointed out, we could connect an unused justification table in OpenType to render Brahmic or Arabic scripts more gracefully—and more legibly.
Or, we might refine machine-learning capabilities of our site and app to be more aware of the screens they’re playing on.
With the right heuristics, we could adapt our typography to what a user likes, and make it all easier read. Now that’s the future.
LINKS: VARIATIONS ON THE WEB
- David Berlow’s overview
- John Hudson’s lucid explanation
- Lawrence Penney’s Axis-Praxis, a playground for variable fonts
- The OpenType specification
- Webkit makes it official
- Luc Devroye sums it up
- Typekit’s kickoff
- Adobe’s Tim Brown and Bram Stein interviewed on RWD
- David Berlow and Google show Variations goes beyond weight, width and size
- Typo Labs Berlin informative videos of Variations presentations
“COMPLIANT” BROWSERS
- Current release of Chrome now work with variable fonts on Mac, Windows, Linux, iOS and Android.
- Current release of Firefox on Mac, Windows, Android.
- Safari worked briefly. Now try the beta: Safari Technology Preview (Mac, iOS)
- Edge, not yet.
Updated Nov. 14, 2017. If you have new information please contact TYPE.
