教程 可變字型
No.07 Variable Fonts

如何製作 可變字型

製作可變字型之前,您需要先了解幾件事。本教程演示如何基於現有的非可變字型來建立可變字型。

教程式號: 07
官方原文: high-logic.com
內容狀態: ✅ 基於完整內容建立

可變字型的概念已經存在了幾十年,但直到 2016 年,這項技術才被 OpenType 規範採用。

可變字型是單個檔案,包含一個或多個軸(例如字重或寬度),允許您透過插值使用連續範圍的樣式變化。FontCreator 允許您匯出可變字型,但它也可以用於透過單擊匯出所有預定義的樣式(命名例項),因此您可以更快地製作字型。

本教程展示如何從兩個現有的(非可變)字型建立可變字型。

我們假設您已經制作了字型族的常規和粗體版本。要開始,請在 FontCreator 中開啟它們。

字重軸

由於我們結合了兩個不同字重的字型,我們需要新增字重軸。

啟用常規樣式(1)並開啟字型屬性面板(2)。

從那裡,轉到軸選項卡(3)並單擊 [+] 工具欄圖示並選擇字重(4)。

字型屬性 - 軸選項卡

粗體主字型

在字型屬性面板中,選擇主字型選項卡。單擊 [+] 工具欄圖示並選擇粗體字型。這將把粗體字型中的所有字形輪廓複製到這個字型中。

注意:此時您可能會注意到字型概覽面板中的幾個字形突然有紅色背景標題。這表示這些字形存在相容性問題,因此插值將失敗。我們將在本教程後面介紹這一點。

我們需要更新兩個主字型的軸位置。選擇常規主字型並將位置設定為 400。對於粗體主字型,將其設定為 700。

此時我們已經有一個可變字型了。做得好!

初步印象

如果您對目前的結果感到好奇,我們也是。

要使用字重軸,我們需要訪問變化面板。如果它尚未可見,請從主選單中選擇檢視 -> 面板,然後確保已選中變化。您也可以使用快捷鍵 Ctrl+F7 切換此面板的可見性。

變化面板允許您預覽主字型之間的位置。使用字重滑塊,您將看到輪廓自動插值。

我們還需要使用另一個面板,讓我們引入主字型和圖層面板。如果它尚未可見,請轉到主選單並選擇檢視 -> 面板 -> 主字型和圖層。快捷鍵 Ctrl+F6 也可以。

此面板允許您在可用的主字型之間切換。這很重要,因為字形輪廓圖層始終位於主字型上。因此,如果您想調整常規字形輪廓,請選擇該主字型。

測試網路字型

所以使用字重滑塊很有趣,但它在 FontCreator 之外真的有效嗎?

讓我們看看...從主選單中選擇字型 -> 測試網路字型(或按 Ctrl+F5)。這將匯出可變字型以及一個網頁,該網頁將在您的預設網路瀏覽器中開啟。

相容性問題

正如我們之前提到的,插值只有在輪廓圖層相容的情況下才能工作。因此,對於每個字形,輪廓圖層必須具有相同數量的輪廓。它們也必須處於相同的順序,並且點的數量也必須匹配。對於複合字形,字形成員必須匹配。

為了讓 FontCreator 修復基本問題,我們在字型概覽面板中選擇所有字形,然後單擊主字型和圖層面板頂部的"修復"工具欄按鈕。

很可能仍然有問題的字形。要修復這些,我們需要手動調整字形輪廓。雙擊字形以在字形面板中開啟它。主字型和圖層面板現在將顯示一些關於相容性問題型別的提示。

主字型和圖層面板

為了進一步協助此過程,我們啟用顯示相容性問題工具欄按鈕,該按鈕也在主字型和圖層面板上可用。這允許我們檢視需要進行哪些更正。最終,所有相容性問題都需要解決,否則您的字型將出現無法正確插值的字形。

命名例項

要充分利用您的可變字型,它還應包含例項。這樣,缺乏變化支援的舊軟體仍然可以使用命名例項。

我們轉到字型屬性面板上的例項選項卡。在這裡,我們更新預設例項(400)的軸位置,並新增幾個字重為 500、600 和 700 的例項。我們還提供唯一的樣式名稱。

雖然可變字型不需要,但我們還提供正確的字重類別和寬度類別值。這些值很重要,以防我們將這些例項匯出為非可變字型。所以我們幾乎免費得到這些 ;-)

軸值

這裡還有一件事要介紹。我們可以為軸上的特定位置(甚至軸的組合)提供名稱。我們只需新增與命名例項中使用的軸位置匹配的軸值。所以我們只需新增 400、500、600 和 700。我們還為常規軸值檢查屬性"可省略軸值名稱",因為它代表正常的字重值。