字體與外部環境改變的交互調整

2021-12-22 10:41:00.0

分類: Products and Applications

 

80年代開始的電腦數位字體,在特性上,相較於鉛字,有更容易開發多字重字體家族的特性,但是,在物理限制上,同一個字重若要使用在不同字號大小上,排版出來的顯示效果就需要設計師稍微的留意一下字元間灰度的一致性。

 

我們一直提到字體的使用與外部環境、載體有著絕對的關係,時間拉回到活版印刷鉛字的時代,初接觸活版印刷鉛字的朋友,看到鉛字的規格有著初號、一號、二號、三號、四號、五號、六號等規格,一時間除了看到鉛字大小的差異外,並不理解當中的用途以及鉛字的設計。

 

概略來說,在鉛字印刷的時代,鉛字的設計在同一個造型不同字號的大小上,字元設計的結構佈局具有細微的差異,這可算是近來optical size(視覺大小最佳化)概念的前身了,簡單來說,就是為了讓不同字號的字體可以有最佳的呈現,如:不同的應用情境、更清晰的顯示或具有個性…而做的細微調整設計,以達到文字最佳的顯示效果。

 

傳統上,字體由細到粗的字重變化是字體這個素材在應用時最常用到的屬性,但隨著科技持續的研發創新,字體使用的載體早已不限於紙張材質的媒介,更透過不同印刷方式、油墨特性呈現多元的樣貌,甚至在螢幕上的使用,也進化到肉眼分辨不出螢幕畫素的是網膜等級。

 

我們整理幾個字體應用在外部環境比較常受到影響的因子:

1.     光線明、暗

2.     直射光、反射光

3.     載體的不同:紙本、數位螢幕、紙張材質、螢幕解析度

4.     數位螢幕:白底黑字、黑底白字

 

 

電腦數位字體相較於鉛字印刷時代,在載體、使用環境上都複雜許多,以下,我們舉幾個例子來看看,在不同的情境上,遇到漢字筆畫數差異高的字元並列時,不加思索的直接使用字體,以及瞭解字體規格與特性後,微調後的排版效果,希望透過比較後,讓使用者更加的體認到字體使用上細膩、獨到之處。

 

範例一,文鼎毛楷、文鼎顏楷

文鼎毛楷是一款擁有Bold、Extrabold、Heavy三個字重的書法字體,簡潔有勁的筆型線條變化及長形字構設計,呈現秀麗的書法的風格,適合於小標題、大標題使用。

 

下圖白底黑字為反射光用字情境,黑底白字為直射光用字情境

在左上區塊,我們可以看到「蝦」這個字元的灰度弱於其他兩字,這時候,如果我們將「蝦」單獨這個字元的字重換成Heavy(右上區塊),視覺上,三個字元的灰度是不是就平衡了許多呢?

 

 

左下區塊黑底白字為類似廣告燈箱的直射光用字情境,這時候我們看字的光線會從背板直接射入我們的眼球,筆畫多的字,散發出來的光線量會比較多,因此適當的將筆畫多的字元粗度減細,可以降低視覺上光暈的現象發生,進一步的提升閱讀的舒適度。

同樣的,下方文鼎顏楷的使用也類似文鼎毛楷的原理,由此,我們可以知道,瞭解一款字體的特性、觀察不同的用字情境,適當的選用、挑選是必要的。

 

範例二,文鼎方新書

文鼎方新書是一款保留著黑體的簡練、穩重,也融合著明體的舒適、清雅的一款字體。這個使用情境無論是上方的白底黑字或下方的黑底白字,都是模擬廣告燈箱的直射光用字情境,與範例一不同。

 

範例一我們透過對字元進行字重的挑選,達到視覺上字元灰度的平衡,而方新書這個範例情情境,則是挑選已經預設好的字體設定來使用。當用字的載體環境都相同時(直射光),變數在於淺色底及深色底,我們會建議淺色底使用標準版的「文鼎方新書H7C95_H」,而深色底我們會建議使用有對漢字筆畫數較多的字元進行筆畫減細的「文鼎方新書H7C95D_H」,追求的都是降低視覺上光暈的現象發生,進一步的提升閱讀的舒適度。

 

 

 

不同變數下使用不同規格、不同設定的字體,甚至是加以細節的微調,如字元間距、字元高度等,以達到最佳的視覺效果,這是我們在本篇文章希望讀者可以學習到的地方。

 


Products and Applications

長體

長久以來,大多數中文漢字數位字體的設計規格都侷限在正方形的方框中,從而產品化出結構方正的字體,然而,當遇到字元寬度無法在有限的寬度空間中做文字排版時,即延伸出「長體」的字體產品,用以縮減排版時整體的字元寬度。早期長體的設計,相對於正方形標準產品的設計規格,保持相同的字體高度,但縮小左右的水平空間,所形成長型的字體即稱為長體,相對於未變形前水平、垂直100%的比例,縮小左右10%比例的字體,稱為長一,縮小左右20%比例的字體,稱為長二…。

為什麼要使用長體字?
長體數位中文字型的數量相對來的少,在早期,由於軟、硬體環境的不成熟,長體字被設計在正方形的方框中,縮小後的左右水平空間以留白的樣貌呈現,在水平橫向排排版應用時,會形成字元間距過大的情況。隨著外部軟硬體技術的提升,新技術、新應用情境的發生,字體設計的彈性更加的廣泛,讓字體設計師的創意可以盡情的發揮。

如前述,規格上,長體是縮小左右比例後的字型產品,在應用上存在經濟效益,此經濟效益說明的是節省版面的空間,具有較窄字寬的長體字,能夠將更多的字元呈現在一行、標題、段落、區塊文字甚至是頁面中,具有在有限的排版空間上呈現較多字元數的特性,反之,在同樣的版面空間上,可以有較多的字元數來呈現內容。 但是,長體字也不是沒有缺點,畢竟在漢字,尤其是筆畫數多的漢字,在縮小字寬後的辨視度、易讀性會比標準字寬的字體來的低。


中文長體字的使用在直排、字元數少的情境下效果最佳,以字元數少的情境,當字體家族具有標準與長體字的設計時,如標題、引言等都是長體適合發揮的舞台。使用同一種字體風格的長體字做排版,除了可以凸顯要點外,還可以維持整體風格的一致性;當長體字被獨立使用時,其長形字的特色容易被凸顯出來,用在獨立的標題更顯特色。



長體字型產品的開發,豐富且擴展了字體家族。
中文字型產品的字體家族(font family)大多以字重的粗細為基礎做字型產品的開發,相對於拉丁字的字體家族設計,除了字重以外,還有斜體(italic)、長體/窄體(condensed/ narrow)、寬體(extended)等設計,對應上就顯的單薄。在應用上,若設計案件選擇到具有condensed/ narrow設計的拉丁字,這時,往往找不到合適的中文字型產品做匹配。



自2017年開始,文鼎字型著手設計並發行具有規格化的長體字型產品,在字型設計時,即考量使用行為,為了讓設計師/使用者快速的從軟體的字型清單中找到長體字型,我們在字體名稱上做區隔,透過代碼即可辨視該字型是否為長體字。長體字型以代碼C做為表示,代碼後的數字表示在EM1000的規格下,字寬的比例,如「C80」表示為長體、字寬80%的字型。




目前,文鼎字型具有長體設計的字體家族有:文鼎UD晶熙黑體E1、文鼎方新書、文鼎書苑宋、文鼎白玉書體,詳細如下:(Variable Font:表示變數軸支援長體的變化)

長久以來,大多數中文漢字數位字體的設計規格都侷限在正方形的方框中,從而產品化出結構方正的字體,然而,當遇到字元寬度無法在有限的寬度空間中做文字排版時,即延伸出「長體」的字體產品,用以縮減排版時整體的字元寬度。早期長體的設計,相對於正方形標準產品的設計規格,保持相同的字體高度,但縮小左右的水平空間,所形成長型的字體即稱為長體,相對於未變形前水平、垂直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)使用


長體字型產品圖例:






字重 標準 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

 


長體字型產品圖例:






Products and Applications

可變式字型variable font在設計上的應用,以明/宋體為例

可變式字型(variable font) 發佈於2016年,發佈至今,我們觀察到許多字型設計公司逐漸地發布自家的可變式字型,經過這幾年的推廣,最近我們從問卷調查上發現國內的設計師對這樣的產品仍然感到陌生,今天,我們藉由幾個演示,再一次讓大家認識可變式字型。

 

可變式字型的特色在於可隨使用者的設定或是依應用程式的自動判斷,變化出將近無限種的字體屬性組合。只需要一個字型檔案,就可以無間段調整該字型提供的字重、字寬或對比等可變屬性,讓設計師用字的創意不再受侷限,同時也減少了龐大字體家族所需要的大量記憶體空間。

 

不知道大家有沒有思考過一個問題,字體設計師都是在60公分距離前的螢幕做字體設計,使用時,有可能近到20公分,遠則超過5公尺以在使用的字體,這樣的應用情境,字體的設計如果都一樣,合理嗎?設計師如果在用字的時後,思考到這樣層次的問題,有沒有產品可以上設計師挑選使用呢?

 

通常在進行字型開發前先會決定使用目的,而在選用字型時,會依情境來選用造型,在使用明/宋體這類的字型時,通常橫向筆畫的粗細是固定的,在可變式字型裡,可以將橫向粗細的變化設計在可變式字型的變化軸上,使用者除了傳統的字重外,還可以使用到橫向筆畫(對比/Contrast)變化軸的調整。下方以文鼎書苑宋體書苑宋作為舉例,因應複雜化的使用情境,書苑宋設計了四個橫筆粗細的產品,為橫筆寬度16(EM Square =1000 ) 到62 的響應式設計,使用者可依據使用配方建議,從內文到標題,從紙本到屏幕,因應不同情境選取適當字型使用。

 

有個多個橫筆粗細對比這樣的產品,我們思考一下,如果在設計這樣的指示標示,怎麼樣可以讓閱讀訊息用的字體在畫面上呈現的更好呢?畫面上『南京三民站』這幾個字分別使用思源宋體(上)與文鼎書苑宋體(下)做展示,我們可以看到這五個字元筆畫數並不算多,但『三』這個字的筆畫相對起來特別少,整體看起來視覺灰度少了一級。

這時候如果我們要對他加粗,通常的作法就是在AI裡轉外框,加筆畫,但這樣一來,字就變成圖,不是字了,會增加後續版本維護的困擾。使用書苑宋可變式字型的微調後的成果,我們來看看調整前後的差別,經過適當的調整後,每個字元的視覺量感變得更平均了。

我們認為,設計師寶貴的時間應該要用在設計思考上,如果字體可以協助設計師解決問題,節省設計師的時間,那就是我們對設計產業的幫助。關於更多可變字型的資訊可參閱下方文鼎iFontCloud雲字庫的展示說明

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

Products and Applications

好看的中文字體哪裡找? Fonts Fun–字字不倦 App

讓你的 IG 限時動態與眾不同!!!Fonts Fun App 有60種精選的中文字體,可以讓你在社群軟體、筆記、或是簡報製作上都有更多元的字型盡情的創作!

 

Link: 

https://agirls.aotter.net/post/59343