Is it common to create the outlines of a font in illustrator?

webfont's picture

Hi everyone,

I've been wanting to get into type design for a long time and now that I'm getting more serious about this, I find it kind of hard to actually start off because I don't know what the recommended workflow is. Are you supposed to create the shape in Fontlab or is it actually common to design the outlines in illustrator or inkscape, for example (these two seem to have a better range of tools for this task)? I've seen a lot of videos where people create the basic shapes in illustrator and export them to Fontlab later on.

Thanks for your help.

Mark Simonson's picture

If you are more familiar with working in Illustrator, it can be an attractive choice. But there are quite a few drawbacks compared to working directly in a font editor:

- Conversion of outlines from Illustrator's floating point coordinated to integer values in a font editor (which are required by standard font formats) requires careful inspection for rounding errors.
- More steps involved, compared to drawing directly in a font editor.
- No way to effectively work on spacing in Illustrator in a way that will carry over to the font editor.
- Paths from Illustrator often need cleaning up in the font editor.

In general, it's faster and more efficient to work on a font directly in a font editor. That's what they were made for, whereas Illustrator was not.

If you do prefer working in Illustrator anyway, ScanFont provides a good, fast way to get the outlines into FontLab from Illustrator, although it's still more work than working in a font editor from the start.

(This is coming from someone who used to do his drawing in Illustrator.)

webfont's picture

Thanks, great advice!

I was actually worrying about the precision of the paths made in illustrator myself, so thanks for confirming that. Judging from what you said, the import of illustrator data into FL seems rather time-consuming and not worth the effort.

Using the editing tools of FL is kind of hard for a beginner, though. As i said, their range seems to be rather small, but that's probably just a false impression.

Anyways, I'll give it a try and see what's possible.
Can someone tell me if there's an effective way to round corners? Something like a tool that enables you to "chamfer" (is that the right term?) sharp connections of existing shapes?

George Thomas's picture

It is possible to use Illustrator as your original art source if you're more comfortable with that for the time being and to help you get started. FontLab Studio has a pretty high learning curve and takes some getting used to. Just remember to place all your points in Illustrator on integer values and you should be fine -- precision is the key. Do your art so it does not require scaling once it is in FonLab Studio.

More information about this on proper preparation of Illustrator art for use with FontLab Studio from Adam Twardoch at FontLab can be found here:

webfont's picture

Thanks for your advice and the link, majus!

Nick Shinn's picture

I’ve never used Illustrator for drawing glyphs, despite using it for many other purposes as a graphic designer in the days before I started Shinntype. I would say it’s overqualified for the job—as well as confirming Mark’s comments about the benefits of drawing within a font editor.

webfont's picture

Thanks for you input, Nick. I appreciate it!

I've worked with the editing tools of FL for a few hours now and I have to admit that they are overwhelmingly precise and easy to work with, which was suprising because initially they seemed to be the opposite.

Synthview's picture

Hi webfont,
I use a font editor even to design icons (not only webicons). If you need precision, Illustrator isn't the best tool in my view.

Nick Shinn's picture

Font editor drawing tools have a good pedigree.
Fontographer was the first desktop application to include a bezier-drawing tool, in 1986.
It was published by Altsys, which later released the drawing/layout app FreeHand in 1988, the same year Adobe released Illustrator, shortly before CorelDraw in 1989.
Freehand was killed when Adobe acquired Macromedia, which had acquired Altsys, so its demise was not a reflection of its quality vis-a-vis Illustrator.
I used Illustrator from 1989 to 1996, when it underwent major changes (v.6) and a degree of bloat that made my skin crawl when I tried to adapt my mental software to handle it. Subsequently, like Jan, I’ve done all my drawing in Fontographer/FontLab, and created almost all other graphics in Quark/InDesign, except for pie charts.

webfont's picture

@ Synthview:
That's interesting because I want to design an icon font some day and thought illustrator would be the tool of choice for a task like that. Actually, the possibility of creating icon fonts is one of the major reasons for me to get into font design.

@ Nick:
I've always thought that many vector drawing tools provide an enormous load of functions that are completely obsolete. I spend as much time as possible creating a good concept before actually creating something out of it with the help of a vector tool.

oldnick's picture

FontLab’s mutlilevel contextual menus are just plain stupid, and its merge-intersect-difference functions are sadly lacking...

John Hudson's picture

I use a font editor even to design icons

I used a font editor even to design my wife's wedding ring. :)

Frode Bo Helland's picture

John: My wedding ring is engraved with a custom variant of DIN Engschrift/Oslo’s streetsign alphabet. The text reads “Din Susanna”. In English, “Your Susanna”.

John Hudson's picture

Ha, that's splendid.

.00's picture

Use a font editor to make fonts and save Illustrator to do illustrations.
Maybe no one uses Illustrator better than Gerard Huerta:

gargoyle's picture

If you do end up using Illustrator with FontLab, these might also be worth checking out:

Synthview's picture

@webfont sorry for my answer's delay. The problem with icon fonts is to have them sharp in the browser, and only at a certain size or multiples. For instance if you want to use your web-icon in a text of 14px, you have to design it to be sharp at 14px, and of course 28, 42 etc.
You're obliged to work with a bigger grid, but you first have to calculate your grid spacing according to the base value of a font (UPM= Number of units per em square).

In brief, it’s easier to draw into a type design software. Personally I use Glyphs App. It's very symple and draw tool excellent, compared to Illustrator.
Here a tutorial about how to calculate the right values.

Dr jack's picture

I think just letting people work out what suits them is the best thing.

I too have used Freehand, CorelDraw and Illustrator. (Freehand was ahead of it's time)

I always believe that when a program crosses over without two much loss, do it.

I come from the Toy Industry and you cannot design wildly original fresh Graphics in Quark or InDesign ....or a Font Editor ;-)
Likewise with some Unique Type Design. You cannot always quickly create original Fonts in FontLab or Fontographer. These programs are too unforgiving. You can't cut, overlay, swap, add, remove, try multiple images next to each other, on top of each other, move art/images around, off pasteboards, or work as quick on many glyphs as you can in a Vector Program like Coreldraw or Illustrator. You guys forget that while the impression is that while Font Editors might be the end result of precision, the Vector based Programs can be the source of freedom, creativity and freshness.

Some people use a pencil and paper. Some people like the speed and fluidity of Illustrator or Coreldraw to get a start on the final look of a typeface.

Each to their own. (But if you want to produce a boring Travel Brochure use Quark/InDesign...DON'T do Graphics IN page layout instead!)

If you want to set your creativity free, don't go near a Font Editor first!

Syndicate content Syndicate content