Lettering and type design

Evoke an era without falling back on cliché

“We try to verbalise the look and feel of a font by using more emotional adjectives such as warm, inviting, geometric, mechanical and precise, as well as trying to define the functionality, how it’s being used. With this we can start exploring visualisations. 

“We don’t refer back to existing fonts that possibly fall into the same category; instead we may look at graphic design work, or art to get a reference point.” Bruno Maag

Rationalise letterforms down to their essentials

“First put all your ideas on paper, and then keep on eliminating everything that’s disturbing the overall impression of it. Try to find a system for what your font really needs.” Verena Gerlach 

To create a magazine logo, Darren McPherson tweaked, then redrew parts of the Torino typeface. To find the right look, he experimented with changing many different elements of each letter’s form. Here you can see his tweaked and then redrawn version of the G (above) – and his variations on the curve of the G’s upper and lower serifs, and the length of the inner serif (below)

Turn two fonts into one

“I was working on a large publication’s logo redesign recently. This was a very drawn out process. First, I squeezed the letterforms of two different typefaces to around 80 per cent of their width. I then slowly began reworking the shape of one to match the other, carried over an adjusted version of the original serif shapes, thickened the thicks and thinned the thins. It’s all a game of balance, where context and function inform my every move.

“It’s relatively common for me to adjust a typeface, though I’d never just push and pull. I’d lock a type layer at 30 per cent opacity and recreate the curves myself, adding elements along the way.”Darren McPherson

Keep it in proportion

“What people consciously notice is that a font may have a specific texture, which is achieved by manipulating proportions in a certain way or possibly creating hybrid stylistic features within the typeface.

“Of course, some can be achieved by adding design details, though these are rarely noticed in detail at smaller sizes. They do affect the rhythm and texture of the font, though.” Bruno Maag

Tight, white and uniform

“In the beginning, most font design freshers put too many different shapes of endings, for example, or different contrasts into one alphabet. They want [it] all at the same time.

“But it’s not about making each letter exciting and special. It’s about their function in the whole group of letters, in the text appearance. It’s like a dancing group: too many divas in one chorus line kick each other off the stage.” Verena Gerlach

Verena Gerlach builds ink traps into the designs of her typefaces to create crisp corners when printed

Legibility is all

“The most basic principle is the letterform should be recognisable at a glance.” Rick Valicenti

Kill your babies

“We always test for legibility, and if a design feature gets in the way we have to sacrifice the feature.” Bruno Maag

Online type design

Don’t underestimate the importance of type

“Perhaps the biggest change in the past two or three years is that type has gone from an afterthought to a core element of design. The ‘typography out’ approach means that decisions regarding typeface choice, font size, leading and measure dictate the proportions used in the rest of the design, and really this is what we should’ve been doing all along.” Elliott Jay Stocks

In an experiment, Elliot uses subsets to ‘polyfill’ support for lesser-supported features such as OpenType swashes

Taking the hint

“One of the biggest considerations should be how well a font performs across multiple environments. Even in this age of having thousands of typefaces to pick, the sad truth is that the vast majority of fonts are not hinted, or not hinted well. 

“This means that on Windows – or, more specifically, versions of Windows with certain type rendering engines – the type will often look awful, especially at body sizes.” Ben Reece

Online perfection

“With the new ultra high-resolution screens [such as Apple’s Retina Display for its iPhone 4, new iPad and MacBook Pro], the type is as crisp onscreen as in print, so it’s important to really insist on online perfection.” Ben Reece 

Pass the test

“The first rule of thumb should be to test, test and test again. Type rendering can differ from operating system to operating system, browser to browser, and version to version.” Elliott Jay Stocks

These OpenType ligatures are on display on Elliot’s blog. They are part of an ongoing series of experiments with web typography

Compare how typefaces perform in different font delivery systems

“If, for instance, you want to make use of the ligatures contained within Skolar, you’d have to use the version on Fontdeck, because currently that’s the only version that contains them. Similarly, Typekit has been adding PostScript outlines to display faces, so – for certain operating systems, at certain sizes – its rendering might have the edge over another service’.” Elliott Jay Stocks