Making a typeface with a stack of sliders

Most people who want their own typeface give up at the same point. They open a font editor, see an empty grid for the letter A, and realise they would have to draw well over a hundred characters by hand, then space them, then kern them. Font by Zaweba takes a different road. You never start from a blank square. You start from a finished alphabet and change its character with sliders.

That alphabet is Zaweba's own base design of 109 characters, drawn as pen strokes rather than fixed outlines. Because each letter is a skeleton with a stroke laid over it, the app can thicken it, narrow it, lean it or round it off and still end up with clean shapes. The sliders are where all of that happens, and they are the first thing worth getting comfortable with.

What the sliders actually do

The style stack holds weight, contrast, width, rounding, serifs, italic, shear, perspective, rotation, outline and pattern fill. Weight is the obvious one: drag it and the strokes get heavier or lighter across the whole alphabet. Contrast is subtler. It makes some parts of each stroke thinner than others, which is the difference between a plain, even sans and something with a bit of calligraphic feel to it. Width stretches or squeezes the letters, so you can go from a condensed poster face to something broad and friendly.

Rounding softens corners and stroke ends. A little of it makes a font feel approachable, a lot of it gives you the bubbly look you see on children's books and sweet wrappers. Italic, shear and rotation all change the angle in slightly different ways, and perspective tips the letters as if they were painted on a wall that runs away from you. Outline turns solid strokes into hollow ones, and pattern fill puts a tiled pattern inside them.

The important bit is that every change applies to the whole alphabet. You aren't adjusting an A and then going off to match the B. You move one slider and all 109 characters move with it, and the spacing and kerning are worked out again for you afterwards. That last part matters more than it sounds, because a heavier or wider font needs different gaps between letters, and getting those right by eye is slow, fiddly work.

Working with the stack

It's called a stack for a reason. The styles sit in order, one on top of the next, and you can drag them into a different order. Shear before rotation looks different from rotation before shear, for instance, and outline before pattern fill gives you a different result from the other way round. Moving things about is often the quickest way to find a look you didn't know you wanted.

Each style can be switched off without losing its settings. I find this the most useful habit to get into. If you've built up a dozen changes and something looks wrong, turn them off one at a time until the culprit shows itself, then turn the rest back on. If a style has drifted somewhere you don't like, reset it and it goes back to where it started, leaving everything else alone.

A gentle way to begin

On a first go, I'd suggest leaving most of the stack alone and playing with just weight and width. Type a short line you care about into the preview, perhaps the name of your business or a heading for a worksheet, and watch how it changes. Once that looks right, add a touch of rounding, then try contrast. Only reach for perspective and rotation when you have a reason, because they are strong effects and easy to overdo.

Why sliders rather than drawing

Sliders won't give you everything a professional type designer can draw by hand, and they aren't trying to. What they give you is a font that is consistent from the first letter to the last, because the same rule has been applied to all of them. Consistency is the thing that makes a homemade font look homemade when it's missing, and it's the thing that takes the most practice to get right by hand.

They also make experimenting cheap. You can try a heavy rounded version and a thin condensed one in a couple of minutes, show both to someone, and pick. Nothing is final until you export, and the project is saved as a documented .zfont file, so you can come back to it later and nudge a slider or two.

When the stack has taken you as far as it can, Font by Zaweba has the rest of the toolkit waiting: drop-in serifs and decorations, pattern tiles, and a glyph editor for the one letter you'd still like to change. But for most people, most of the look comes from these sliders, and it's a good place to spend your first half hour.