提升可讀性的字距調整

2022-01-10 18:13:39.0

分類: Products and Applications

單音、獨體、結構方正的中文漢字,如明體、黑體、圓體等造型,在數位字體設計規格上,無論是應用在印刷或是螢幕顯示,筆畫數少還是多、字重細還是粗,大多將每個漢字字元設計在固定大小的方框內,在使用上,比較少注意到字元間距的排版。

 

我們先前在「定距字型與應用」的文章中題說明過符號/拉丁字具有定距設計(Monospace)與調和設計(Proportional)的設計規格,現在讓我們來看看當漢字與拉丁整合成我們使用的字體產品時,在使用上有沒有需要注意的地方。

 

下圖我們以Adobe 思源黑體與文鼎方新書做為範例,在圖的上方範例,是兩款字體在Illustrator上的排版顯示效果,對於視覺較為敏感的設計師可能會覺得「T」與「y」在字元距離的白空間好像比p, e來的大,下方是經過調整後的結果,整體上,提升了閱讀的舒適度與可讀性,視覺效果舒服多了。

形成「T」與「y」在字元距離白空間的問題,在於大多數中文開發廠商,對於漢字裡的拉丁字,僅對拉丁/符號字元做基本的調和設計(Proportional),缺少對字元做進階的字元間距調整kerning的緣故,以致形成預設的字距對於某些字元組合的不理想,需要手動調整讓所有字元間的空白看起來和諧一致。

 

不過在Adobe軟體上,設計師們可以透過字元面版中「兩個字元之間的特殊字距」功能裡的「視覺」選項,快速的達到類似kerning字元間距調整的效果,主要是Adobe在「視覺」這個功能中,做到可以依據字元的形狀,來調整相鄰字元之間的間距。

目前Adobe CC版本的產品中,設計師常用的PhotoshopIllustratorInDesign在字元面版都支援上述的功能,目前使用這個功能時,漢字與符號/拉丁字元都會起作用,若不希望漢字的字距受到調整,則選取符號/拉丁字元做調整即可,這點需特別留意。

不舒適的字距會讓設計失了分,適當的調整字距有助於閱讀的舒適度與可讀性,不過我們還是要提醒,瞭解所使用字型產品的特性,因應外部環境做最佳化的修正,才能讓字體的這設計元素為設計作品做加分。

 

 

 


Products and Applications

「iFontCloud」APP操作解說

操作步驟

1. 登入iFontCloud會員帳號

 

2. 進入到字體清單頁面

 

3. 輸入關鍵字或用條件搜尋字體

     

 

4. 安裝字體

 

5. 字體安裝完成後,開啟有支援custom fonts的APP使用

支援安裝custom fonts的APP

  • Pages
  • Keynote
  • Numbers
  • Draft
  • Notebook
  • Noteshelf
  • GoodNotes
  • Adobe Photoshop
  • Adobe illustrator
  • Clip Studio Paint
Products and Applications

會員專屬講座-|字體廚房-台日好食光,探討設計與文化的精彩對話|

如果字體有味道,會是什麼滋味 ?

文鼎字型 X 森澤聯手打造的「字體廚房フォントキッチン」即將開張!

    在這個創意空間裡,文字為食材,設計即廚藝,共譜視覺的盛宴。


活動簡介

這場會員專屬的講座邀請到重量級主廚:來自日本的下山以及台灣的忠宜與婉君。
三位頂尖設計師將從自身案例出發,分享其作品背後的故事,從中闡述獨到的選字觀點,為您呈現中文與日文等不同語言的字體應用思維,透過他們豐富的經驗,我們將一同探索字體與設計之間的深層脈絡,開啟多元文化視角。
一同加入我們,步入這個充滿可能性的字體廚房,細細品嚐字體百味。

 

活動時間與地點

時間:2024/11/1 (五) 14:00 - 17:00,13:30開放報到

地點:台北文創A廳( 台北市信義區菸廠路88號6樓 )

交通:建議搭乘捷運前往(捷運國父紀念館站5號出口,步行約350M)


活動講師

 

下山 隆
Red Rooster 公司代表

░ 講師介紹 ░

日本設計公司Red Rooster的代表,對台灣電影有著濃厚的興趣。
主要從事漫畫、音樂、雜誌等設計工作,從小就喜歡畫畫,也喜歡音樂和電影,為了從事唱片封面和電影海報設計的工作,高中畢業後進入了設計專門學校,之後進入設計公司工作,參與了影碟DVD租賃的包裝和海報設計。
個人創業後,負責了漫畫《進擊的巨人》的LOGO和封面設計等許多漫畫的設計工作。 目前正在負責越南恐怖電影《Kfc》以及預計於11月上映的委內瑞拉音樂電影《博士の綺奏曲》的海報設計等宣傳美術工作。

 

葉忠宜
卵形工作室及重本書店 創辦人

░ 講師介紹 ░

畢業於日本京都藝術大學研究所。
平面設計師,「卵形工作室」及複合空間「重本書店」創辦人。
近期入選全球平面設計最高殿堂「AGI 國際平面設計聯盟」。
曾獲英國D&AD awards wood pencil winner及入選德國萊比錫「世界最美麗的書」。

 

何婉君
HOUTH 共同創辦人與設計總監

░ 講師介紹 ░

工作室自 2014 年於台北創立至今,專注於品牌策略與設計,作品曾獲選東京 TDC excellent work、日本東京 (TOP) in Asia。
2024年,受邀參與森澤字體設計競賽繁體中文組評審。
近期入選全球平面設計最高殿堂「AGI國際平面設計聯盟」。
作品以大膽鮮明的色彩、實驗性圖形和創新字體應用著稱,尋求創意解決方案,並打破藝術與商業的界限,除了商業作品,藝術創作和自主出版作品也獲得了廣泛關注。


活動報名辦法

講座分為 線上直播 與 實體活動

  1. 線上直播:YouTube 非公開直播,連結將於活動前1天寄送,請留意報名時輸入的信箱是否正確。
     
  2. 實體活動:提供文鼎字型與森澤專屬文宣品與「字體廚房」活動限定禮物,並開放與講師交流時間。


注意事項

  • 線上直播與實體活動請擇一報名。
  • 若重複發送報名表單,且選擇不同形式的講座,系統將會判定為參加線上直播活動。
  • 填寫完報名表單後,我們將於3個工作日內寄送活動通知信件,並於活動前2天以電子郵件方式寄發「報到通知」至您的電子信箱,請再次留意收件信箱。
  • 報名實體活動後若因故無法參加,最晚請於活動3日前取消報名,釋放名額給想參加的朋友。


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