第七波！快速提升 UI 設計效果的 6 個小技巧

編者按：在進行 UI 設計的時候，很多小技巧能夠恰到好處地提升界面的設計視覺效果、用戶體驗。這篇來自Mark Andrew 的文章梳理了 6 個實用性很強的 UI 效果提升小技巧，是系列文章的七篇，原文最早發布于 marcandrew.me 。

在創建實用、可訪問性良好且視覺效果頗為出彩的 UI 界面的時候，我們大多只需要進行有限度的微調，即可達到頗為不錯的效果。在之前，我已經撰寫了很多實用的 UI & UX 優化小貼士（看完文章在文末獲取），這篇文章繼續增加 6 條實用的建議，一起來看看吧！

1、以結果和目標為導向來撰寫文案

撰寫文案的時候，始終以導向結果和目標的方式來撰寫，在結構上，盡量以指向目標的關鍵詞置于文案靠前的部位，這種方式能夠幫助用戶盡量清晰快速地理解要做什么，減少發生錯誤的可能性。

2、確保投影的光源方向是一致的

雖然投影在 UI 界面當中是相對不那么顯著的元素，但是當投影效果不統一的時候，也容易讓人感到迷惑。在投影的設計上，經常出現的錯誤之一就是不同元素的投影角度、方向、距離不一樣，盡量讓投影的方向角度是一致的，確保整體體驗和視覺邏輯的統一。

3、多用清晰的留白來實現視覺層次結構

清晰的留白是呈現視覺和排版層級的關鍵，將文本按照信息層級的重要程度進行排布之后，根據相關度進行分組，這個時候，留白就顯得非常重要了。組內的文本保持接近，而不同的組之間的的留白要足夠多，確保呼吸感，但是不能距離太遠，否則不容易快速掃視閱讀。

4、為段落選擇合理的寬度

在處理閱讀的可讀性的時候，有很多講究，不僅行高和間距要平衡，也要控制段落的寬度來貼合用戶的閱讀習慣和節奏。

通常在西文為主的排版中，認為每行 45 到 75 個字符是一個特別適合閱讀的寬度，這種限制讓每行不會太長，足以呈現，但是也不會在掃讀過程中迷失。

5、在空狀態頁面中給用戶提示操作

空狀態是很多 UI 界面和流程的基礎組成部分，甚至很多時候就是初始狀態。空狀態是告訴用戶新功能、幫助用戶發現新功能的一個重要的渠道。不要讓用戶在空狀態下真的「空轉」，而是引導用戶去做有意義的事情。

6、根據文本的x高度來設置行高

在西文當中，小寫字母x的高度被稱為「x高度」，x高度決定了通常文本的視覺高度，基于文本的x高度來計算行高和行間距是最合理的基礎。x高度越大的字體，行高需要適當調整得越高。在中文當中通常不存在這樣的情況，不過中文當中，行的寬度會影響到行高，通常每行字數越多，行高需要相應的更高一些，確保可讀性。