可变式字体variable font在设计上的应用,以明/宋体为例

2021-05-17 23:27:31.0

分類: 字体产品与应用

可变式字体(variable font) 发布于2016年,发布至今,我们观察到许多字体设计公司逐渐地发布自家的可变式字体,经过这几年的推广,最近我们从问卷调查上发现国内的设计师对这样的产品仍然感到陌生,今天,我们藉由几个演示,再一次让大家认识可变式字体。

 

可变式字体的特色在于可随使用者的设定或是依应用程序的自动判断,变化出将近无限种的字体属性组合。只需要一个字体档案,就可以无间段调整该字体提供的字重、字宽或对比等可变属性,让设计师用字的创意不再受局限,同时也减少了庞大字体家族所需要的海量存储器空间。

 

不知道大家有没有思考过一个问题,字体设计师都是在60公分距离前的屏幕做字体设计,使用时,有可能近到20公分,远则超过5公尺以在使用的字体,这样的应用情境,字体的设计如果都一样,合理吗?设计师如果在用字的时后,思考到这样层次的问题,有没有产品可以上设计师挑选使用呢?

 

通常在进行字体开发前先会决定使用目的,而在选用字体时,会依情境来选用造型,在使用明/宋体这类的字体时,通常横向笔画的粗细是固定的,在可变式字体里,可以将横向粗细的变化设计在可变式字体的变化轴上,使用者除了传统的字重外,还可以使用到横向笔画(对比/Contrast)变化轴的调整。下方以文鼎书苑宋体书苑宋作为举例,因应复杂化的使用情境,书苑宋设计了四个横笔粗细的产品,为横笔宽度16(EM Square =1000 ) 到64 的响应式设计,使用者可依据使用配方建议,从内文到标题,从纸本到屏幕,因应不同情境选取适当字体使用。

 

有个多个横笔粗细对比这样的产品,我们思考一下,如果在设计这样的指示标示,怎么样可以让阅读讯息用的字体在画面上呈现的更好呢?画面上『南京三民站』这几个字分别使用思源宋体(上)与文鼎书苑宋体(下)做展示,我们可以看到这五个字符笔画数并不算多,但『三』这个字的笔画相对起来特别少,整体看起来视觉灰度少了一级。

这时候如果我们要对他加粗,通常的作法就是在AI里转外框,加笔画,但这样一来,字就变成图,不是字了,会增加后续版本维护的困扰。使用书苑宋可变式字体的微调后的成果,我们来看看调整前后的差别,经过适当的调整后,每个字符的视觉量感变得更平均了。

我们认为,设计师宝贵的时间应该要用在设计思考上,如果字体可以协助设计师解决问题,节省设计师的时间,那就是我们对设计产业的帮助。关于更多可变字体的信息可参阅下方文鼎iFontCloud云字库的展示说明

https://ifontcloud.com/index/variablefont.jsp


字体产品与应用

长体

长久以来,大多数中文汉字数字字体的设计规格都局限在正方形的方框中,从而产品化出结构方正的字体,然而,当遇到字符宽度无法在有限的宽度空间中做文字排版时,即延伸出「长体」的字体产品,用以缩减排版时整体的字符宽度。早期长体的设计,相对于正方形标准产品的设计规格,保持相同的字体高度,但缩小左右的水平空间,所形成长型的字体即称为长体,相对于未变形前水平、垂直100%的比例,缩小左右10%比例的字体,称为长一,缩小左右20%比例的字体,称为长二…。

为什么要使用长体字?
长体数字中文字型的数量相对来的少,在早期,由于软、硬件环境的不成熟,长体字被设计在正方形的方框中,缩小后的左右水平空间以留白的样貌呈现,在水平横向排排版应用时,会形成字符间距过大的情况。随着外部软硬件技术的提升,新技术、新应用情境的发生,字体设计的弹性更加的广泛,让字体设计师的创意可以尽情的发挥。

如前述,规格上,长体是缩小左右比例后的字型产品,在应用上存在经济效益,此经济效益说明的是节省版面的空间,具有较窄字宽的长体字,能够将更多的字符呈现在一行、标题、段落、区块文字甚至是页面中,具有在有限的排版空间上呈现较多字符数的特性,反之,在同样的版面空间上,可以有较多的字符数来呈现内容。 但是,长体字也不是没有缺点,毕竟在汉字,尤其是笔画数多的汉字,在缩小字宽后的辨视度、易读性会比标准字宽的字体来的低。


中文长体字的使用在直排、字符数少的情境下效果最佳,以字符数少的情境,当字体家族具有标准与长体字的设计时,如标题、引言等都是长体适合发挥的舞台。使用同一种字体风格的长体字做排版,除了可以凸显要点外,还可以维持整体风格的一致性;当长体字被独立使用时,其长形字的特色容易被凸显出来,用在独立的标题更显特色。



长体字型产品的开发,丰富且扩展了字体家族。
中文字型产品的字体家族(font family)大多以字重的粗细为基础做字型产品的开发,相对于拉丁字的字体家族设计,除了字重以外,还有斜体(italic)、长体/窄体(condensed/ narrow)、宽体(extended)等设计,对应上就显的单薄。在应用上,若设计案件选择到具有condensed/ narrow设计的拉丁字,这时,往往找不到合适的中文字型产品做匹配。



自2017年开始,文鼎字型着手设计并发行具有规格化的长体字型产品,在字型设计时,即考虑使用行为,为了让设计师/用户快速的从软件的字型列表中找到长体字型,我们在字体名称上做区隔,透过代码即可辨视该字型是否为长体字。长体字型以代码C做为表示,代码后的数字表示在EM1000的规格下,字宽的比例,如「C80」表示为长体、字宽80%的字型。



目前,文鼎字型具有长体设计的字体家族有:文鼎UD晶熙黑體E1、文鼎方新書、文鼎書苑宋、文鼎白玉書體,详细如下:(Variable Font:表示变量轴支持长体的变化)

字型名稱 字重 標準 C95 C90 C80 Variable Font
文鼎UD晶熙黑體 E1 MD ● ○ ○ ● ●
DB ● ○ ○ ●
BD ● ○ ○ ●
EB ● ○ ○ ●
HV ● ○ ○ ●
文鼎方新書 H7 MD ● ● ● ● ●
DB ● ● ● ●
BD ● ● ● ●
EB ● ● ● ●
HV ● ● ● ●
文鼎書苑宋 HKH32
文鼎書苑宋 HKH46
MD ● ○ ○ ● ●
DB ● ○ ○ ●
BD ● ○ ○ ●
EB ● ○ ○ ●
HV ● ○ ○ ●
文鼎白玉書體 H16 LT ✖ ✖ ● ✖ ●
MD ●
DB ●
BD ●
EB ●
HV ●
EH ●
DBL ●
BL ●
文鼎白玉書體 H32 MD ✖ ✖ ● ✖ ●
DB ●
BD ●

*○:可透过可变式字型(Variable Font)使用

长体字型产品图例:






字体产品与应用

定距字型与应用

定距字(monospace font)这是字型设计里重要的设计规格,与其相对的是调和字(proportional font)。定距字是指字符宽度相同的字型,亦称为等宽字、固定宽度字体,本文后续以定距字、定距字型称呼;汉字中的半角字也是定距字的一种,安排后章节做说明。

 

现在大家使用上习以为常的数字字体出现前的时代,字体的呈现是透过铅字排印的方式传达出来,而铅字大多以固定宽度的方式作设计,来符合当时打字机、排印技术上的限制。时代的脚步不断的前行,计算机硬件环境与排印软件对于运算字体的机制也不断的改善,使得排版、阅读感受上,呈现出比较自然的调和字使用变的普及。

 

我们以AR Silver Sans 这款字简单来说明定距设计(Monospace)与调和设计(Proportional)在字符呈现的差异。为了要符合每个字符宽度一致的设计规格,我们可以看到AR Silver Sans Monospace在「i」这个符号字符的空间结构上与AR Silver Sans Proportional有明显的不同,这样的设计主要是为了在空间布局上取得较佳的呈现,另外「m」这个符号字符也因为字符空间的不同,而呈现不同的视觉样貌。

在当代的字型使用趋势中,大多是以兼顾视觉与造型设计的调和字型使用的较多,但定距字的使用,并没有因调和字的大量运用而消失,而是以能清楚呈现信息讯息的功能性使用角度持续存在着,例如微软在2019年发布的开源字型Cascadia Code,就是一款具有固定字距(Monospaced)特性的字型,适合用于计算机系统与工程师程序开发等用途上,让工程师在进行字符阅读时,达到提升程序代码与接口文字可读性的效益。

工程师在进行程序设计时,使用固定字距的字型可增进开发效率。

 

最近,我们也看到一些公共建设,如新竹车站信息面版、桃园机场的班机信息显示面版当中的字体也都是选用了固定字距的字型。以新竹车站显示列车到站的时刻表为例,这是设计师 施博翰使用了定距字设计的AR Silver Sans Monospace,作为新竹车站时刻表的呈现,这定距字的使用,配合设计师排版的专业,增加了时刻表上数字讯息阅读的可读性。

设计师 施博翰在新竹车站列车时刻表的排版设计

 

 

桃园机场的班机信息显示面版以定距字做为讯息阅读的文字选择。

 

 

虽然定距字型出现的时间较调和字型早了很多,但在使用上并没有因为外在环境硬件的提升而消失,反而以在特定情境下具有高辨视度的功能性继续存在着,厂商们也持续设计新的定距字,也让用字多了许多的选择。

 

 

附注:新竹车站列车时刻表引用自设计师 施博翰在「台铁新竹站指示标示系统设计规划说明」

 

字体产品与应用

字体风味轮

文鼎是一家字型厂商,近几年也陆续承接了许多字型配对的案件,主要都由英欧文字的需求开始,做中文、日文、韩文的字体搭配。以我们所处的环境,每天眼睛看到的繁体中文,对我们来说是最熟悉不过的文字,但是,对于文字来说,透过笔画造型、字体结构等变量因子的设计,会产生许多不同风格的字体产品出来,茫茫字海中有没有什么方式可以让使用者快速的找到所需使用的字体呢?|

喜欢喝咖啡或常逛咖啡馆的同好如果有注意到的话,应该会知道「咖啡风味轮(Coffee Taster's Flavor Wheel)」,它时常以海报的形式挂在咖啡馆中展示,如果没有看过,有机会的话多走几间咖啡馆,留意一下墙面的海报,就会发现啰!我们参考咖啡风味轮的概念,将其延伸到字体来,以汉字为出发点,从以字型应用的角度,试图将抽象的感受具体呈现出来,用图像形式设计出一个具有感性、具有情感的字体分类系统,让用户需要以感受来选字时,可以透过文字风味轮找到对应的字体,减少找字体、选字体的时间。

感受这种东西是一种主观性的认知,为了尽量找出符合大众想法的感受,在绘制字体风味轮之前,研究团队做了以下前期研究:

1. 研究咖啡风味轮期发展过程,是否有可借镜之处?

2. 以人为单位,不同的个体对字体造型是否有共通感受?

3. 字体造型是否受到文化发展的影响

4. 越来越多的跨语系字型Matching,风味轮/个性轮的定义,是否对此有帮助?及智能显示的应用?

 

我们认为感受性的事物会因为人、事、时、地、物等因素而有不同,因此我们也藉由公开的投票系统,让参与者参加文字风味轮分类的统计,让文字风味轮不仅是一个图像,而是能呼应外界的变化具有生命力的模型。

 

最后,整合我们所收集到的数据,将这些数据整合到字体的数据库,让每个字体都有自己的标签分类形成字体风味轮。

 

文鼎字体风味轮档案下载