Typeface playground

The background

In 2005 Matt Rudd oversaw much of the rebrand of Channel 4 in the UK with his team at Rudd Studio. Having had great success with a bespoke Fontsmith typeface for E4, Matt knew a font by Jason Smith for Channel 4 would be invaluable. The result was a recognisable, flexible typeface which is still being being used.

In 2016 Fontsmith updated this typeface for the modern digital age; 12 weights, with italics, meant it was ready for a vast range of applications. When Jason asked Matt to create a campaign to launch the new typeface, it was like getting the band back together. This was an ideal project for The Space Between, with our unified process of conceptual thinking, graphic design and digital execution.

Getting started

In our initial meeting, Jason referenced Adrian Frutiger’s Univers grid from 1957, a diagram of the Univers typeface family which shows all the variations of the font, revealing its flexibility. We wondered what the modern-day digital equivalent would be; with the advantage of interactivity, how could we create an evolution of the grid that really showcased the new typeface?

​After some time considering the task in hand, we proposed a few possible routes to Jason, nicknamed ​FS Volume, FS Kaoss, FS Shock ​​​and ​FS Untitled.

When we saw the lovely sequence of the font specimens going from the lightest to the heaviest weights, it felt like turning up a volume dial, and Matt coined the first quirky name: FS Volume. We imagined one large rotary control that moved through the weights, giving acccess to content along the way.

4xvolume-frames_sfw

The venerable Korg KAOSS padWe found inspiration in the Korg Kaoss Pad, an electronic musical device which uses touch input via a pad to create effects. It’s a very engaging thing to use, and we wanted the same sense of intuition and simplicity to infuse our work. This led us to the idea that the typeface could be explored with one user gesture – by moving a finger (or mouse) around the screen. ​FS Kaoss ​was born.

Another concept was FS Shock. We wanted to create an experience which echoed the challenging spirit of Channel 4. As digital punks, we would subvert news headlines, reveal chinks of porn and use edgy poetry. The Kaoss pad interactivity would enable a variable ‘shock scale’.

What’s in a name?

Breaking the Fontsmith naming convention

Each of Fontsmith’s typefaces has a name and a one-line summary of its character. We realised that with 12 weights, it was impossible to do this with the new typeface. This led to our concept: ​FS Untitled – so flexible we couldn’t pick a name​.

Jason was particularly excited by this, as it was a surprising departure from Fontsmith’s usual convention of using the names of people and places.

Developing the concept

The solution was going to be some kind of über-mashup of many of our ideas. What would that be? Some kind of interactive touchy-feely interface that referenced the Univers grid, and had the satisfying simplicity of an analogue volume knob.

With ​FS Untitled ​as our starting point, we created imagined names for each of the 12 font weights that reflected something of the spirit of that weight. A brainstorm led to a list of sixty possible names, all in the Fontsmith naming convention of FS Something. ​It was a lot of fun considering these names, and we got very excited by the visual possibilities.

The original FS Untitled idea on paper

At the lighter end we had names like ​FS Invisible, FS Ghost ​and ​FS Butterfly, ​and at the heaviest, ​FS Apocalypse, FS Boom ​and ​FS XXX​. Where the weights were close to the ‘regular’ of the original 2005 font, we occasionally referenced qualities which have been associated with Channel 4, for example FS Dare, FS Irregular and FS Sex.

Some other names were just playful – for example ​FS Prism ​for one of the ‘light’ names, ​FS Cento for one of the ‘100’ weight names, and​, ​in an Artist Formerly Known as Prince style manoeuvre, ​FS :-)

Once we had settled on an initial set names for the weights, Steve encouraged Matt to go a bit wild with his designs:

When Matt works without limits he comes up with amazing things, truly inspiring stuff. I didn’t want him to even consider whether or not it would be possible to build – taking the stance that I would just have to find a way. Famous last words.’

Considering the design of the playground

We started designing and coding together in earnest. The first task was to create the grid interface where users would be able to see the whole range of weights and all of our imagined names very quickly.

By clicking on the cells that light up, a viewer would then enter a unique interactive scene. Of course, these had to be built so they would work on the web.

Taking Matt’s ambitious designs, Steve found ways to turn them into working scenes using only code – no images, video or anything else. Commenting on his process, Matt said:

Steve is a digital sorcerer. Try as I might, I cannot seem to faze him. One of the ideas was FS Butterfly. I did some research, gave Steve some names and colours, and he set to work. I came in the next morning to see a set of delicate, slow-motion butterflies. A couple of days later I came in to find a fully-functioning arcade game for FS Zombie – all made from type!’

Screenshot of code for FS Butterfly
Screenshot of code for FS Zombie

Jason had said that a classic specimen sheet (a chart of the characters in the typeface) was not necessary. However, Steve saw an exciting opportunity for an interactive version. By moving from left to right, viewers would scan through the 12 weights; vertical movement would change the size.

Summing up

We namechecked lots of things we love; the playground pulls from a lot of different data sources. You’ll find references to Muhammad Ali, F Scott Fitzgerald, Steven Toast (Matt Berry), Ravel, Mozart, Steely Dan, 80s pop songs, The Beatles, Batman, Spinal Tap, Ozzy Osbourne, Oscar Wilde, various butterflies, Prince, David Bowie, Arthur Conan Doyle, cocktail recipes, George Orwell, Apocalypse Now, Pink Floyd, children’s TV show ‘Rainbow’ and even a vintage Windows 3.1 screensaver.

With the FS Untitled digital playground we have created a joyful, living, breathing place which is different for all visitors. It truly evokes the spirit of the typeface – usable in all kinds of ways to say all kinds of things. Thanks to Iancu Barbărăsa for his FS Human and FS Universe ideas. Finally, a huge thank you to our friend Jason Smith for a great brief, an open mind, and a lot of faith. Oh, and quite a nice typeface, too.