Posted 28 November, 2016
This is a guest post by Baptiste Guesnon, who has been doing some very interesting research with the width axis along similar lines to the Axis-Praxis resize-textbox demo.
How to use fake variable fonts using Plumin
I started my enquiries by creating different proofs of concept that would highlight how making fonts variable would change the way that designers can play with text.
One really simple, but nevertheless revolutionary (for me) use of variable fonts, is to allow the text to fit to the width of its container. From the graphic designer’s perspective it was disappointing that such a simple thing was not easily possible in dynamic interfaces.
Left: Example of lettering fitting font width and height. Right: Man fitting a non-variable font into a variable space
A #variablefont that automatically adjusts itself to the space ascribed pic.twitter.com/dkKXjMgrQ8— Baptiste Guesnon (@Ba_Gsn) 17 October 2016
Here’s a simple example of use with a live feed of French newspaper headlines fitted to the size of the screen.
It fits! #variablefonts pic.twitter.com/ouIJZ2qlU8— Baptiste Guesnon (@Ba_Gsn) 10 October 2016
Multi-screen live feed of French newspaper headlines fitted to the size of the screen
My experiences with font variations also highlighted their limits.
When playing with the limits of #variablefonts, the fallback to the homothetic transformation looks harsh... pic.twitter.com/KS3cDTuaGn— Baptiste Guesnon (@Ba_Gsn) 11 October 2016
From these first experiments a question came really early to my mind: what if we could justify a text without changing the whitespace between the words but rather adapting the drawing of the glyphs? And what if this justification was not straight? And moving?
Waving my #variablefonts in chrome :-) pic.twitter.com/hvd1pn8WVG— Baptiste Guesnon (@Ba_Gsn) 9 October 2016
Beyond the wow effect, these questions raised a lot of new problems like: how to calculate the line-breaks if the font can vary? Does the choice of a precise width-axis value for a text still make sense? If not, how can this choice be automatic? These questions are still valid today.
Of course variable fonts bring possibilities much more than just fitting a text to its container. It could for example make it possible to change the optical size type according to the context, or changing the font parameters for accessibility issues, etc. Here is an experiment where the contrast and the boldness of the text change with the distance of the reader.
What if font size and optical size of #variablefonts automatically adjusted to the distance the eyes to the screen? pic.twitter.com/efrxk9ha5c— Baptiste Guesnon (@Ba_Gsn) October 13, 2016
I tackled many of these questions in my master’s thesis Caractères versatile (written 2014–2016 at ÉSAD Valence) in which I wondered: How contemporary typographic practice revives the question of dynamic typefaces? Why doesn’t dynamic typeface technology exist already? How do we get there? by looking at the history of type through the spectrum of the variation of glyphs in typography and the failed attempts to democratise this technology.
Your browser appears to be incompatible with variable fonts.
To get started with variable fonts, install the latest version of Google Chrome. On a Mac running macOS 10.13 High Sierra, you can also use Safari.