在做設(shè)計(jì)的時(shí)候，你是否經(jīng)常會遇到字體在更換頁面后看起來不太合適的情況？雖然在AI中可以輕松調(diào)整字體的大小，但如果要改變字體的粗細(xì)比例，直接手動調(diào)整可能會導(dǎo)致字體失去比例的美感。

為了解決這個問題，自從1991年起，行業(yè)領(lǐng)導(dǎo)者如Adobe就開始著手設(shè)計(jì)可變字體（OpenType variable fonts）。OpenType變體字體建立在20世紀(jì)90年代中期蘋果的TrueType GX變體模型的基礎(chǔ)上。這種字體的最大特點(diǎn)是能夠存儲連續(xù)范圍的設(shè)計(jì)變體于一個字體文件中。整個字體系列可以存儲在同一個文件中，并提供無限數(shù)量的字體樣式供使用。簡而言之，可變字體在設(shè)計(jì)之初對字體的各種參數(shù)進(jìn)行了量化和參數(shù)化設(shè)計(jì)，從而方便適配各種展示和使用場景。此外，它還具有在線平臺的快速響應(yīng)和加載的優(yōu)勢。

可變字體的引入有效解決了之前需要下載各種字體來滿足需求的問題，減少了文件體積和資源數(shù)量，并且提升了版面的表現(xiàn)力。它為設(shè)計(jì)師和開發(fā)人員提供了更大的自由度和靈活性，從而能夠更好地滿足不同設(shè)計(jì)要求和用戶需求。

與此同時(shí)，基于可變字體的連續(xù)平滑可變特性，還催生出了一種新的平面設(shè)計(jì)風(fēng)格——動態(tài)字體設(shè)計(jì)，這也是近年來一個備受關(guān)注的趨勢。以皇藝畢設(shè)網(wǎng)站為例：

雖然我們的作品集是靜態(tài)的，但是在我們的作品中，巧妙地利用可變字體不僅可以提升版面的可讀性和協(xié)調(diào)性，還可以用可變字體來創(chuàng)造出個性、美觀的視覺效果：

??下面進(jìn)入正題，給大家推薦幾個可變字體的網(wǎng)站，親測好用！根據(jù)可變字體的類型，我們分為兩類進(jìn)行介紹：一類是針對比較規(guī)則的長寬高等參數(shù)進(jìn)行變化的可變字體，另一類是更加藝術(shù)效果變化的可變字體。

??Regular Variable Font

01-Cyrillic–Variable Fonts

網(wǎng)站簡潔，提供各種參數(shù)的的設(shè)置和預(yù)覽效果，以及下載。

每個字體都具有可調(diào)節(jié)的參數(shù)，如粗細(xì)、寬度、傾斜度等。通過在網(wǎng)頁上拖動相應(yīng)的滑塊，你可以實(shí)時(shí)調(diào)整字體的參數(shù)，從而觀察字體在不同樣式下的變化。在左下方的標(biāo)簽區(qū)，可以看到字體的介紹，點(diǎn)擊標(biāo)簽還能按照標(biāo)簽快速查詢同類的內(nèi)容。包括支持的語言、開發(fā)者、發(fā)布者等等。

??Regular Variable Font

02-PreussType）

一家專門的字體設(shè)計(jì)網(wǎng)站，已經(jīng)有近30年的歷史。除了傳統(tǒng)的字體設(shè)計(jì)，PreussType網(wǎng)站上還包含了很多多語言字體、歷史字體以及實(shí)驗(yàn)性的展示字體等。

單擊上方的Variable Fonts，可以找到所有提供的可變字體類型，右側(cè)還可以下載該字體的Demo，使用起來非常方便。

??Regular Variable Font

03-Axis-Praxis）

這家網(wǎng)站收錄了大量的專業(yè)字體資源，雖然不提供下載，但是可以將自己的內(nèi)容，復(fù)制粘貼到網(wǎng)站中。每一種字體段會有相應(yīng)的控制欄，有趣的是，還有一些可變的矢量圖形。

最重要的是這個網(wǎng)站支持中文??！?收錄了兩種中文可變字體，在本就稀缺的中文可變字體背景下，可以說是非常難得了。

— — ???? —?—

接下來再為大家安利幾個可以生成可變藝術(shù)字體的網(wǎng)站：

??Variable Artistic Font

01-Phase）

一個可愛的小網(wǎng)站，頁面內(nèi)提供了幾種黑體作為基礎(chǔ)，可以調(diào)整字形和比劃、間距等參數(shù)，網(wǎng)站還提供了一些預(yù)覽工具，包括形成段落后的效果，以及放在圖片上的效果，另外還可以簡單調(diào)整幾種顏色。

太一板一眼了？網(wǎng)站還提供了幾種隨意的方法：

只需要選擇「Voice」之后給予網(wǎng)站權(quán)限就OK：

是不是很cool呢？劃重點(diǎn)，生成的字體是可以下載的！

網(wǎng)站會以完整字體文件的形式提供下載，同學(xué)們可以用自己獨(dú)特的字體寫出完整的內(nèi)容，目前不支持中文。

??需要注意的是：

字體商用需要聯(lián)系作者以及相關(guān)EULA（最終用戶許可協(xié)議）

用于個人項(xiàng)目需注明："Typeface：Phase (Elias Hanzer)"。

??Variable Artistic Font

02-Dinamo Pipeline）

一個獨(dú)立字體廠牌，字體設(shè)計(jì)的完成度很高，整體風(fēng)格也更正式和嚴(yán)肅。這個網(wǎng)站上可以看到10種字體預(yù)覽，主要做產(chǎn)品宣傳用，不提供實(shí)時(shí)定制字體的完整下載，只能下載一個樣品包，里面包含5種字體及其變式的完整字體文件。

● 你可以把自己的文字粘貼進(jìn)去之后選擇字體和參數(shù)

●?右上角預(yù)覽模式，一鍵黑底白字

??Variable Artistic Font

03-PFA）

這個網(wǎng)站上提供了10種完成度很高的藝術(shù)字體，同樣可以在線編輯字號，間距和行距，并且有很大的編輯區(qū)可以粘貼自己的文字進(jìn)來預(yù)覽。

點(diǎn)擊這個隨機(jī)鍵系統(tǒng)會隨機(jī)選擇字體參數(shù)和內(nèi)容，展示一個樣本。沒有靈感嗎？試試隨機(jī)～

這個網(wǎng)站還有個腦洞大開的小彩蛋功能，大家可以去找找看。

更多知識干貨以及其他海外留學(xué)的資訊可以關(guān)注UXD交互工業(yè)產(chǎn)品設(shè)計(jì)分享或者添加小助手，還可獲取講座直播哦~

|福利大放送 | WELFARE?
對于設(shè)計(jì)初學(xué)者，完成從0開始創(chuàng)作幾乎是不可能的，就像學(xué)習(xí)過程中書讀百遍其義自見一樣。有了大量的積累，才能在腦海里建立素材庫，這些素材庫能幫助同學(xué)們完成最初的設(shè)計(jì)想法積累，基于這樣的基礎(chǔ)再進(jìn)行個性化的創(chuàng)作，最終才能做出高質(zhì)量的作品集。全球院校最新作品集免費(fèi)拿！添加小助手即可獲取：

UXD交互工業(yè)產(chǎn)品設(shè)計(jì)學(xué)院是尤克斯國際旗下的一家專注于交互、服務(wù)、工業(yè)、產(chǎn)品設(shè)計(jì)專業(yè)的頂級設(shè)計(jì)學(xué)院。除了一對一設(shè)計(jì)課、基礎(chǔ)技能課程、小組課題、設(shè)計(jì)評圖、聯(lián)合教學(xué)外，我們提供不定主題的公開課和內(nèi)部小組課，教學(xué)計(jì)劃課程由三大部分組成，包括基礎(chǔ)軟件技能教學(xué)、設(shè)計(jì)理論系統(tǒng)講座、申請必備知識解析等。

本文版權(quán)歸UXD尤克斯所有

部分圖片來自于網(wǎng)絡(luò)

如有侵權(quán)請與我們聯(lián)系