小米蘭亭Pro及動態字體系統介紹，視頻來自小米MIUI 11官方發布渠道
2019年9月24日下午，小米公司在北京召開了「小米5G新品發布會」，推出了包括小米9 Pro、小米MIX Alpha在內的一系列新品，全新的MIUI 11系統也在發布會上正式亮相。MIUI 11系統以「聲色雙全、效率革新」為宗旨，圍繞 「設計」、「辦公」、「出行」等多方面進行全面升級。
作為中文系統字體定製的先驅，此次MIUI 11系統不僅帶來了全新的小米蘭亭Pro，還重磅推出了全球首家動態字體系統，希望為用戶提供極致的閱讀體驗。
點擊播放 GIF 4.2M
在MIUI 11系統中，用戶可以通過「設置-顯示-字體大小與粗細」的操作進入字體模塊，拖動相應滑塊即可改變手機界面用字的字體大小和字重粗細。MIUI動態字體支持文字粗細無級調節，每個人都可找到適合自己的字重。
點擊播放 GIF 0.5M
智能加粗還會根據內容層級和重要性予以文字不同程度加粗，使閱讀體驗更為極致。
點擊播放 GIF 1.1M
點擊播放 GIF 4.6M
搭載了動態字體系統的MIUI 11，在交互細節上也做了大量優化和提升。
點擊播放 GIF 4.4M
在系統字體越來越受手機廠商重視的當下，此次小米推出的MIUI 動態字體系統無疑是業界的一次重大突破，也是手機系統搭載可變字體的一次有益嘗試。據了解，MIUI 動態字體系統獲得了2019紅點獎。
*以上視頻及圖片來自小米官方，版權歸原作者所有
關於可變字體，不少設計師朋友都有所耳聞，但在中文領域的實際應用還很有限。MIUI的大膽嘗試，既體現了小米對用戶體驗的高度重視，也是有前瞻性、探索精神的體現。接下來本文將與大家一起詳細探討「可變字體」。
什麼是可變字體？
可變字體（Variable Fonts）技術源於Adobe、Apple、Google、Microsoft四巨頭於2016年發布的OpenType v1.8 字體格式規範。該規範的發布將允許單個字體文件同時支持多個字體形態，它可以將幾個字體緊湊地封裝在單個字體文件中，通過定義字體內的變化來實現單軸或者多軸設計空間。
目前主流的作業系統、瀏覽器、設計軟體大多在不同程度上支持可變字體。設計界最為熟知的圖像編輯軟體，Photoshop CC 2018、Illustrator CC 2018也已支持該技術，設計師可以使用這兩款設計軟體調用預覽使用可變字體。
可變字體的優勢
前所未有的自由度
方正蘭亭黑系列字體是方正公司最豐富的家族字體，支持10個字重，額外提供扁字和長字，換言之，方正蘭亭黑在字重維度提供10種變化，在字寬維度提供2種變化，在字高維度提供2種變化，共計14種變化。設計師在使用蘭亭黑系列字體時，仍然存在現有字重滿足不了排版層級需求的情況，選擇這一檔筆畫太細，下一檔灰度又太重。
方正蘭亭黑家族字體，支持10個字重維度、2個字寬維度、2個字高維度的變化
而可變字體的存在，則能很好地解決這個問題。可變字體包含單軸或者多軸設計空間，通過調整可用軸來控制文本精確的字重、字寬、字高、中宮等，實現字形的平滑連續的細微調整。設計師能夠輕易獲取滿足不同版式設計需求的定製字形。
點擊播放 GIF 4.8M
可變字體的多軸無極變化使得字體具有更自由的變化空間
以方正悠黑三軸可變字體在Illustrator CC 2018 中的操作為例，在字體庫列表中找到方正悠黑可變字體，當我們通過「窗口-文字-字符」的操作打開字符面板時，會發現在字符樣式的右側多了變量字體按鈕，此按鈕下提供了可變字體的變量移動滑塊。其中，方正悠黑可變字體具有字重軸、字寬軸和字高軸三軸的變化，其對應的調節滑塊為Weight、Width、Height。滑動這些調節滑塊，就可以實現單個字體在不同維度上的變化，而這些是普通標準字庫不具備的特殊屬性。
方正悠黑三軸可變字體在設計軟體Illustrator CC 2018中的變量操作界面，用戶點擊變量字體按鈕，可以看到方正悠黑可變字體擁有的字重軸、字寬軸和字高軸三個可變軸，通過調整滑塊來獲取滿足需求的字體樣式
小體積大能量
對於常規標準字庫來講，目前較流行的家族系列字體字重組合方式是Thin、Light、Regular、SemiBold、Bold、Heavy，共6個字重，以6個獨立字庫的形式存在，每個文件按照GB18030-2000標準組織字體，字體文件大小在8MB以上，6個字體文件大小接近50MB。
然而，一款支持字重軸變化的可變字體僅一個字體文件就能夠提供800個字重，符合GB18030-2000編碼標準，文件大小為20MB左右。在更小的空間內實現了更大的變化。
可變字體不僅擁有遠超過常規家族字體的變化空間，其文件大小還遠遠小於家族字體的文件大小
可變字體的應用
Webfont+可變字體
Webfont技術具有諸多優勢：它可以將高質量字體應用在網頁上，提供極致的閱讀體驗；網頁上的文本易於修改、編輯；支持查找、選中、複製等功能，支持工具翻譯；突破字體需轉化為圖片的限制，將文本信息從圖片還原成字體，對搜尋引擎更為友好，能夠提升關鍵字搜索排名等。
《紐約時報》（The New York Times）英文官方網站將多個家族字體以Webfont 的形式嵌入網站，其中New York Times Cheltenham 家族字體主要用於標題內容顯示，New York Times Franklin 家族字體則用於注釋、菜單標籤等位置，在滿足排版面邏輯層級關係的同時，使不同題材文章具有不同的風格和效果
作為英國三大報之一的《衛報》（The Guardian），其網站使用了龐大的家族字體Guardian，這一家族字體是由多款名副其實的定製字體組成，其中正文字體的設計力求在不減少字數的前提下，在每一頁製造更多的空白以帶來更容易舒適的閱讀
如果將Webfont 技術搭載可變字體又將帶來怎樣的驚喜呢？首先，可變字體的無極變化能夠為多層級信息的排版提供不同風格和效果的字體樣式，可變字體將為頁面帶來更為自由的設計空間，讀者同時可以體驗更為流暢的閱讀環境；其次，因為可變字體的文件大小相較於家族字體有明顯的壓縮，更小的字體文件大小意味著更少的伺服器相應次數、更低的帶寬要求，頁面的加載時間將明顯縮短。
點擊播放 GIF 1.2M
Webfont 搭載可變字體的應用演示頁面，當激活web中嵌入的可變字體時，網頁會根據信息層級和排版效果自動調整字體樣式，使其更符合用戶的瀏覽習慣，本頁面由 OLIVER SCHÖNDORFER 開發製作
網頁適配
不同的顯示設備具有不同的橫豎屏比例、屏幕解析度，同時匹配不同的觀看距離。我們無法預測用戶會在多大設備、什麼解析度下打開網頁，頁面適配成為網頁設計師、前端開發工程師亟需解決的問題，因此，能夠自動響應用戶設備環境的響應式網頁設計成為潮流。可變字體的應用，恰好能夠為響應式網頁在字形層面的改變帶來便利，利用視覺縮放增強不同屏幕尺寸下的顯示輸出。
點擊播放 GIF 0.6M
搭載可變字體的響應式網頁設計，隨著文字區域變化，單個字符的字號、字重、字寬以及字符間距均有了相應調整
閱讀模式
隨著對用戶體驗的重視，系統閱讀模式的個性化探索得到越來越多的關注。蘋果公司在macOS Mojave 以及最新的iOS 13系統中引入了深色模式，深色模式使用了一種較深的配色方案，蘋果用戶在系統偏好設置中選擇此模式後，整個系統，包括Mac隨附的應用，以及第三方應用的外觀都將全局性切換為深色背景，幫助用戶在系統上專注開展工作。
點擊播放 GIF 2.4M
macOS Mojave 系統內置了深色模式，用戶可以根據使用習慣進行深淺模式切換
同時，越來越多的行動裝置搭載了光線感應器，來感應外界光線的變化，從而反饋給設備，使其能夠根據光線的明暗自動調整屏幕亮度和對比度，提升用戶的閱讀體驗。
點擊播放 GIF 0.5M
搭載了光線感應器的行動裝置，能根據光線的明暗自動調整屏幕亮度和對比度
如果將可變字體嵌入系統中，則可以在以上兩種情況下做出適當響應，通過字形的細微調整，來提高頁面文本的易讀性。
方正字庫中文可變字體
由於中文字體和西文字體存在巨大差異，中文字庫的字符集較大、字形複雜，實現字體無極可變的難度更高。作為中文字體設計領域的領導者，方正字庫以豐富的字體設計經驗為基礎，通過技術革新手段實現中文可變字體設計的探索。
方正悠黑可變字體
點擊播放 GIF 1.4M
方正悠黑可變字體中每個軸至少需要兩檔字形數據，提供字體設計的不同極端之間的特定變化；同時還允許在每個軸上添加中間檔數據，增加對於整個字形集或單個字形的中間設計的可能性，以便在設計空間變化時對字體適配性變化提供更精細的控制。
點擊播放 GIF 1.9M
點擊播放 GIF 0.3M
方正悠宋可變字體
隨著行動裝置的廣泛使用，方正字庫於2018年初發布了全球第一款屏顯宋體——《方正悠宋》。作為一款運用最新技術手段的數字字體，方正悠宋也是一款具備字體無極變化特性的可變字體。
點擊播放 GIF 1.9M
方正悠宋可變字體支持字重和中宮維度的變化，設計師可以在字體粗細和字面寬度兩個方面對字體進行細微的調整。字重與中宮的無級可變特性令方正悠宋可以滿足不同媒介情景的視覺需求，增加了悠宋的視覺識別與信息層級的可塑性層級。方正字庫在將宋體字變黑體字上的嘗試，也為中文可變字體的變化維度創造出新的可能。
點擊播放 GIF 1.3M
方正悠宋可變字體已在實際字體產品中實現字重維度的變化
點擊播放 GIF 1.2M
點擊播放 GIF 0.9M
方正悠宋的中宮可變，以及由方正悠宋變為方正悠黑的實驗性嘗試，開拓了中文可變字體新的變化維度
結 語
隨著技術的改革創新，字體設計進入了一個可以無限制變化的開放新紀元。可變字體的出現，使得在預定範圍內對字體進行任意放大、縮小、加粗、變細、拉伸或者彎曲等操作成為可能，設計師可以將一款字體調整成自己想要的比例、尺寸。
字體形態改變是細微的，而這種細微的變化往往能在潛移默化中體現出非同一般的品質。通過可變字體技術與不同場景的結合，能夠將無極變化的可能性發揮到極致，幫助用戶選擇最符合需求的字體組合方式，從而創造出完美的用戶體驗。最終，無論是用戶、設計師還是字體廠商，都將從這項技術的廣泛應用中受益。
本文轉自方正字庫
文章撰寫丨湯婷技術指導丨陳懇
圖片設計丨湯婷、一鳴、小美
-