哪些系統、瀏覽器和軟體支援可變式字型(Variable Fonts)?

2021-10-05 09:58:07.0

分類: Products and Applications

可變式字型(Variable Fonts)是OpenType字體格式的一種,從2016年發佈至今,與以往的字型檔案的使用經驗不同,只需安裝一個可變式字型(Variable Fonts)檔案,即可使用該字型定義的可變屬性,如字重(weight)、寬度(width)、傾斜(slant, italic)、光學尺寸視覺調整(Optical size)等,變化出一套完整系列字體,不再需要安裝10幾個字型檔案,大幅減少安裝字型套數且有效降低字型檔案大小。

 

可變式字型(Variable Fonts)讓設計師的設計帶來更多的變化,透過彈性的微調字型細部參數,打造出專屬的字型樣式,讓作品更具有視覺吸引力。

 

可變式字型(Variable Fonts)使用需要在支援可變式字型(Variable Fonts)的作業系統與軟體中使用。以下列出各作業系統、瀏覽器和軟體最低支援版本。

 

作業系統

作業系統顯示可變式字型(Variable Fonts)是用字重加樣式方式呈現

作業版本 最低支援版本
Windows 10 1709
macOS 10.13

 

瀏覽器

瀏覽器支援顯示可變式字型(Variable Fonts)的變軸設定(Weight、Width、Italic、Slant、Optical Size),如何將可變式字體使用於網頁上可參考下方應用新知連結中的文章https://ifontcloud.com/index/newknowledge_detail.jsp?id=89

瀏覽器 最低支援版本
Chrome 66
FireFox 62
Safari 11
Edge 17
Opera 53
IE 不支援

 

手機瀏覽器 最低支援版本
iOS Safari 11(需使用iOS11)
Android Chrome 93(需使用Android OreoAPI version 26)
Android Firefox 92(需使用Android OreoAPI version 26)

 

 

軟體

可以利用可變式字型檔案量小,但透過變數軸的調整,為您的作品提供更多的字體面貌。

軟體 最低支援版本
Adobe Illustrator CC 2018 (201710)
Adobe Photoshop CC 2018 (201710)
Adobe InDesign CC 2020(201911)
Sketch
59
Microsoft Word
Office 365
Apple Pages
11.1
Apple Keynote
11.1
Apple Numbers 11.1

 

部分軟體如MS Office 365 Word、Apple Keynote,未完全支援可變式字型的使用,但是使用者仍可使用到可變式字型預設的字型實例,如下圖

 

Windows Office 365 Word

 

Mac Office 365 Word

 

Apple Keynote

 

 


Products and Applications

Emoji表情符號in文鼎DC曼蒂手書體

2021年,文鼎字型與插畫家Mandie合作,將Mandie親筆書寫的手寫字開發成數位中文字體。Mandie自己平時一直保持著手寫的習慣,希望藉由數位化後的字體產品,讓大家在取得電腦打字方便性的同時,也能夠重溫手寫字體的情感,讓更多人記得手寫字體的溫度,回味一筆一畫寫字的時光。

文鼎字型自2015年開始開發文鼎DC陳森田MORITA、文鼎DC香蕉人體、文鼎DC云康鋼筆行楷、文鼎DC蔡燊軒行書體,這類型的字體強調具有個人風格、個性化,近年在台灣市場能見度逐漸提高,應用在印刷、螢幕顯示、手機介面上都有別於傳統印刷字體的感受體驗。

文鼎DC曼蒂手書體除了將Mandie的手書風格記錄在字體中,另外還有一個小彩蛋:特別企劃商請Mandie繪製了三百多個表情符號(emoji),讓Mandie具有特色的手繪融入字體中。

要如何使用文鼎DC曼蒂手書體的表情符號呢? 我們以Adobe illustrator為例,當字元選擇文鼎DC曼蒂手書體時,開啟「字符」面板,滑動面板右方的拉桿,看到表情符號點選即可。需要注意的是在字符面板共有兩個區塊呈現這三百多個表情符號,這兩者的差別在於當符號用於橫排、直排的位置。



對於表情符號的開發,文鼎的設計師也不馬虎,對於符號單獨使用在橫排、直排以及符號與漢字一起使用時,在橫排、直排的排版效果都有加以最佳化的調整與設計。



在Adobe illustrator另外一個使用表情符號的方式是透過替換字符的機制做選用,在這個情境中,表情符號已經輸入完成,將滑鼠移至該表情符號上出現的替換字符,呈現的候選符號為上述為直排情境設計的字元。



近年來在Apple、Microsoft等系統廠商開發支援表情符號的作業系統、軟體後,表情符號在使用上的門檻降低了許多,有興趣的使用者可以在Mac、Windows上試試以下快捷鍵,呼叫出可輸入表情符號的小鍵盤、視窗來使用:
Mac作業系統:Control+Command+空白鍵
Windows作業系統:Windows(視窗鍵) + . (句點)或Windows(視窗鍵) + ; (分號)

但要請使用者注意,現階段有支援表情符號的軟體有限,以Windows為例,同樣是office 356中的Word、Excel、Powerpoint,輸入表情符號後呈現的行為也會有異,這樣的情形有待軟體開發商的支援,以讓表情符號有一個友善的使用環境。

文鼎DC曼蒂手書體
字體應用及用途:書刊標題、影片/電影標題、食品包裝、生活感的廣告標語、電子書信書寫等。

Products and Applications

輸入內碼也可以打出你想要的字

能夠代表一個人的稱謂有很多種,有本名、小名、綽號,還有獨一無二的身分證字號,在輸入法中,好比「林」這個字,注音輸入法輸入「ㄌㄧㄣˊ」,倉頡輸入法輸入「木+木」可以找到他,這就好比稱謂一樣,以不同的方式可以叫出不同的字碼,內碼輸入法也是其中一種,而且就是像身分證字號那樣,是一種獨一無二的,在標準字中,一個字碼就代表一個字,如果今天我們得知這個字碼Unicode碼位,但不知道他的念法或倉頡,就可以用這個小技巧。

以「林」這個字為例,開啟電腦的微軟注音或微軟倉頡,輸入「` 」+「U」+「6797」,輸入完字碼點選空白鍵輸出,就可以打出這個字碼所代表的字,這邊需要小提醒,這邊輸入的數字需要點選左邊上排的數字鍵,如果輸入右邊數字鍵盤,是沒有反應的喔~以「林」這個字為例,開啟電腦的微軟注音或微軟倉頡,輸入「` 」+「U」+「6797」,輸入完字碼點選空白鍵輸出,就可以打出這個字碼所代表的字,這邊需要小提醒,這邊輸入的數字需要點選左邊上排的數字鍵,如果輸入右邊數字鍵盤,是沒有反應的喔~

My alt text

 

 

同場加映,如果今天想要知道一個字的字碼怎麼辦,我們只需要開啟Word,在上面鍵入您想知道字碼的字,例如「林」這個字,輸入完後直接點選鍵盤的Alt+X,這個字就會轉換成Unicode的字碼「6797」。

 

Products and Applications

如何呈現國字〇

在使用輸入法輸出中文字時,你的零是以怎樣的面貌呈現呢?是寫成國字「零」,還是「〇」、「O」、「○」、「0」或是寫「0」?在windows作業系統的環境裡,「零」、「O」或「0」使用任何輸入法都可以打出來,但是「〇」用一般系統內建的輸入法像是注音、新注音、倉頡是找不到的,如果您有額外安裝的輸入法,如自然輸入法,鍵入零這個字,則可以透過選單找到「〇」。

上面舉例的這些字元造型都長的很相近,每一個字元在Unicode字碼的定義裡都有一組數字來代表自己,這組數字一般通稱為字碼,這幾個字碼及其代表的意思分別如下:

零:U+96F6,中文漢字零。

0:U+FF10,全形數字零。

○:U+25CB,空心圓圈,幾何圖形。

〇:U+3007,國字零,中日韓符號和標點。

0:U+0030,數字零,屬於基本拉丁字母。

O:U+004F,拉丁大寫字母O,屬於基本拉丁字母。

 

這些造型相似的字元在使用上會有怎樣的差異,下圖我們以微軟正黑以及文鼎UD晶熙黑體做舉例,在使用國字顯示西元年時,我們可以看到使用 U+3007「〇」字元有最佳的排版效果,除了U+3007這個字元本身就是為了與國字一起使用外,以晶熙黑體為例,還會因應字體造型、字重做最佳化的設計。

字碼對於大部份人來說很陌生,而且並不是每個軟體都支援字碼輸入,在word使用微軟注音輸入法時,透過輸入鍵盤上左上位置的「`」這個符號,就可以輸入字碼,輸入「~」會產生一個黃色的小視窗,此時輸入「U3007」按空格就可產出「〇」,要特別注意的是數字不能用鍵盤右方的小鍵盤輸入,一定要用英文上方的數字輸入才行。

如果在繪圖軟體,如Adobe illustrator裡,我們可以透過「字符」工具面版來找到「U+3007,〇」這個字元,或者是用前面word輸入的教學方式,在word中將「〇」呼叫出來,再複製到Adobe illustrator中做使用。

 

分享一個可以快速打出「〇」的方法,讓你不用再花時間找方法要怎麼打出這個字。

1. 開啟瀏覽器到google翻譯的頁面:https://translate.google.com/?hl=zh-TW

2. 選擇中文,會看到右下角顯示「注」,點選下拉選單,選擇「簡體中文(中國)-手寫」

3. 選好後就會出現手寫的輸入框,直接用滑鼠在上面寫「〇」

4. 寫好後就會顯示和「〇」相似的字,選擇紅框即會產出「〇」 

這個方法是不是很簡單,快來試試看吧!