]]>
設計：The Woork Co
界面缺乏美感，其實都是我們的細節(jié)沒有處理好。很多優(yōu)秀的設計作品，都是細節(jié)處理很到位。今天就和大家分享一些小技巧，來提高設計美感。
使用投影
有時候我們在做設計時候，很容易忽略投影這個小細節(jié)。投影處理得當可以提升細節(jié)美感，處理投影時候需要注意的兩點：
1.使用品牌色
用按鈕來舉例，可以看出左側投影輕量且?guī)в邪粹o顏色，看著舒服；右側是黑色投影，顯得有些臟，細節(jié)反而沒了。
2.注意透明度
有時候我們投影是加進去了，設計感也有了一些，但透明度屬性可千萬別馬虎，如上面右側按鈕，就是投影過重了，很多新人容易犯的錯。
下面來看下其他案例，運用在卡片或者關鍵的功能模塊。
運用在卡片上面，增加層次感，豐富設計細節(jié)
只關鍵功能上面使用，如選中狀態(tài)
備注：使用投影時候，切勿滿篇幅使用，可以在關鍵地方加上投影，給整個界面布起到畫龍點睛作用。
圖文疊加
可以使用文字作為背景來增強畫面形式感和視覺沖擊力。
很多時候我們構圖，直接將元素圖片放中心設計，然后就完事了，其實仔細思考，還可以去豐富下細節(jié)。
在人物背景后面添加與圖相關的主體文字，作為背景修飾?？聪掳咐?/p>
巧妙將數(shù)字與前景圖進行排版，畫面有了縱深感
商品圖和LOGO組合排版
平面海報圖文疊加設計手法，也是屢見不鮮
融入圓形
圓形在設計中出現(xiàn)頻次很高，原因其親和力給人主觀感受上要強于其他圖形，因此可以借用圓形去設計。
如果單純的將頁面排版在畫面中，會顯得呆板，很常規(guī)。
如圖，加上圓形背景，畫面瞬間就活起來了，細節(jié)層次豐富，下面看看實際案例。
圓形和人物組合排版，這里圓形品牌圖形
圓形作為修飾背景，強調(diào)主體人物
粗細有節(jié)奏
粗細對比雖然很常聽說，但是很少有人注意到它在界面中使用細節(jié)，粗細文字排版增強對比的作用，提升品質(zhì)感。
通常大部分伙伴第一次估計就想到上面這種設計，這樣比較粗暴一些，比較常規(guī)。
如果將兩個文字粗細調(diào)整下，再添加文字背景，設計感就上來了，下面看看案例。
粗細對比增加細節(jié)感
這張海報同樣的在設計中使用粗細對比
寫在最后
今天分析四個小技巧提升設計美感，在日常工作中需要多加以運用，才可孰能生巧，隨機應變各種設計。
當然上面的方法并不是單一使用的，大家可以組合使用，會得到意想不到的視覺效果。
原文地址：功夫UX（公眾號）
作者：功夫UX
本文的寫作目的主要有兩點，其一，探究在設計中，影響Web和App界面可讀性和易讀性的因素有哪些；其二，提出相應的解決辦法，即如何提升界面設計的可讀性。
再動人心魄的故事，如果無法以清晰易懂的方式講給讀者，讀者永遠也不可能被你的故事吸引。同樣地，對設計師而言，無論你的設計多么用心，如果可讀性無法保障，用戶也絕對不會有非常愉快的用戶體驗。今天我們就來專門說說這個事兒-——如何提升界面設計的可讀性。
要完完全全弄懂這個問題，以下這些問題都是必要的：
- 可讀性和易讀性究竟是什么？
- 為什么要重視設計中的可讀性和易讀性問題？
- 影響Web和App界面可讀性和易讀性的因素有哪些？
- 如何提升界面設計的可讀性？
倘若看到此文的你，還在糾結是不是要花費大量時間弄懂設計的可讀性問題，那么我可以肯定的告訴你：這是必須的。原因很簡單，如果用戶連你頁面上的內(nèi)容都看不清楚，他們還愿意欣賞你的設計么？還會認真了解你的產(chǎn)品么？答案顯而易見，用戶絕對不會。
那么不廢話了，正式開始吧~
第一部分 什么是可讀性和易讀性？（這里主要針對數(shù)字內(nèi)容）
可讀性和易讀性這兩個概念非常相似，以至于很多設計師把他們混作一談，但這兩者本質(zhì)上是不盡相同的。用戶在閱讀某一內(nèi)容時，會產(chǎn)生不同的感知，根據(jù)感知結果的不同，可以細分成可讀性和易讀性——
可讀性：內(nèi)容的可讀性強調(diào)的是用戶理解某一內(nèi)容的難易程度。
可以這么說，可讀性關注的問題更加深入，它涉及到了用戶對文本內(nèi)容的理解問題，而不是僅僅停留在用戶查看內(nèi)容和識別內(nèi)容的層面上?；诖?，要解決內(nèi)容的可讀性問題，就要思考更多，諸如，語言是否簡單易懂？思維是否清晰？信息是否有用？結構是否合理？
易讀性：內(nèi)容的易讀性強調(diào)的是用戶如何查看內(nèi)容以及如何區(qū)分內(nèi)容。
從這個角度來看，設計師需要解決的問題有兩點：第一，確保用戶可以順利查看內(nèi)容；第二，確保用戶可以區(qū)分內(nèi)容并準確識別內(nèi)容，比如識別字符、單詞、句子，以及數(shù)字等等?；诖?，我們可以這么認為，易讀性主要解決內(nèi)容視覺呈現(xiàn)的相關問題，使內(nèi)容變得容易“讀”，并讓用戶快速了解頁面上的信息。
在當今的設計師眼中，這兩個術語的定義又略有變化，設計師們普遍認為，可讀性的定義更加廣義，在思考可讀性問題的時候，他們也更傾向于將視覺呈現(xiàn)和內(nèi)容本身相結合。他們甚至認為，可讀性問題就是用戶如何區(qū)分文本的不同元素的問題，而易讀性則強調(diào)如何區(qū)分特定文本中的某些特定字符和符號的問題。
但其實無論你如何理解這些術語，歸根結底始終是一個事兒：用戶如何輕松查看并快速閱讀你的內(nèi)容。
第二部分 影響Web和App界面設計中可讀性和易讀性的因素有哪些？
很多因素都會影響內(nèi)容的可讀性和易讀性，這里主要集中和設計過程直接相關的要點來探討。
背景色
和書本、報紙等紙質(zhì)媒介一樣，在數(shù)字界面中，背景色對閱讀體驗、區(qū)分交互元素以及識別內(nèi)容有著至關重要的作用。我們都知道，在不同的背景下看同一個物體，會有不同的視覺體驗。類似地，相同的文字內(nèi)容，在白色或淺色背景上顯示為黑色時，字體看起來會比在深色背景上的顯示為白色時大很多。
之所以有這種差異，原因在于配色。錯誤的配色方案極可能會帶來糟糕的可讀性，進而導致失敗的用戶體驗，致使用戶無法快速瀏覽數(shù)據(jù)、文字，或者其他任何內(nèi)容。一旦內(nèi)容本身不可讀了，即使數(shù)據(jù)之間具備相關性，用戶也會產(chǎn)生緊張情緒，不僅無法理解內(nèi)容，甚至還會錯過一些重要信息。
如果設計師有研究過不同背景色，并且理解了不同的背景色會帶來不同的閱讀感知，并搭配了合適的字體，那么理論上講，則任何配色方案都可以保障足夠的可讀性，就看具體怎么設計了。此外，不同類型的頁面也要有不同的解決方案：如果是文字很多的頁面，則傾向于使用淺色背景，并可以采用多種配色方案；如果頁面上圖片很多，則常常采用深色背景，這樣可以突出圖片，帶來更為震撼的視覺效果。
Travel Planner app使用了淺色背景確保每個頁面都是可讀的
這是一個關于飲茶的網(wǎng)站，專門留出了白色背景的一塊，展示文案
這是一個書店網(wǎng)站，深色背景，使用了特定的字體和字體大小，形成對比，確保可讀性
排版
排版是什么？排版就是文本內(nèi)容的外觀。說到排版，字體就不得不提，它不僅會直接影響用戶閱讀的速度和體驗，還會影響到識別的速度。此外，字體的大小，字體的寬度，字體的顏色以及文本結構，每個點都特別重要。字體作為頁面的必備元素，和圖片一樣，會影響整體的視覺樣式。設計師在排版時，要做到美觀和功能的統(tǒng)一其實遠比想象中艱難。
要做好排版，這些問題都要注意：
- 留白（負空間）：元素之間的空白區(qū)域
- 對齊：放置并對齊文本
- 字間距：字和字之間的間距
- 字母間隙：兩個字母之間的間距
- 行距：文本線之間的間距
- 行長：一行文字的長度
設計師會根據(jù)以上要點來設計文本，最大程度做到設計上賞心悅目，而且體驗上易于閱讀。任何細節(jié)，比如字間距太小，行間距太窄，字體太小或者文字顏色無法和背景形成對比——所有這些問題都會使內(nèi)容變得難以閱讀，讓用戶產(chǎn)生不適感，但又說不清楚問題究竟是什么。此外，如果有多行文字，把每行的字數(shù)控制在合適的長度可以讓閱讀更順利。
Nature Encyclopedia App：使用可讀性較好的無襯線字體，讓文本易于閱讀。此外，對于有更多文字的慈善頁面，背景色用了更淺的顏色。這種對比既提高了可讀性，又和封面作了區(qū)分。
視覺層次
視覺層次結構是一種內(nèi)容組織的方法，可以明確內(nèi)容優(yōu)先級。它基于格式塔理論，涉及到了很多元素視覺感知的心理學，并闡述了用戶為何喜歡統(tǒng)一的視覺元素。視覺層次幫助設計師合理組織和布局UI元素，以便用戶可以根據(jù)對象的物理差異（例如大小，顏色，對比度，樣式等）來區(qū)分信息。
對于用戶而言，打開一個網(wǎng)頁后，他們更加傾向于瀏覽內(nèi)容，而不是逐字逐句地閱讀?；叵胍幌拢斘覀兇蜷_一篇博客，我們最先看的一定是文章題目，其實是副標題，最后才是正文部分。那既然如此，是不是說正文的重要性沒有那么突出了？當然不是！
用戶的心理其實是這樣的：先看看大標題和副標題，快速確認這個內(nèi)容是不是他們想要的。如果標題的層次結構和正文的排版可以很好的讓用戶get到這個內(nèi)容就是他們想看的，那么他們則會真正去閱讀。反之，如果用戶首先看大的是冗長的文字，心理上就會立即產(chǎn)生負擔，他們不知道閱讀文章需要多長時間，也會懷疑這個內(nèi)容是否值得投入時間和精力去閱讀。
視頻播放器
可持續(xù)能源生產(chǎn)創(chuàng)新服務的主頁分部分列出了內(nèi)容，并按清晰的元素層次進行組織。
因此，對于文本內(nèi)容，采用逐漸呈現(xiàn)信息的方法顯得至關重要。對于文本部分，這里涵蓋了可以囊括到視覺層次中的全部元素，包括標題、副標題、正文、CTA按鈕，標題等等，可以按照以下視覺層次結構劃分：
- 第一級：比如頭條新聞中的大標題，它旨在提供核心信息，讓用戶立即判斷這內(nèi)容是不是他們想看的。
- 第二級：比如文章的二級標題，可以讓用戶快速了解一篇文章的結構。
- 第三級：比如正文和其他數(shù)據(jù)，和核心信息相關但不是最主要的信息。
負空間
負空間（或稱空白）就是頁面中的空白區(qū)域。留白會出現(xiàn)的地方，不僅僅是某一元素的周圍，也會是某些元素之間甚至是元素內(nèi)部。留白就像是頁面上的一個氣口，是空的，純粹的，可呼吸的。在講排版時，我們已經(jīng)提到過了留白的作用，不僅僅是對于頁面排版，留白對界面布局中文字和非文字元素之間的連接也很重要。比如，在瀏覽一張圖片很多的頁面時，留白的大小和數(shù)量可以幫助你確認文字和圖片的比例是否合理，關系是否連貫。
使用留白增強Web界面內(nèi)容感知
文案
這里還是有必要說一下文案本身，界面中出現(xiàn)的文本內(nèi)容要保證至少以下4個基本功能：
- 清晰：用戶理解你在說什么，核心信息清晰易懂
- 簡潔：每段文字都是有意義的，直奔主題的，沒有大量修飾，沒有空話、套話
- 有用：內(nèi)容為用戶提供了必要的信息，或者幫助用戶更好地使用產(chǎn)品
- 一致：內(nèi)容表述的語氣一致、手法一致
對于App、網(wǎng)站和博客的內(nèi)容打造，其實只需記住一點，你的用戶都是人，因此打造一種與人交流的氛圍就是制勝點。無論是網(wǎng)頁，還是著陸頁，還是郵件，把編排文案想象成你是在和一個人對話，使用簡單易懂的語言，不要過度夸張的描述，這只會讓用戶感到疑惑不解。
第三部分 如何提升設計的可讀性？
1. 文案需要精簡和一致
有一個技巧，提前確定一些主要術語和某種操作的命名，然后在任何同場景下都使用這一種表述。例如，如果把刪除這個動作命名為“Delete”，那么所有需要刪除的地方全部都命名成“Delete”，不要再用其他比如“Remove”之類的任何表述了。再比如，如果想要告知用戶此時需付款，可以直接用“Pay”這個詞，這個詞會比“Make a payment”看上去更加簡潔。此外，用“Pay”一個字時，還可以加大字號，讓這個CTA更加醒目。
數(shù)字產(chǎn)品中的這種文案用法和文章以及書中是不一樣的，我們在寫東西的時候，傾向于使用更復雜但更高級的短語來表達同一個意思，這樣文字看起來會更加生動有趣，也更具文學性。但對于數(shù)字產(chǎn)品而言，用戶主要是使用它們來解決問題的，因此如果使用文學手法，反而會破壞用戶體驗。
2. 自定義選項
個性化用戶界面可以更加準確地把控用戶偏好，比如說，讓用戶去自定義背景顏色和文字大小。自定義功能對增加內(nèi)容可讀性具有重大影響，因為凡事都是因人而異，你很難去了解并照顧到每一個用戶，但是用戶自己知道自己喜歡什么，所以給他們選擇的機會就好了。
Upper App的UI設計案例研究：允許用戶選擇最喜歡的主題顏色
3. 分屏顯示
分屏顯示不同的內(nèi)容現(xiàn)在已經(jīng)非常流行了，基本的原理就是采用深色背景和淺色背景兩種方案來展示不同的內(nèi)容。通常使用淺色背景來展示文本居多的頁面或者核心數(shù)據(jù)塊，深色則展示圖片或少文字的內(nèi)容，這不僅確保了可讀性，還形成了頁面對比，一舉兩得。
澆水追蹤器應用程序設計
4. 一個段落一個重點
前面已經(jīng)說過了，現(xiàn)在用戶的閱讀習慣就是瀏覽內(nèi)容。因此，為了方便用戶可以快速瀏覽重要信息，切勿使用大篇幅段落。
建議使用小段落，比如3到5行字就是一段，這樣用戶不僅可以瀏覽，還可以快速過濾掉自己不感興趣的內(nèi)容。更重要的是，用戶不會錯過自己真正需要的內(nèi)容，因為每個段落都有專門的主題和重點。
5. 使用數(shù)字
Nielsen Norman曾在博客中分享過一個有趣的現(xiàn)實：根據(jù)用戶在掃描網(wǎng)頁時進行的眼動跟蹤研究，人的視線在遇到數(shù)字時通常會停滯不前，并駐足觀察，即使這些數(shù)字夾雜在大片文字中間。
人在潛意識中會將數(shù)字與某種事實、統(tǒng)計數(shù)據(jù)、物體大小以及空間距離等信息關聯(lián)起來，而這類信息通常也就是他們想要的內(nèi)容。因此，寫文案時直接使用阿拉伯數(shù)字是一個不可忽視的小技巧。
環(huán)保社區(qū)網(wǎng)站設計：使用數(shù)字作為設計布局的一部分，這種方式可以引起用戶的關注
6. 列表
使用帶有數(shù)字或項目符號的列表可以增加內(nèi)容可讀性，原因很簡單，列表可以清晰地羅列信息，組織結構，因此很是吸引用戶注意力。
7. 突出重點信息
使用加粗、斜體、文字顏色等手法來突出顯示某些內(nèi)容，這已經(jīng)是非常廣泛的做法，卻始終受用。當你的文本內(nèi)容中有某一點需要讀者特別注意，就可以突出顯示。此外，錨文本也要突出顯示，告知用戶這個內(nèi)容是可以點擊的。常見的做法有加下劃線、設置文字顏色或者加粗。
8. 對比
對比可以直接區(qū)分文本元素，并幫助讀者快速瀏覽。但要把握好度，對比度太低會導致文本元素混在一起，難以辨認；對比度太高會導致視覺疲勞。要合理地運用對比，前提是要掌握色彩理論知識，其次，在不同的界面上做嘗試，不斷測試，直到找到最佳方案。
9. 使用常規(guī)字體
選擇字體時，設計師們總想嘗試一些原創(chuàng)又精美的字體。這個想法是對的，好看確實很重要，但是保證可讀性更加重要！但這兩者的關系倒不是魚與熊掌那樣不可兼得，如果既想使用一些特別的字體，又要保證可讀性，排版就顯得愈發(fā)重要了。
一般來講，Sans-serif字體更易讀，而襯線字體看起來會更優(yōu)雅。對于一些標語而言，即使使用相對復雜的字體也不會破壞可讀性，因為標語的內(nèi)容是極簡短的；但如果是一段話，使用非常規(guī)字體就可能是另一番體驗了。
此外，配色的選擇也是一個重要影響因素。例如，深色背景上的文字就需要更多的留白，因為深色會吸光，而淺色背景則沒有這個問題存在。
招聘藝術家網(wǎng)站設計插圖：此登錄頁面的標題使用了襯線字體Domaine，它在視覺上和插畫相得映彰；正文段落則使用了高度可讀的無襯線字體
10. 留白
如果元素之間沒有足夠的留白空間，可讀性會變差。盡管許多用戶無法明確意識到這個問題，但無合理留白的設計確實會對用戶的眼睛和大腦造成壓力。留白和音樂中的停頓有異曲同工之處，給出空間，給出緩沖和思考的時間，從而讓內(nèi)容更加易讀。
11. 分段
最常用的內(nèi)容分段辦法就是使用副標題、水平分割線或者或垂直分割線。分段可以幫助用戶輕松地將不同的元素分開，并在統(tǒng)一的布局中了解它們的相互聯(lián)系。第10點中提到的留白也可以用于分段，此外，還可以使用圖片做隔斷。
使用圖片來進行內(nèi)容分段乍看似乎不合邏輯，但是圖片確實有助于使內(nèi)容更清晰可讀。在文章中插入圖片，圖片就成了一種更加好看的分割線，既可以說明上下文內(nèi)容，又可以分隔文本的不同部分，承上啟下。
此外，插入圖片還可以讓用戶有短暫的放松感，尤其是在閱讀長文的時候，圖片可以很好的緩解用戶內(nèi)心焦慮。當然，你還可以使用各種插圖、照片甚至3D圖形，相比起文字內(nèi)容，它們都更具吸引力，并且識別速度更快。
總之，插入圖片是一種非常棒的辦法，它還可以根據(jù)上下文語義刺激用戶點擊。現(xiàn)在很多的網(wǎng)站設計，都會使用相關性的大圖搭配文本內(nèi)容，相互補充，相互成就，營造出一種大氣蓬勃的設計感。
12. 合理利用大寫
對于英語國家的人而言，使用大寫來標記文本層次結構依舊是一個重要手段，這也是為什么關于使用句首字母大寫還是詞首字母大寫的話題已經(jīng)被討論了無數(shù)次的原因。
關于大寫的用法，要注意以下幾點：
- 詞首字母大寫：標簽、CTA，菜單以及頁面標題
- 句首字母大寫：較長的文本，例如頁面或字段描述以及工具提示
- 全部字母大寫：但僅適用于非常重要的內(nèi)容，比如簡短的標語，品牌名稱，網(wǎng)站的核心導航點，簡短的CTA按鈕文字以及OK的縮寫等等。
但無論你怎么選擇，都要記住一點：保持統(tǒng)一。如果按鈕使用了全部字母大寫，那么每個頁面的按鈕都要這么做了。
Health Blog的設計：CTA和頂部導航用了全部字母大寫；大標題用了詞首字母大寫；正文用了句首字母大寫
第四部分 總結
關于提升設計可讀性的內(nèi)容，今天就暫時討論到這里。其實上面的每個點都可以再展開具體分析，但限于篇幅，就暫時不深入了。所以如果你有其他想法，歡迎來交流。最后，希望本文對你有做幫助。
原文地址：mockplus
作者：Marina Yalanska
譯者：Trista
]]>
]]>
網(wǎng)易考拉品牌升級明確規(guī)定中英文字體運用
▲字體在設計中重要程度越來越高，文字不僅是閱讀形式一種，不同的字體不僅能影響排版，同時也能反應出產(chǎn)品的性格！越來越多的品牌把字體設計融于品牌DNA中，在網(wǎng)易考拉改版設計中，針對中英文字體和整體品牌的融合 。
▲韓國知名電商11街的視覺升級中，對于中英文字體，有著明確的規(guī)范。
▲UBER的設計規(guī)范中，同樣也對字體有著明確的要求，英文字體，印刷字體，以及詳細使用規(guī)則。
越來越多的公司慢慢對字體在設計中運用進行規(guī)范，今天我們一起來聊聊界面設計中如何去定義我們的字體，以及UI中字體一些運用規(guī)則。
字體的情感
▲字體是影響品牌的很關鍵詞元素，如果了解色彩心理學的同學，應該知道不同的顏色其實有對應的色彩情感，那么同樣的不同字形，筆畫等等都也是有品牌情感的。
▲比如我們常用的西文常見字體之一，Helvetica作為一種無襯線字體，整體字體筆畫安全，專業(yè)，嚴謹廣泛適用于各種場合，尤其受品牌商標的偏愛, 包括3M，寶馬，雀巢, 曾經(jīng)的蘋果等等。另外，該字體很受政府青睞，美國稅單上用的字體就是 Helvetica。
圖片來源：https://www.behance.net/gallery/41054815/Typography-Google-Fonts-Combinations-Volume-2
▲Roboto是為Android操作系統(tǒng)設計的一個無襯線字體家族。該字型特點為“現(xiàn)代的、平易近人”也一直是安卓系統(tǒng)默認英文字體。
▲《機械姬》這個電影大家應該很熟悉，作者使用幾何版型襯線字體，整體呈現(xiàn)科技感。
▲《鋼鐵俠》電影中，整套設計來源Territorystudio團隊設計的虛擬界面。里面一整套虛擬界面，包括圖形，字體等，整體風格高度一致，整體字體呈現(xiàn)未來和科技感。
所以一套字體一定是和整個品牌DNA是相延續(xù)的，它們之前有整體品牌調(diào)性，而不是單獨存在，就像我們內(nèi)衣，看不見但是很重要，字體也是如此。
中文字體
iOS和安卓都有官方推薦默認字體，見上圖，但是很多時候我們的品牌，整體設計語言都有自己獨特個性化，所以有時候也需要去重新制定一套新的字體，那么對于這些字體，我們要如何去選擇呢？
在選擇字體時候，一定要根據(jù)整體品牌調(diào)性去選擇最合適的字體，下面是一些界面中常用的中文字體，而且版權也比較容易買到。
▲華文黑體視覺感受：字形方正，筆畫較粗，整體給人易識別，可讀性高。
▲思源黑體視覺感受：由adobe和Google 聯(lián)合推出的開源字體。字體家族龐大，涵蓋了中日韓用字。由日本設計師主導，與小冢黑體風格上一脈相承，字體堅固穩(wěn)定，字符空間均勻，整體給人專業(yè)，硬朗感受。
▲微軟黑體視覺感受：是方正第一代屏顯字體，也開創(chuàng)了中文屏顯字體設計先河，字形略呈扁方而飽滿，筆畫簡潔而舒展，易于閱讀，視覺感受清新和優(yōu)美。
▲冬青黑體視覺感受：字的結構是日本的印刷字設計與中國用字習慣有諸多不一致的地方，盡管冬青黑體簡體針對中國大陸而設計，卻保留了原設計的風格，這反倒讓字體顯得別具風味，有個性，錘子系統(tǒng)貌似運用的此款字體。
▲黑體-簡視覺感受：黑體字是現(xiàn)代漢字體系中最重要的字體之一，特點：非常突出，方正、粗獷、樸素、簡潔、無裝飾、橫豎筆形粗細視覺相等、筆形方頭方尾、黑白均勻，因此非常醒目，運用廣泛。
▲蘋方-簡視覺感受：蘋方是蘋果新一代主題字，整體字體特點：專業(yè)，便捷，排版嚴謹，比較容易識別，是蘋果官方中文字體，也是大多數(shù)app首選字體。
▲方正蘭亭黑感受：方正蘭亭黑系列是微軟雅黑的延續(xù)設計，字面略為縮小，字重梯度多，獲得了更廣泛的適用性，其中用在品牌營銷中很多，它的特點：靈活多變，個性化營銷字體，排版嚴謹，識別性高，比如天貓?zhí)詫毢芏酄I銷banner規(guī)范都是運用的蘭亭黑。
關于字重
字重：字體中很重要一個概念，不同字重傳遞出來視覺感受完全不一樣。
輕字重：傳遞出輕盈，放松視覺感受，常配合粗的字重使用，在一些引導頁面，閱讀頁面，說明文案時候使用。
重字重：視覺感受莊重，嚴謹，很重要，常用在重點強調(diào)的文字，數(shù)字，引導行動操作點上，或者頁面中大的標題，banner主標題等等。
英文字體
英文字體相對中文來說，字體包更小，所以選擇性更大一些，今天主要推薦一些谷歌免費開源字體，谷歌字體真的非常棒，搭配好了，能帶來很多不一樣視覺效果！
1.Playfair Display
受很多設計師喜歡的襯線字體，整體搭配出來雜志感，大牌特別強，在很多高品質(zhì)的產(chǎn)品頁面，或者H5頁面中有應用到。
界面來源于網(wǎng)絡
▲這個字體是我喜歡字體排前10，常常和一些非襯線字體搭配起來，用作大標題或者主題非常優(yōu)雅和藝術雜志美感！字體非常優(yōu)雅和經(jīng)典。
界面來源于網(wǎng)絡
▲在UI設計中也是廣受熱愛，在一些PC頁面，或者閱讀類產(chǎn)品中，配合優(yōu)美的排版，整體非?，F(xiàn)代。
2.Nunito Sans
英文界面常用的字體，國外設計師用的比較多，字形很現(xiàn)代，干凈，字母之間添加一些字間距，看起來更加干凈。
界面來源于網(wǎng)絡
▲Nunito Sans無論在平面設計中，或者UI設計中都非常干凈，現(xiàn)代，有利于閱讀，所以另外在做設計時候非常喜歡用，有個小竅門，在做英文時候，字母之間加一個字間距，可以讓設計看起來更舒服。
3. Montserrat
這種字體很獨特，不像nunito sans那樣干凈。但每個字母上的一個小裝飾，使得UI看起來非常有吸引力。
界面來源于網(wǎng)絡
▲可以看出Montserrat字體深受一些大廠喜愛，無論是大小寫組合，還是正文閱讀，都很獨特。
在UI界面中也是如此，讓整體設計更加獨一無二，充滿著細節(jié)。
4.Roboto
谷歌產(chǎn)品界面默認字體，PC和無線上默認字體，可見在谷歌的重視程度，如果你做一個英文頁面，不知道選什么字體，那么選擇這個是最安全的。
界面來源于網(wǎng)絡
▲這個字體通用性很強，字重也很豐富，無論是粗體還是細體，用在各類產(chǎn)品網(wǎng)站和移動界面中非常簡潔優(yōu)雅。
5.Open Sans
Open Sans是一種無襯線字體，移動設計中也是運用比較多的一個字體，比較現(xiàn)代和簡潔視覺感受。
▲運用在網(wǎng)站中很干凈，幾乎沒有多余的筆畫正式，字重對比強烈！
▲它配合這其他字體運用，都很OK，幾乎百搭，在國外很多經(jīng)典的官方網(wǎng)站都有運用到。
6.PT Sans
1998年發(fā)布，基于俄羅斯的無襯線字體,一般常用于雜志，美食產(chǎn)品。
▲PTSans在美食頁面中的運用，和食物本身也融合的很好。
▲PTSans在雜志排版中運用也同樣很和諧。
7.Futura PT
Futura PT是一種無襯線字體，也是深受設計師喜歡的一款字體，整體視覺感受現(xiàn)代時尚，我們一起來看看它是視覺魅力。
▲作為大標題的運用，簡單清晰干凈。
▲作為設計公司網(wǎng)站的運用，配上網(wǎng)格的布局，非常的時尚。
▲寶馬御用字體之一，用在寶馬官方APP和網(wǎng)站上，可見尊貴感。
▲時尚雜志的官網(wǎng)運用，干凈簡潔。
英文系列字體還有很多，后續(xù)有機會再和大家推薦，今天推薦的這些英文字體在界面中完全可以用到，并且很容易下載，都在 fonts.google.com 網(wǎng)站中。
最后
正如前面開頭所說，字體是設計中體現(xiàn)品牌很重要一點，字體選擇非常重要，字體也是設計中最大量的內(nèi)容，所以我們一定要掌握起來，下一篇我將會圍繞數(shù)字字體運用分享給大家，下周見！
原文地址：我們的設計日記（公眾號）
作者：sky
