曾經我學習UI設計時，網上資料很多，但是參差不齊，對於新人而言，這是很痛苦的，進步慢。因此我想通過之前踩過壹些坑，集合自己的工作經驗，把壹些知識點分享出來。
分享的最終目的是沈澱自己，同時也希望能給有想要提升排版能力的設計師帶來壹些幫助與啟發！所以本系列文章並不壹定適合所有人。
那麽本周就先從排版篇幅開啟……
排版是界面設計中最難的部分，也是非常重要的壹部分，它以各種形式存在界面中，純文本排版，圖形文排版，圖片文本排版等等，這是我們在做設計時候，經常會面臨的問題。好的排版能有效地向用戶傳遞關鍵的信息，同時也能提升產品使用體驗。
在我們日常生活中，離不開設計排版，包括經常見到的各種廣告與電影宣傳海報，如果不能讓用戶在短時間內記住關鍵信息，這個設計就是失敗的。因此我希望通過今天這篇文章，能夠讓妳對排版有壹些新的認識。
在界面設計中，影響排版設計的因素有很多，我總結歸納了7個維度（當然還有其他更細的，在這裏就先暫時不講），它直接影響整個排版質量，這些方法當然不是絕對，但是如果能巧妙綜合得運用到界面中，能保證大部分界面設計感得以提升，當然也是需要不斷刻意練習來提高的。
分別是：
下面我會集合壹些案例來和大家講解下
空間即我們常說的留白，當設計元素緊緊地聚集在壹起時，界面看起來沒有重點，因此需要和諧的運用它，空間的運用規則直接影響產品的性格，小空間和大空間在視覺感受上，兩者完全不同，那麽我們在界面設計中如何去更好的運用空間來設計排版。
有壹個很好的方法就是可以運用網格去搭建空間，在平面設計中，運用得非常多，那麽在用戶界面中，同樣也可以運用網格去搭建，下面看壹個案例：
如上圖作者把壹個界面分為4Gird，通過搭建好的網格來進行界面中元素排版，右側是我拆解的圖（備註：網格的搭建並沒有任何強制性的規定需要搭建多少列，最終的搭建列數需要根據這個產品內容復雜程度去定義的），比如：我最近在做車載HMI設計語言，同樣也運用了網格，那麽我會根據整個車載HMI產品復雜程度去搭建，同時也運用了幾種網格配合使用。
上面兩個例子我們可以發現 設計師運用了大空間來設計界面，這使得整個界面呼吸感更強，更透氣，因為也是 娛樂 類偏雜文產品，所以設計會偏藝術化壹些。
韓國29cm產品是我比較喜歡的壹個app，整體設計呼吸感很強，留白空間大，視覺焦點清晰。
我們都知道大的物體更吸引眼球，更容易引起我們的註意，那麽在設計中，我們壹般都會將重要元素放大，突出顯示。
a和b那個更吸引妳？
答案是a. 因為a類型排版看起來很大，更具有吸引力。
上面案例中算是大小方法上運用比較好的，我們可以看出視覺層次非常清晰了。首先我能快速知道哪些重要信息，肯定是封面圖，接著左上角logo,然後就是導航和標題了，最後就是針對每個內容塊的壹些詳細文案解釋。
簡單示例，重要的信息壹定要大，次級信息弱化。
顏色在排版設計中起著很大的作用，能起到點睛之筆，又或者為畫面帶來活力，又或者代表著品牌，當然我們在UI界面中字體顏色壹定要慎用，因為不同顏色含義是不同的。合理恰當運用顏色， 能夠瞬間提升設計品質感。
上面這個web設計中，設計師通過紅色來強調重要信息，同時也讓灰白的畫面有了些許不同之處。
對某些文本使用輔助顏色，例如鏈接文本，圖1 使用方式正確。圖2將顏色大量使用在正文，嚴重影響視覺體驗。
避免像圖2那樣使用對比度低的顏色。
對齊是界面設計中我們經常提到話題，也是提升界面品質感最重要的壹個隱形的力量，也許有時候我們會忽略他，有時候會不經意間就沒做好。
對齊的界面比不對齊的要整齊很多，視覺流也符合用戶閱讀習慣。
我們可以借用前面所學的網格來對齊，這樣不僅設計有節奏感， 同時畫面很整齊美觀。
我們界面設計中可以有三種思路對齊方式，當然根據業務板塊去選擇合適的對齊方式，三種對齊方式都有壹個隱形的軸（看我標的線），然後圍繞這個去排版設計，自然形成壹個規則的視覺流。
上面案例中作者整體偏左對齊，這樣形成以左為中心壹個軸展開視覺流走向。
我們在做界面設計時候，會經常遇到有人說妳的設計，要麽是這邊太重了，要麽就是太輕了，或者這邊要不加點東西進去，不然太空了，為什麽？
這就是平衡定律，如果同壹個環境下的物體沒有保持平衡關系，我們視覺感受上是很不舒服的。
下面我們看幾個例子：
圖1和圖2 我們可以看出，圖2 給人第壹感受就是不平衡的，整體視覺重心偏左。
上圖案例，設計師通過按鈕來平衡整個畫面視覺重心，因為左側內容多，如果按鈕很弱或者很小，是很難平衡畫面的，因此我們做界面時候，定義壹些按鈕大小也是非常考究的。
左邊視覺界面，右邊拆解原型出來，我們可以看到設計師也是通過元素合理分布使得界面整體平衡。
字體選擇對界面排版非常至關重要，這也是所有界面排版中必要的壹步，不同字體有不同的性格屬性，我們需要根據產品來選擇恰當的中英文字體。同時，也需要記住，壹個產品APP界面設計中，字體最好不要超過兩種
推薦壹些我認為2019比較好用的英文字體，大家做概念設計時候或者提案方案包裝時候是可以用到的哦（吐血推薦）。
分別是：Montserrat 和 Nexa 字體。
分別是：Futura 和 Playfair_Display 字體
中文好用的字體，大家應該都知道，平方字體，思源黑體，漢儀旗黑，蘭亭纖黑，我就不做示例了。
終於到最後壹趴了，最後這點是整個設計排版的核心之壹，為什麽？
如果不清晰設計目標，那麽整個排版風格也許最後產出和妳用戶群體或者產品性格是兩種類型的，不同產品風格會有不同的排版style。
比如：我們產品是奢侈品，那麽整體排版設計風格壹定是使用大網格，大空間去設計，字體纖細等。如果是簡約現代呢？又或者母嬰產品， 科技 產品， 娛樂 產品等等，每個會有壹些特殊排版思路。所以了解妳的設計目標，並確定設計原則。
有了這些原則與目標，那麽接下來就是開始找參考，找靈感找到對應產品他們是如何排版，如何控制畫面節奏感的，推薦多去使用pinterest或者behance
通過七大點排版思路，可以更好的運用在界面設計中，每個排版原則並不是獨立的個體，他們之間是相輔相成的關系，比如大小離不開網格，也離不開對比，顏色等等，缺乏某些元素，那麽界面就會缺失靈魂，設計產出質量並不好！
好了本期到這裏結束，下期會繼續和大家分享如何巧妙運用圖形提高界面品質感和增強細節！
題圖來自 Unsplash ，基於 CC0 協議