五个案例教会你「西文中用」字体设计

发布日期:2021-12-11 13:26   来源:未知   

  今天,和大家分享一篇猴子老师在一周前编写的字体设计教程:西文中用。这次没有Logo教程,但是纯唠嗑你们肯定也不能乐意看,那就整一篇字体分享吧,话不多说我们开整。

  大家在平时做字的时候,无论是练习稿还是商业项目,我们最难处理的是什么呢?是不是笔画摆放的位置反复纠结?设计感更是无从下手,笔画的造型怎么调整都感觉不合适?其实总结起来就是结构和笔形的问题了,那么这里分享一些简单的小技巧来帮助大家解决这个问题。

  大家应该有所发现,有很多英文的影子存在,不管是添加局部的特征,还是直接用英文来拼成一个完整的字,这四组字体都有用到英文来做结合,同样的我们也可以采用这种手法来进行设计,这种处理方式的好处就在于不用我们再去冥思苦想反复横跳去寻找笔画的特征了,英文字库自带的特征就足以,且英文字库的数量和种类都非常庞大,各种姿势应有尽有,就看你怎么去开发。

  所以我们此次分享的方法就叫做“西文中用”。本文中的案例采用猴子老师前段时间的一篇站酷首页作品来作为思路分享与讲解,下面我们直接进入分享环节。

  那么刚刚提到我们主要需要解决的就是结构和笔画特征,结构我们可以采用垫底字的方法来快速解决,笔画特征自然是通过英文字母来处理了,第一个案例我们先来做一个简单一些的黑体类型的字,先放出最终稿看一下效果。

  首先,我们可以选择一个思源黑体作为垫底字来解决结构部分的基础问题,其次,我们需要对英文字库大致的观察分析一下,来提取我们所需要的基础笔画,以便于我们后续的拼字过程,那么最常用的就是横、竖、撇、捺、点,以及横竖转折的处理了,其他的部分我们都可以基于这些笔画来进行延展出来。

  竖笔的部分可提取的处理就稍多了一些,这里我们先都列举出来,至于最终会用到哪个还要等具体拼字的时候才会确定。

  撇捺点的部分可选项不是很多,这里就放到一起来提取了,且这三个笔画的处理都可以更加灵活一些。

  转折处的处理同样需要进行尝试后最终敲定,(这里捺的处理我们把撇笔画直接镜像即可)。

  首先搭建基础的结构,但结构可能离我们想要的效果还有些差距,所以下一步还需要对结构进行一轮微调优化。

  微调结构,使整体的外部撑得更饱满,接近标题字形的处理方式,该对齐的对齐。

  进行一些不同笔画处理的尝试,这里就不一一去尝试了,大家在做的时候可以先选择一个字来进行尝试不同的处理方式,这样会节省很多试错的时间。

  最后,选择更为合适的一组,调整一下细节,对齐笔画,统一粗细,统一处理方式等。

  虽说有了自带特征的英文,我们可以不用过多去思考笔画的造型,但还是要多去尝试不同的造型和处理方式所带来的整体感觉,下面我们继续。

  第二个案例我们再做一款黑体类型的字,相较上一款会稍微复杂一丢丢,但方法都是相通的,我们往下来看一下这组字。

  依然是寻找一个垫底字,以及分析英文的特点,这种方法一定要把英文自带的最大或者最好看的特征给呈现出来,不然我们选择西文中用就毫无意义了。

  这里依然可以选择思源黑体作为垫底字的,根据英文的粗细程度,我们可以选择粗一些的。且可以适当调整垫底字的高矮胖瘦来达到自己想要的效果,这里我稍微压扁了一些。

  提取出基本的笔画特征,这里我就不再列举提取来源了,直接以文字的形式描述吧,大家可以一一去对照着看一下。

  横笔的部分除了常规的横线,还可以提取出大写字母E的特征,上下是有一个角度上的呼应的。此外就是蜜蜂二字的虫字部分最下边的连笔处理,选择了数字7放倒的形式,算是做了一个特殊的处理。

  竖笔的部分除了常规的竖线还可以选择小写字母t的形式,也算是与横笔的特征做一个统一。

  撇捺点的形式依然比较灵活,数字7的竖笔,数字1的左上角部分都可以作为撇捺的处理形式。小写字母i上方的点或是短竖线也都可作为点的处理。

  大体的感觉出来了,但个别部分的处理还是有些僵硬,如杜字的木字旁,捺的笔画处理,鹃字右侧鸟字右下的横折钩的笔画,都比较呆板,所以针对这两处进行优化。优化的大体思路可以考虑结合更多的英文特征进来。

  下面我们还需要对结构进行一轮优化,使整体更加饱满,整体的布白也可以进一步优化,说人话就是调整笔画的位置以及粗细,来达到正负空间更均匀的状态。

  尝试过后发现横竖转折处不适合做其他处理,所以还是回到初稿,鸟字上方的一瞥原本是竖线的处理改为圆点,与蜜字顶部的一点可以做一个区分,值得一提的是鹃字左上方的口字部分直接替换为数字2的处理解决掉了比较僵硬呆板的问题。

  第三个案例我们来做一宽宋体类型的字,相较前面的两款字会需要更多些思考与调整,照例先看最终稿。

  先来看一下这次选择结合的英文字形以及垫底字的选择,垫底字肯定是要选一款宋体了,这里我选择的是一款日本的字体,英文选择了一款特征非常强的字形,尤其是连笔的处理效果非常好,所以这也是我们这款字结合的重点,要想方设法的搞里头,搞不里去就自己找原因。

  乍一看好像英文的最大特征并不能结合多少,这时候就要去思考问题了,像英文中的一些细线的变化非常像连笔的形式,所以我们可以在中文当中去寻找一些可以做连笔的位置,来借鉴英文的特征结合进去。可以结合垫底字大致画一下草图进行尝试。

  不需要画的很细致,只需表达出笔画的大致的走向,重点是连笔位置的造型要清晰出来,虫字没画草图这里先不讲。

  这组字可以做的瘦高一些会更能凸显英文特征的气质,所以我们可以适当调整一下,下面开始搭建基础字形。

  绿字左下的连笔不太合适,有点糊掉了,虎字的连笔有些问题,最左侧的竖撇没能体现出来,所以要重新考虑连笔的位置,甲字的造型也不是很美观,虫字的下边在开始观察英文的时候就发现了小写字母g的下边可以替换,所以草图部分就不再做过多考虑了。

  下面针对出现的问题我们逐一解决掉,绿字左下的连笔去掉,正常做,虎字的连笔可以考虑一个另类的位置,从最外侧的竖撇最下端开始连,会很大程度上避免糊的问题,甲字上半部分的处理方式从字母P中提取到灵感,从而做出结合。

  4.当中文中无法直接结合英文时,要考虑适当变形中文笔画,或是结合英文特征去进行处理笔画。

  第四个案例我们再来做个特别一点的字形,英文字形越复杂,我们结合起来的困难也就越大,当然困难点是各不相同的,照例看一下最终效果我们再来解析。

  通过上面的最终效果大家应该看得出来了,这一组字主要难在曲线的调整上,我们来具体看一下所选的英文字形以及垫底字的选择。

  可以观察到这一组英文字的特征是极其强烈的,分析其主要特征,整体字形瘦高,非常多的位置都是类似S形的曲线,且带有粗细变化,这是主要难点,也是需要结合的一大特征。垫底字依然选择思源黑即可,YYDS。下面我们拆分笔画,调整垫底字。

  下面进入拼字环节,根据英文的特征,我们把中文的结构也设定为瘦高的,适当调整垫底字。

  这一组几乎没有什么尝试的过程了,拆分出的笔画拼出的基础字形特征已经足够强烈,说几个需要注意的点,枯字右下的口字部分的处理,这里为了契合整体,选择把正常的口字设定直接放倒并拉伸至合适的比例,随即调整比例以及笔画的粗细程度,以达到与整体协调的粗细。这里把原字库的锚点情况给大家看一下,你们感受一下。

  其余就没有过多的一个调整了,都是类似的方法去简化曲线,使其更好调整,横笔的特征可根据整体的空间来调整大小,如果全是一样大的,则非常难摆放。

  最后一组案例我就不再讲解了,因为都比较简单,直接给大家看一下具体使用的哪些字母。

  虽说看起来没什么难度,因为操作上没啥难点,主要还是在于多去发现,多去观察字母与汉字笔画的关系,甚至这个思路可以延伸至任何地方任何事物,都可以成为你处理笔画的一个思路来源。

  字体设计的方法和形式非常多,西文中用只是其中的一种。大家只有不断的尝试,把不同的字体、不同的设计技巧进行组合,才能设计出完美与合适的字体。

  好了,这次的教程分享就到这里。另外第35期“字体+动效”线上课目前正在报名中,猴子老师将继续担任字体设计部分的讲师。如果大家感兴趣想跟他学习,可以点击右边链接→《招收些想学「字体+动效」设计的》或下图报名。老铁们我们下次教程再见!