This is my first posting here in English. It has always been the plan to write some articles in English and also to translate some of my previous writings from Icelandic to English. The reason is quite obvious. The Icelandic population is less than 300.000, so there is a limited number of people who actually can read my posts.

Secondly, I know for sure that for at least some of the subjects I write about there is not too much information arround. Hopefully I can add a tiny bit of missing parts some might be looking for.

Thirdly, the stats for this little blog of mine shows that just over half of the visits are from English speaking countries, people who have found this page on Google or elsewhere, only to find that they can not read a single word.

As a start I will try to shed a little light on a topic that I have seen many looking out for: How do I move my font that I made in Illustrator over to FontLab?

Some of us have used Illustrator for years as our main vector drawing tool. And some of us might also have drawn few characters, glyphs, symbols or even a whole font in Illustrartor that we want to move over to FontLab to make a real font.

Copy and paste works but will give you unexpected results unless you set all parameters right, both in Illustrator and FontLab. I am combining information from the FontLab msn forum with my own thoughts on how to prepare font design in Illustrator CS for either copy-pasting into FontLab or saving as EPS for importing into FontLab.

Preparing Illustrator

There are few preference settings that need to be set right in Illustrator.

  • Preferences | Units & Display Performance. Set all units to points. Note: Learn this useful Keyboard shortcut to quickly shift between Units: Command+Options+Shift+U. Or click on the Ruler.

FLpoints2

  • Preferences | Guides & Grid. Set Guideline every 10 pt and Subdivisions to 10.

FLguides2

  • Preferences | File Handling & Clipboard. Enable AICB and Preserve Paths.

FLfilehandling2

In the menu bar:

  • View | Show Rulers.
  • View | Snap to Grid. Disable.
  • View | Guides | Lock Guides
  • View | Show Grid (Optional)
  • First of all we have to measure the font / glyph drawings we are going to use. I used millimeters in this example but you can use points or inches as well. As long as you have the dimensions of the Ascent and Descent to get the dimensions of the Em Square it does not matter and the results will be the same. We will convert all the dimensions to FontLab units. It is basically proportions we are after. Let’s take an example to explain this in detail.

FLmaelaletur3

  • Here we have a drawing in Illustrator of some glyphs from a font. A good way to find out the basic dimensions of the font is to look at H, d, x and p and measure it from the Baseline. From the H we see that the Caps-height is 40, Ascender (d) is 42,2 and the x-height (x) is 28,8. Descender is always a negative number in FontLab calculated from the Baseline. There is no need to use the numbers here as negative ones, as long as you remember that all the measurements are made from the Baseline. Descender (p) is 12,4 down from the Baseline. You may find it handy to put in Overshoots, (the green boxes) where rounded letter forms exceeds the measurement lines.
  • The upper- and lower case g are fine to find that out. It’s extremely small but easily found out by zooming into the drawings. The dimensions are summed up in the table below.

Make boxes with a very thin stroke. Or you can use colored boxes without a stroke like shown in the picture around the glyphs. Get the height in the Transform palette. I prefer to use colored boxes with some transparency because the stroke thickness gets in the way. I recommend that you keep measurements exact. Later on we are going to convert those numbers and enlarge the drawings quite a bit, so it is better not to round off the numbers at this point.

In the example below I round off to the nearest one digit after the comma (or point, depending on where you live) only to make it less confusing. What we need to find out first is the size of the Em Square. The size of the Em Square is the height of the Ascender + Decender. In our example that makes 54,6. The width of the Illustrator work file we are going to make will be 1000 pt, FontLab UPM Em Square. And we need to convert the numbers to fit in. Here is a table that shows the numbers and how they are converted:

  • Size, divided with Em Square size, multiplied with 1000 = New size
  • Ascender (d) 42.2 / Em Square 54.6 * 1000 = 773
  • Caps (H) 40.0 / Em Square 54.6 * 1000 = 733
  • X-height (x) 28.8 / Em Square 54.6 * 1000 = 527
  • Baseline 0.0 / Em Square 54.6 * 1000 = 0
  • Descender (p) 12.4 / Em Square 54.6 * 1000 = 227
  • Overshots (Gg) 0.65 / Em Square 54.6 * 1000 = 12
  • Ascender + Decender 54.6 / Em Square 54.6 * 1000 = 1000

Now we have all the basic numbers we have to use in the Illustrator file. I have also made available online an Excel file that will calculate all the demensions for you as you fill in the measurements.

Illustrator work file

  • Make a new file in Illustrator. Make the art board 1000 pt wide and the height 1227 pt. 1227 pt is Em Square 1000 pt + Descender 227.
  • Drag the ruler zero point from the upper left corner where the rulers meet to the very bottom of the art board.
  • Drag a guideline from the top ruler to the height of 227 pt. This guideline will be the Baseline of the font.
  • Drag the ruler zero point to the Baseline and to the very left edge of the art board. Note: This is very important because this determines the position of the glyph when it’s transported to FontLab.
  • Drag guidelines from the top ruler to where the Ascender, x-heigh, Caps and overshoots should be according to your table.

FLhemsquare2

Zoom in to get it precise. You may even find it easier to make three boxes, let’s say 20 pt wide and in the heights of 773 pt, 733 pt, 527 pt. Align the boxes at the bottoms and place on the Baseline. Drag the guidelines to the top of the boxes. When this is done you can resize your font design to the guidelines for further designing and preparation for transporting to FontLab.

FLsizedup2

But there is even an easier way to do this, which is a great timesaver: Use the Keyboard shortcut to shift between Units and you see that 54,6 mm, the Em Square is 154,792 pt. We want to resize it to 1000 pt. 1000 pt divided by 154,792 multiplied by 100 is 646. This means that in this specific example it’s possible to use 646% to enlarge all of the design. It also means that you can take the colored boxes to your file and:

  • Do the 1 – 4 actions of the previous description.
  • Bring in the colored boxes. Adjust the shapes to a more square form by using the Direct Selection Tool (the white arrow), and move the right side of the boxes to left.
  • Put the colored boxes so that the Baselines are aligned exactly.
  • Option-Click with the Scale Tool on the Baseline. Put in 646% in the Uniform Scale field in the dialog box that opens.
  • Set guidelines according to the colored boxes. Delete the boxes when you are done.
  • The percentage 646% is now the key number to all your enlargements and you use it to re size the font design.

Few things to remember about drawing fonts in Illustrator

  • If fonts are drawn in Illustrator and intended to be moved over to FontLab it must be filled, not stroked.
  • The drawings must not exceed the top or bottom of the Art board / Document Size.
  • Let all your Nodes / Anchor points fit the Grid / Guidelines.
  • Keep Snap to Grid on. When the drawings are moved over to FontLab will round the drawings off if it does not fit the grid.
  • If you think you need more precision recalculate all the numbers in the table with 2000 (instead of 1000) and increase the Illustrator document size accordingly. Also change the UPM in FontLab to 2000.

Preparing FontLab

Few things have to be done on FontLab’s side before we can place the glyphs into it.

  • Go to File in the menu and choose New. File | New.
  • File | Font Info | Metrics and Dimensions. Keep it like it is: Font’s UPM is: 1000
  • File | Font Info | Metrics and Dimensions | Key Dimensions. Fill in the dimensions from the table like is shown here.

FLdimensions2

  • Go to Preferences | General. Be sure “Do not rescale EPS files” is checked.

FLrescaleeps2

Import – Export

Now everything is ready to swap your font design between Illustrator and FontLab in both directions. There are few options.

Copy the glyph in Illustrator or FontLab and paste it into FontLab or Illustrator. Works fine both ways in Illustrator CS and FontLab 4.6 and the glyph will stay proportional in either application.

You can also save an EPS out of Illustrator but it has to be exported as Illustrator Legacy EPS. Go: File | Export … Illustrator Legacy EPS in Illustrator CS. In CS2 it’s Save as … . Save as Illustrator 8 compatible file.

Individual characters or glyphs can be exported out of FontLab and opened in Illustrator.

Added: Note that this method does not work properly in Illustrator CS5. That is, pasting a glyph from Illustrator to FontLab Studio works fine. It respects the 0.0 ruler point which should be on the baseline. But pasting a glyph from FontLab to Illustrator CS5 with Paste to Front results in centering the glyph on the center of the Artboard.
Workaround is to make a little box for example on the 0.0 baseline in FontLab and copy it along and then drag this box along with the glyph to the right position in Illustrator.
I have no idea if this will ever get fixed, but if you like to use this method you might want to keep a copy of Illustrator CS4 on your computer, just for this purpose.

45 Comments

  • Bravo,

    brilliant article that gives more than the gist of it all

    well done to you Sigurdur

    jerome from france

  • Well Im going to bookmark this article, hopefully its a perm url 🙂

    I don’t have much experience in making a font, I’ve tried on two occasions and failed miserable on both. Look forward to more Illustrator and fontlab articles 🙂

  • Esben: Actually there is not much else to say about AI and FontLab together. This method works incredibly well.

    On the other hand I am preparing to write some tutorials for Illustrator. I am thinking for beginners up to advanced. You never know if I wont knock on your door for some comments and advice.

  • Well you don’t even have to knock, my door is always open.

    I got this “fetish” for chubby types and since there aren’t that many going around, then I could just as easily make my own and this tut will come handy.

    Could I convince you about writing a article on icelandic diacritics? Yes its really sad that a dane is requesting this.

  • Thanks so much for posting in English, althrough my partner knows a little Icelandic I don’t think he could have translated this into anything that would have been useful to me.

    It has addressed my concerns about importing into FontLab. I have apx. 100yr old stencil fonts currently in an old version of EngraveLab & need to get them out & create ttf of opentype fonts.

    I can get individual characters into Illustrator & then into FontLab, but my biggest problem is they MUST remain exactly some shape, I can not move any points as these must match up to perviously manufactured stencils & makings.

    Any suggestions for a reliable font creation program that could do that?

  • This is an interesting problem. Try to post about this on the FontLab forum, http://forum.fontlab.com/

    It says on EngraveLab’s site that the program can export pdf’s and maybe that is what you have used to get glyphs out. One thing I can think of is to raise the UPM size to something much higher than the usual 1000 or 2048, lets say 6000+ The Illustrator file should be adapted (made much larger) to that size and you would get much less distortion. It would however possibly reach some limitation to font exporting the fonts. I have seen limitation in exporting OT/PS flavor when using very high UPM number.

    Hope you get some better answers on the FontLab forum.

  • hello, i have a font that i’ve created in illustrator and i’m in the process of imported it into fontlab. i did notice this statement which worries me:

    “If fonts are drawn in Illustrator and intended to be moved over to FontLab it must be filled, not stroked.”

    my font is made up of linear elements that are all stroke and no fill. am i doomed?

    also, i downloaded fontcreator 5.6 and it seems to be comparable to fontlab. have you used this? i’m finding that my letterforms are not sharp like they appear in illustrator, rather they are appearing bitmapped. can you help?

    by the way, i was in iceland earlier this year and i really enjoyed myself!

    • Well, in Illustrator, you should take your lines and go: Object > Path > Outline Stroke. That way you can fill that form and it looks like a line. Regular fonts we use for design are only made up of closed forms, even if they look like a thin line.

      I have not used FontCreator, but my understanding is that it is quite good.

      About the sharpness: In FontLab or Fontcreator?

      • Hi Sigurdur,

        Thank you for your quick response. I followed your instructions and outlined stroke in illustrator, however I am still having the same problem. I have been using FontCreator because it allows me to do more than the trial version of FontLab I have, but both create the same effect…broken lines that aren’t crisp as they appear in Illustrator. Do you have any other recommendations?

        Thank you in advance,

        Mikel

  • Ahh. I see now why I don’t have Font Creator. It’s for PC only. So it’s hard for me to test this. The main question is: What happens when you export the glyphs from FC? You should be able to create a font even if it has only a few glyphs and then try the font in Illustrator and print it.

    When you type the glyphs in Illustrator, try to outline it and compare it to the same glyphs you had before you imported them into FC. A few possible reason might be there: Maybe FC distorts the glyphs when you copy them over to FC. Maybe it doesn’t copy the vectors over but only a bitmap to FC. Check if you can do something in FC, like grabbing an anchor point and move it. Possible?

    Another thing: As you are starting to make fonts, consider to buy TypeTools rather than FontLab, both made by FontLab. TypeTools mainly missing the more advanced features of FontLab Studio and is only $99 compared to $645 (which I have btw. never regretted).

    Then, if you get well into fontmaking you will probably want to upgrade to FontLab Studio (I should get a commission for this!)

  • when i export a font from illustrator into fontlab by via the clipboard

    only appears as outline of the shape not a filled shape can any one help cheers

  • On the last thing to do:

    “Go to Preferences | General. Be sure “Do not rescale EPS files” is checked”

    I can’t find that option on FL 5.0.4 on Windows.

    I have done all the other things, but always get resized between the baseline and the ascender.

  • @Pablo: FontLab has changed a bit since I wrote this 4 years ago. Today this setting should be:

    General Options: EPS and bitmap background: Keep size (1 EPS pt = 1 UPM unit).

    This should give you the correct results if you set Illustrator’s grid to the settings that are described above.

  • Dear Sigurdur:

    Some years ago, I started to develop a font based on West Coast Native American art and finished all the lower cases. Native art is very curvy and lends itself very well to anything with Bezier curves, so a font within Illustrator was a natural. Recently, some volunteer work with a Gallery of Native Art suggested that I go on with this work and complete this font.

    However, I am 71 by now, retired, still working with Illustrator but buying FontLab sounds a little overkill. My question therefore is, is there a cheaper program that I can use instead and that does a similar job. I might go as far as Fontographer, out of nostalgic reasons (I witnessed its creation and I knew John Warnock, founder of Adobe) but if I can go cheaper that would be fine, too.

    Can you help?

    Thanks

    Tom

    • Hello Tom.

      You should consider buying TypeTool from FontLab. It’s very similar to FontLab, in fact almost identical but only missing high-end features that are usually only needed by professional font designers.

      TypeTool costs only a fraction of what FontLab Studio costs. You should also contact FontLab and ask if they have special deals for older users, similar to their great academic deals. List price for TypeTool is $99 I think.

      Hope this gets you started 😀

      http://www.fontlab.com/font-editor/typetool/

  • Dear Pablo,

    I had the same problem as you and found the solution with these instructions on the FontLab forums…please only do this if you know what you are doing, I believe the “Do not rescale EPS file” option is called “Fit EPS files to (Ascender-Descender) height” in windows but the option does NOT work:

    Quit FontLab Studio, run regedit, find HKEY_CURRENT_USER\Software\FontLab\Studio5\Options, then find value named EditScaleEPS. Edit this value: just enter 0. That’s it.

    This way you don’t remove your options and your glyphs are not scaled when pasting from Illustrator.

    But keep away from enabling the Fit EPS files to (Ascender-Descender) height option located in the Options > General > EPS and bitmap background dialog box. When you activate it and open Options dialog box again, FontLab shows it remains not activated, but in the matter of fact, it is activated – when you try to paste any glyph from Illustrator, FontLab Studio will scale it. There is no doubt it’s a bug.

    source:

    http://forum.fontlab.com/fontlab-studio-problems/“do-not-rescale-eps-files”-not-available-in-flv503-windows-version-t309.0.html

  • Hello I could use a little help.

    I have begun creating a font for a class at school. I made some characters in illustrator and imported them into font lab. everything is fine there.

    My problem is that my font is really tiny. Is there a quick way to re size my characters in font lab while constraining the proportions?

    Thanks

    • The best would have been to set the glyphs in correct size while you were working on it in Illustrator.

      But in FontLab you can use the Actions to resize. Go to Tools > Action > Contour > Scale. First you should find out the percentage you need and then Check: Apply to entire font.

  • Hi,

    you should sell this tutorial to Lab Font. It’s 100% more clearer than there manual. Finally mine worked. Just have problems with copying my font from Illustrator into Fontlab as some parts of my letters is filled out with color to create a 3D effect. Have you got any clue?

    Anyways. 100% recommendable and will send this to my lecture 😉

    Sylvia

  • Sylvia. I am not sure how your font looks like, but bear in mind that the glyph drawings can only be in black colour. You can however pick any one colour for your font after you have made it.

    FontLab has a program, PhotoFont which makes it possible to make multi-coloured fonts.

    So, the main thing is to make your drawings in black and white if you want to make an ordinary font.

    And thanks for your kind words. I do a lot of teaching and lecturing myself and as I have mentioned somewhere here before, this blog is more and less based on answers pointed to me by students and co-workers.

    Regards,

  • Hello,

    first of all thank you so much. This article was such a great help and I even sent it to Font Lab. I had a question and they have sent me your link back how to do so. So i think they liked it. But the question is still open. I have a letter with fillings and with strokes (done with paintbrush). It works when I copy it but the fillings don’t come with it only the outlines. I also can’t import EPS as they say the file is to big. I used your 1000pt and saved it as EPS but always fails and copy and paste I suffer with the fillings. What can I do? Would you like to try it on your own as I sent them my file and they don’t use CS4 somehow.

    Thanks again for bringing this easy step forward

    Sylvia

  • Yes it’s in black and white. It’s wierd I just send you my email and you anwsered it before 🙂 I submit it.

  • Sorry do you mind if I send you the letter A as not even FontLab was very helpful as they don’t use Adobe CS4 but they are generally very good in responsing. 😉

    Thanks

    Sylvia

  • Hi Sigurdur,

    I’m not sure if this forum is still active – but I’ll give it a try. In your example you say:

    “I round off to the nearest one digit after the comma (or point, depending on where you live) only to make it less confusing”

    Is it required to round to whole points in Illustrator or can I also work with e.g. 728.4578 pt? In other words when I start rounding the numbers won’t this inaccurately change certain proportions of the glyphs?

    Thank you.

    Alex

  • Hi Alexander. Yes, it’s still open. I am just writing when I have the time. I think I have earned as much as $ 40 by running this site 😀

    Well, don’t worry too much about this. Maybe I should change the text a little to prevent misunderstanding. But the thing is that to start with, the scale of the drawings this way is huge. And adding the snap to point each anchor point will snap into the grid at “even points” (no commas). So you don’t have to worry about distortion.

    In cases where things have to be super exact for some reason there is also possibility to use a larger scale, 2000 x 2000 point or even more, both in Illustrator and FontLab. But going too high can result in loosing ability to save the type in certain formats, like OT with PostScript flavor.

    Hope this helps a little.

  • Hi Sigurdur,

    Thank you for your quick reply! I think that I sort of understand what we are talking about here. As a result I will rescale the shapes in Illustrator in order to make them fit to even points.

    If I’m ever able to produce a font which is worth selling – I’ll will advertise it on this site – fingers crossed…:-)

    All the best.

    Alex

    • Great. Hope you can finish the font. I myself have never finished fully one font but have a few unfinished. Still FontLab is almost always open on my machine.

      Good luck!

  • Loved your font calculations. Couldn’t find the Excel file but I’m making one for my foundry. And yes, keep writing your posts in English to bring more traffic. I found your blog in Google. I’m from Mexico and fluent in English but it’s my second language. Thanks for your insight.

  • Hi darkvotum. Thanks for visiting. Just notice that I wrote this article in 2005 when I was using… what.. Illustrator CS or CS2 maybe.
    Illustrator CS5 does not work this way and I am writing an article how to bypass this sad news.

  • Pingback: font.is » Love relationship between Illustrator and FontLab partly broken with CS5

  • Great post! One thing that might make things a little easier is manually typing in the guide positions. If you drag a guide out, you can then unlock the guides ( opt+cmd+; ), click on a guide and then type in its y position.

    saves having to make boxes/type and you know that it is exactly in the right place!

  • Pingback: 26+ » Notizen & Artikel » temps fatal
  • Pingback: Drawing Type | Tim LaSalle

  • Thanks very much for this tutorial. Fontlab was doing my head in.

  • Pingback: Fontlab Studio 5: Part 1 – Getting Started [HD Video] | BittBox
  • Pingback: Fontlab Studio 5: Part 1 – Getting Started [HD Video] | The best Tutorials
  • Pingback: Fontlab Studio 5: Part 1 – Getting Started [HD Video] | Programming Blog
  • Pingback: Fontlab Studio 5: Part 1 – Getting Started [HD Video]

Comments are closed.