永远都在寻觅字体设计的灵感。夏天过后,我买了一套便宜的书法钢笔,说服自己,它会让我的鸡爬字产生脱胎换骨的变化。在浪费了一个星期和几打白纸之后,我还是没得到什么有趣的或是有稍微艺术气息的东西。最后,在一天晚上,疲倦而失望的我,在用完了黑色墨水之后,插入了一支红色的笔芯,然后写下了下面这一套字母表——之后它变成了我的 Joules字族。我想,如果我在这个案例研究中把它如何变成字体的过程写出来,大家也许会感兴趣。
下面是那天晚上我写下的好多张草图之一:
![ilovetypography.com_Joules initial drawing_joules-sketch](/d/file/p/2014-10-25/35e5799eb806d06e77a2eb9fe8d8dccf.jpg)
特写:
![ilovetypography.com_Joules initial drawing, closeup_abc](/d/file/p/2014-10-25/bcbef0499eaf126de7163c609c641556.jpg)
超级特写:我迫不及待想使用的一个大写A。
![ilovetypography.com_Joules A closeup_a](/d/file/p/2014-10-25/0d4bf5970611b0e74f2861032f25bfb3.jpg)
![ilovetypography.com_Joules A closeup_a](/d/file/p/2014-10-25/0d4bf5970611b0e74f2861032f25bfb3.jpg)
从草图到字体
![ilovetypography.com_Joules A black-and-white_a-bw](/d/file/p/2014-10-25/837f69b7cd5a06f8d164029e649ccf2b.jpg)
注意原稿位图中包含的粗糙杂点:
![ilovetypography.com_Joules A rough spots_a-closeup](/d/file/p/2014-10-25/e62d0d6c6fa4b16fae8ee064e839fded.jpg)
![ilovetypography.com_Joules A black-and-white rough spots_a-closeup-bw](/d/file/p/2014-10-25/c6f0fb8b21673ae7e668a32932930b99.jpg)
通常,我会把这些位图处理干净之后才导入Fontlab,但这次例外。下面是第一个步骤,将位图导入ScanFont:
![ilovetypography.com_Initial pass in ScanFont_a-scanfont](/d/file/p/2014-10-25/8b80164a4c0a1a9ff3bfc268e7484be1.jpg)
在ScanFont中的一个特写:
![ilovetypography.com_A in ScanFont_a-scanfont-closeup](/d/file/p/2014-10-25/ee5c37be3599183c79ffc5313d1e46a9.jpg)
我把这个新字符复制到FontLab中的正确位置。为了给你体验一下在FontLab中是如何进行调整的,下面放大显示了导入进来的粗糙的A。我选择了一个有问题的部分。
![ilovetypography.com_Closeup in FontLab_a-fl-closeup-select](/d/file/p/2014-10-25/6aa3d67f16cdede059b093167a501c7f.jpg)
然后开始删去那些令人不快的节点:
![ilovetypography.com_Closeup in FontLab_a-fl-closeup-select-p](/d/file/p/2014-10-25/524c95d705bf3a2a69720ad166eed6cd.jpg)
在FontLab中调节字符的时候,我们必须在两种诱惑中做一个平衡:一方面要使得轮廓尽量的平滑,另一方面,又应该尽可能的留下一些粗糙的节点,以保留字体的趣味。我发觉,对书法字体而言,不应该平滑掉所有的粗糙节点,在某种程度上,那等于剥夺了它们书法的感觉。
救人危难的字符合成
FontLab的一个便捷之处,是它可以自动的合成字符。本例中我先创建了一个A,然后又建了一个“重音符”:
![ilovetypography.com_A plus Grave_a-plus-grave](/d/file/p/2014-10-25/1bead079d8d1f9cb7610044a5390be31.jpg)
然后我双击这个“A-重音符”的小格…
![ilovetypography.com_A plus Grave double click_a-plus-grave-dblclick](/d/file/p/2014-10-25/2dea6cb061f6efd550d9b6ddd07b0f39.jpg)
…FontLab就创建了一个合成字符:
![ilovetypography.com_A plus Grave composite_a-grave-grey](/d/file/p/2014-10-25/c20853260f40cee933bc0609fe15f158.jpg)
这时候,如果你编辑这个A或者那个重音符,变化会立即的自动更新到那个合成的“A重音符”上。
侧架
我前面几篇关于字体设计的文章中也提到了,设置合适的侧架是一个重要的步骤。(一个原因是,恰当的侧架会让字距调整变得简单!)先为字符做粗调,我粗略设置了一个很小的、正的侧架。在初始编辑时,这个y的侧架显示如下:
![ilovetypography.com_y sidebearings_y-pos-sb](/d/file/p/2014-10-25/d2f7d116874cd901fccb2f289c7db70a.jpg)
这样设置会有什么问题,在初始字距设置中看a和y的配对就能看出来了。
![ilovetypography.com_a-y sidebearings with kerning_ay-pos-sb](/d/file/p/2014-10-25/ac5195da0d11cdb278998b26032e2b4f.jpg)
其实我可以保留这个y的侧架不变,然后在字距配对调整中,调节y靠近a,然后依此类推,在每一个字距配对中都调节y靠近其他的字符。但很明显,为这个y的左侧设置一个负的侧架的做法要更简单,也更明智:
![ilovetypography.com_y negative sidebearings_y-neg-sb](/d/file/p/2014-10-25/bf958c7ddb9a69afb2b5f21a56e97592.jpg)
下面就是改进后的留白设置在默认字距调整情况下的样子:
![ilovetypography.com_a-y negative sidebearings with kerning_ay-neg-sb](/d/file/p/2014-10-25/4d2262b71a0ed77af7ec0541978ab531.jpg)
Kerning 字距调整
天,为这个字体设置字距花了我几个小时的时间!其中的烦人细节…我还是放过你好了。但这里还有另外一个字距调整的实例。在调整前是这样的:
![ilovetypography.com_A V pre kerning_A-V-pre-kern](/d/file/p/2014-10-25/5774e0f0901258e38eedad7ddb365cf6.jpg)
调节后:
![ilovetypography.com_A V post kerning_A-V-post-kern](/d/file/p/2014-10-25/e0803b138cb615de87aac8aa0295fc4e.jpg)
Ligatures 连字
我在Joules中创建了相当数量的连字,使用者在排版时可以手动选择应用它们。
![ilovetypography.com_Joules ligatures_ligs](/d/file/p/2014-10-25/23a60fb0c4caf79ae27204be30220e58.jpg)
下面举一个实例说说我是如何创建这些连字的。首先,我们先来看看这个z和a原始的连排效果。
![ilovetypography.com_z and a_z-a](/d/file/p/2014-10-25/f0c475909d1f6b43f398e11be4dfbe51.jpg)
其实我可以在字距配对的时候让它们以一种时髦的方式漂亮的重叠在一起,但更负责的做法还是做一个z-a的连字。第一步,创建一个空白字符,然后把z和a复制进来:
![ilovetypography.com_z and a, pre-ligature_za-nonlig](/d/file/p/2014-10-25/70fa6047994bee9bf86af494a98e3a97.jpg)
第二步,切开它们的轮廓,让它们能在合适的位置结合:
![ilovetypography.com_z and a, pre-ligature..._za-lig-making-1](/d/file/p/2014-10-25/ce0682abc35a350fd90c150a9a203659.jpg)
第三步,删除多余的部分:
![ilovetypography.com_z and a, pre-ligature..._za-lig-making-2](/d/file/p/2014-10-25/0c54431599259d6d0f746128bdf153ab.jpg)
第四步,移动字符让它们靠近:
![ilovetypography.com_z and a, pre-ligature..._za-lig-making-3](/d/file/p/2014-10-25/31a48fbb6cdd6e583426ed458da5e399.jpg)
第五步,连接节点:
![ilovetypography.com_z and a ligature_za-lig-making-4](/d/file/p/2014-10-25/5501867ab9480c92e4c4705f1dd269d0.jpg)
智能连字
Joules的第一个版本中并没有包含智能连字:这种技术是我最近才学会的。其中的细节我就不唠叨了,但可以告诉你的是,需要在Fontlab中打开一个特殊的OpenType面板,并且通常还要写一些脚本,这样才能在一些能够识别连字的软件中激活你所创建的连字。大体上看起来是这个样子:
![ilovetypography.com_Ligature definitions_open-ligs-def](/d/file/p/2014-10-25/14548199a624a36b2a25c4fed8e5fddb.jpg)
完成
这就是经过了无数次修整和字距调整之后的最终结果:
![ilovetypography.com_Joules_joules-page](/d/file/p/2014-10-25/5711c25187e4f508920100239ebca986.jpg)
我后来又接着给它做了一个意大利体的版本(好吧,其实更象是一个斜体,你们这些吹毛求疵的家伙),然后是一个粗体、粗意大利体,然后是大黑体。如果还有人感兴趣,我可以继续说说其中的细节。
[Alec Julien居住于美国佛蒙特州,是一个网络开发人员和业余字体设计师。他的梦想是有一天能搬到一个温暖的地方,为一部小说做排版。]
本文转载自译言网
原文地址:http://article.yeeyan.org/view/snlchina/3433