第八章 字体的转曲

字体在设计中是不可缺少的元素,无论你是设计海报,广告牌,网站,还是手机界面,都离不开字体。字体的运用也是设计中重要的组成部分。尤其是在做手机端界面设计的时候,一个像素都不能差。所以这就涉及到每个元素之间,要对齐要统一,不能有偏差。

在Sketch里会出现一种情况,就是打字的时候,字体的边框有的会直接和文字自适应,有的字体边框会高出很多,这样就会造成当你想知道第一行字和第二行字的间距是多少时,就会容易造成误差。因为当你按住ALL键时,出现间距间的距离是多少,但它都是以元素的边框来开使计算的。这样当字体的边框高的时候,计算间距就会有问题了,因为我们是要按照字体最近的底端开始计算到下面另一个元素的顶端间距值的。我放个图,可以看下:

我把字体选中时的边框用红框圈了起来,你会发现上面的字体边框距离字体的间距就不一样。上面字体的选中边框离字体本身的底部还要多出很多,下面的可能看起来还好,偏差不大。这是什么原因造成的呢,假如我想快速知道上面的字体和下面的字体间距是多少,怎么办呢?这就需要用到字体的转曲功能。鼠标移到字体处右键,如下图:

我们选最后一个Convert to Outlines 字体转曲,看看字体有什么变化:

边框是按最贴近字体的边缘出现的。而不是像之前那样间距那么大。这样的化就

不会影响间距的大小了。再来看看左边图层区域字体的变化,如下图:

每个字体都被转曲了,分好图层了已经,这样一来,也就方便对字体进行再设计和编辑了。好像AI里面的字体路径一样。但是需要注意的是,字体转曲以后,就不能改字体的大小数值了,这样就需要你在字体转曲前,要定好字体的大小颜色,然后再进行转曲,如果做的时候发现字体想更改,那么最好原来的字体大小值和颜色值要记住,希望Sketch以后的版本里能把这个字体转曲再优化一下,要是可以转曲完也能想没转曲时可以自定义的话,那真的就是完美了。字体的转曲就先说这么多,大家可以试一下,随便在画板上打一些字,试着转曲字体,对字体任意变形,重新设计一下,你会发现很有趣。