可變字型是一種可靈活自訂的字型技術。 Adobe Fonts 可變字型面板可讓您調整可變字型的外觀並選擇最適合專案的樣式。 目前支援可變字型的 Creative Cloud 應用程式有 Photoshop、InDesign 和 Illustrator。
什麼是可變字型?
可變字型使用一個檔案來儲存多種字型樣式,這與靜態字型不同,靜態字型的每種可用樣式都使用單獨的檔案。 它們可讓您為字型的每個設計軸指定一個值,使您可以控制字型外觀,而這是靜態字型無法做到的。
傳統的靜態字型需要您新增或安裝您希望在專案中使用的每種樣式。 例如,關於 Acumin Pro,您可以新增 Acumin Pro Regular、Acumin Pro Italic 以及其他任何想要存取的樣式。 Acumin Variable 包含 Acumin 的所有樣式,因此您只需要新增一種字型。
可變字型的每個設定稱為一個執行個體。 執行個體是為快速存取而建立的預設集樣式。 上圖所示的可變字型面板顯示 Acumin Variable 已設定為預設執行個體,所有可變字型在自訂之前都會回復為預定設定。
面板下方是軸控制項。 軸 代表樣式變化的連續範圍。一個可變字型可以包含多個軸。您可以將軸自訂為其最小或最大範圍內的任何數字。在 Acumin Variable 的範例中,軸是傾斜、筆畫寬度和寬度。
如何在 Adobe Fonts 網站上使用可變字型
Adobe Fonts 網站中可變字型的每個系列詳細資料頁面都包含一個互動式文字工具和面板,可讓您將字型自訂為想要的樣式。 您可以選擇一個預設集執行個體來快速操作或建立自己的執行個體。
在網頁專案新增可變字型
若要在網頁專案中儲存可變字型,請選取系列頁面中可變字型面板上方的新增至網頁專案。 確保選取正確的字型;一些可變字型在其系列中有其他字型。
選取在面板底部的複製 CSS 獲取與您建立的自訂執行個體對應的代碼。 如果沒有自訂設定,代碼將反映預設執行個體。
您可以在自訂可變字型後將瀏覽器 URL 加入書籤,以便稍後重新存取您前一次的自訂設定,或者選取複製 URL 共享或儲存您的設定。
使用中的可變字型
可變字型的可自訂性使它們非常適合各種應用,從數位圖形到產品包裝甚至車輛貼膜。 透過調整寬度,可以排列字型,使其在不規則表面上仍然清楚易讀。
創意可變字型設定可以展現品牌個性或適用於通常不適合下三分之一圖形的長標題。
傾斜、筆畫寬度和寬度軸用來調整 Obviously Variable 以符合車門板要求。 Acumin Variable 用於較長的下三分之一標題。
您可以使用可變字型在廣告招牌和海報上建立視覺層次,或者在包裝設計中配合微小空間和奇怪形狀自訂可變字型。
可變字型透過在段落對齊中建立更好的換行而大放異彩。 特別是寬度軸,可以實現更有效、視覺滿意度更高的單字間距。
可變字型功能使它們在回應式網頁設計中有很好的視覺展示效果。 一種可變字型能適應從小螢幕到大螢幕的尺寸調整,有助於保持較小的檔案大小並減少載入時間。
可以將程式碼片段加入到您的 CSS,使可變字型變成動畫,以回應聲音、環境光或電腦系統主題的變化。 可變字型軸也使得可變字型更容易動畫化。
字型設計師繼續探索新方法,與這種字型技術互動並持續創新。