2022-3-7 周周
1.牢記最關鍵的「接近原則」并用好它
在以上的兩個設計范例當中， 一個元素之間的間距太遠，另一個元素之間間距則相對合理。
「接近原則」可能是眾多設計原則當中最容易忽略的一個，但是它可以幫助你為用戶制作出視覺排版邏輯更加清晰、更強大的 UI 界面。
根據人類的認知習慣，將相關的設計元素放在一起，我們會更容易認為它們之間有關聯性。這種距離昭示了元素與元素之間的關系，所以在「接近原則」的加持之下，用戶在使用網站和 APP 時，可以更加輕松地理解和認知。
時常使用，經常使用，習慣使用「接近原則」來審視設計，是確確實實能讓設計更好。
2、始終在視覺上將 UI 元素的功能區分開
在以上的兩個設計示例當中， 一個按鈕和標識看起來過于相似，另一個則更容易區分彼此的功能性。
UI 中的基本元素，視覺特征和實際功能應該是對應的，不能在視覺上混淆才行，這是保持整體用戶體驗的一致可用的重要前提。
以按鈕（Buttons） 和通知（Notifications）為例，在大多數情況下，按鈕在視覺功能上都要更加優先，因此，在外觀的視覺吸引力上應該是最突出對勁兒，同時，應該在外觀輪廓上和約定俗成的造型保持一致，讓它可以和其他組件（例如通知）區分開來，方便用戶識別。
上圖是一組規整和且具有良好泛用性的無襯線字體，內容為「力量強大」。
在APP 和網站當中，可以選用的英文字體要比中文字體多太多。而在泛用性上，非襯線字體又比襯線字體更強一點，它們既可以作為標題又可以用于正文，甚至可以用于輔助性的功能性的元素當中。
相對而言，襯線字體細節更多，但是泛用性相對而言沒有無襯線字體那么強，但是在合適的場合選用漂亮的襯線字體能夠讓文本的可讀性適度提升，并且在閱讀的體驗感上再提升一下，尤其是在展示性大標題和長篇幅的正文當中。
現在你可以在 Fonts.adobe.com 上找到上圖中所推薦的諸多英文字體。
而相對更加復雜的中文字體，在可用的字體類型上則相對較少，一方面是字體本身的研發成本更高，更實際的問題則是中文字庫的文件尺寸更大，不過隨著網絡帶寬的增長，這個問題會在某種程度上有所緩解。
邏輯上和英文字體類似，無襯線字體會比襯線字體的泛用性更強。如果僅僅只是用于標題或者視覺設計，這些免費的字體值得嘗試：
4. 想快速找到對的的字體組合？使用超大字體家族
以上是兩個設計范例，其中一個字體組合看起來不搭，另一個字體組合則顯得好很多。
通常所說的「超大字體家族」（SuperFamily）其實指的是一組被打包到一起可以互相搭配的襯線和非襯線體，它們風格和細節不一樣，但是互相搭配效果是頗為不錯的。如果希望在 UI 當中使用足夠協調漂亮的字體組合，但是又暫時沒有想法，不妨選一款「超大字體家族」入手，直接使用其中的字體來做搭配。
或者你也可以參考這篇文章來來自行搭配：
5、陰影最好還是微妙一點
在上面的設計示例當中， 一個使用了非常重的陰影，另一個則更加微妙。
在二維的 UI 界面當中，陰影是讓元素「凸顯」出來的重要手段，作為一種強調的視覺元素，陰影很容易顯得過于「明顯」。實際上，現實當中的陰影大都是不那么引人矚目的，因此需要避免設計陰影的時候用力過猛。完成陰影的設計之后，最好回看一下，往回拉一下，控制好程度。
6、深色模式下降低文本對比
其實這個點于我個人而言意義更大，因為我的眼睛存在「散光」的問題，這使得強對比度下文本所帶來的「暈影」更加明顯，這種「暈影」的視覺效果其實是普遍存在的，只是不同用戶眼中強弱不同，嚴重的甚至會出現閃爍的效果。
所以，這個時候如果使用白色文本和黑色背景，盡量降低兩者的對比度，避免使用純白的文本和純黑的背景。
盡量不要讓圖標獨立存在于 UI 界面當中，因為單純視覺化的圖標是存在誤讀的問題，帶有標簽文本的圖標通常會好很多，它能幫助用戶更輕松準確地理解信息，理解這些按鈕都代表著什么，無需猜測。
文章來源：優設網：陳子木
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務