Create your own fonts with ScanFont

Always looking for font design inspiration. After summer, I bought a cheap set of calligraphy pens and convinced myself that it would give my chicken crawling characters a whole new life. wasted a week and a few

Always looking for font design inspiration. After summer, I bought a cheap set of calligraphy pens and convinced myself that it would give my chicken crawling characters a whole new life. After wasting a week and a few dozen blank sheets, I still haven't got anything interesting or even slightly artistic. Finally, one night, tired and disappointed, after running out of black ink, I inserted a red refill and wrote the following set of alphabets - which then became my Joules family. . I thought it might be of interest if I wrote about how it turned into a font in this case study.

Here is one of the many sketches I wrote that night:

 

close up:

 

Super Feature: A capital A that I can't wait to use.

 

From sketches to fonts

The process of creating the Joules font from sketches, as I wrote in my two previous articles, I scanned in the sketches, and here's what the scans look like after converting them to black and white bitmap mode in Photoshop.

 

Note the rough noise included in the original bitmap:

 

 

Usually, I clean these bitmaps before importing them into Fontlab, but this time it was an exception. Here is the first step, importing the bitmap into ScanFont:

 

A close-up in ScanFont:

 

I copied this new character to the correct location in FontLab. To give you a taste of how adjustments are made in FontLab, below is a zoomed in on the rough A that was imported. I have selected a problematic section.

 

Then start removing those unpleasant nodes:

 

When adjusting characters in FontLab, we must strike a balance between two temptations: on the one hand, we should make the outline as smooth as possible, and on the other hand, we should leave some rough nodes as much as possible to retain the interest of the font. I find that with calligraphic fonts, you shouldn't smooth out all the rough nodes, in a way that robs them of the calligraphic feel.

Character synthesis for saving people in danger

One of the conveniences of FontLab is that it can automatically synthesize characters. In this example I created an A and then an "accent":

 

Then I double-clicked this "A-accent" cell...

 

…FontLab creates a composite character:

 

At this point, if you edit this A or that accent, the changes will automatically update to that composite "A accent" immediately.

side frame

As I mentioned in my previous articles on typography, setting up the right side frame is an important step. (One reason is that proper side frames make kerning easy!) To coarse-tune the characters first, I roughly set up a small, positive side frame. On the initial edit, the side shelf for this y appears as follows:

 

What's wrong with this setting can be seen by looking at the pairing of a and y in the initial kerning setting.

 

In fact, I can keep the side frame of this y unchanged, and then adjust the y to be closer to the a in the kerning pairing adjustment, and so on, adjust the y to be closer to the other characters in each kerning pairing. But obviously it's simpler and wiser to set a negative side frame to the left of this y:

 

Here's what the improved whitespace setting looks like with default kerning:

 

Kerning kerning

God, kerning for this font took me hours! The annoying details in it... I'll leave you alone. But here's another instance of kerning. This is what it looked like before adjustment:

 

After adjustment:

 

Ligatures Ligatures

I've created a fair number of ligatures in Joules that the user can manually choose to apply when typography.

 

Here's an example of how I created these ligatures. First, let's take a look at the original row effect of z and a.

 

I can actually make them overlap nicely in a funky way when kerning pairs, but it's more responsible to do a za ligature. The first step is to create a blank character, and then copy in the z and a:

 

The second step is to cut their outlines so that they can be combined in the right places:

 

The third step, delete the redundant part:

 

Step 4, move the characters so that they are close together:

 

The fifth step, connect the nodes:

 

 

smart ligatures

The first version of Joules didn't include smart ligatures: a technique I only recently learned. I won't go into the details, but I can tell you that you need to open a special OpenType panel in Fontlab, and usually some scripting, to activate your ligature-aware software. Created ligatures. It generally looks like this:

 

 

Finish

This is the final result after countless trimming and kerning:

 

I then went on to make an italic version of it (well, it was more of an italic, you nitpicks), then a bold, bold italian, then a big bold. If anyone else is interested, I can go on with the details.

[Alec Julien is a web developer and amateur type designer living in Vermont, USA. His dream is to one day move to a warm place to type a novel. ]

This article is reproduced from Yiyan.com

Original address: http://article.yeeyan.org/view/snlchina/3433

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=324425403&siteId=291194637