起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識經驗分享丨一文搞定交互設計7大法則（4）——接近原則
接近原則最早來源于心理學研究中得出的格式塔理論，后來被理論家應用于視覺感知領域，成為設計師們非常有價值的工具。本篇文章講解了接近原則在實操中有哪些應用技巧，讓我們一起來看看吧。
今天分享一個被我們廣泛應用但還沒有注意的原則——接近原則。它是一個從用戶認知習慣和心里模型總結出來的設計原則，掌握該原則可以有效的幫我們完成當前的設計。
那么它在實操中有哪些技巧呢？一起來看看吧~
一、接近原則的定義
該原則最早來源于心理學研究中得出的格式塔理論，后來被理論家應用于視覺感知領域，成為設計師們非常有價值的工具。
它解釋了人腦如何解讀周圍復雜元素，提出了眼腦的作用是一個不斷組織、簡化、統一的過程。它產生出易于理解、協調的整體，降低我們瀏覽和理解內容的成本。我們的視覺系統自動對視覺輸入構建結構，并且在腦中對設計元素進行歸類，而不是只看到互不相連的邊、線和空間。
通過該理論，發現用戶會把界面中視覺相似的元素自動歸類分組，視為整體，不管當前頁面有多么復雜，元素之間距離較近的比距離較遠的更具關聯性。在設計中我們設計師需要參考接近原則，了解它們之間的相對距離相較于它們的形狀、色差等其他特征更容易影響用戶的感知。
在實際設計中我們可以通過控制元素之間的距離來區分他們的關聯性，距離近的關聯性強，距離遠的則關聯性較弱，可用于界面不同模塊布局以及分類的場景。
二、接近原則的特點
接近原則是格式塔原則中非常重要的設計理論，它應用于信息秩序的設計與整理，易于理解的信息布局正是我們設計師追求的目標。
1. 獲取效率的便捷化
在產品規劃的過程中有時經常為了省事，盡可能多的在頁面中放入更多的文本以及圖片。我們要清楚用戶的注意力是有限的，過多的內容填充反而會使得用戶在細節中迷失。
接近原則在界面中可以有效的對信息進行歸類分組，避免了信息展示的雜亂無章，讓內容呈現更有目標感，使其潛意識里就知道哪里可以找到自己需要的信息，讓信息提取的效率便捷。
2. 信息層級的清晰化
接近原則不單單讓信息充滿目標感，還讓其充滿了秩序感。我們可以通過不同元素的組合向用戶傳遞信息，這些元素是有關聯的。這些看不見的邊、線和空間是我們利用的工具，通過它們可以實現信息之間的關聯。
三、接近原則的應用
接近原則其實很好理解，我們可以在設計的不同場景中應用它，以下是該原則在設計中的應用場景。
1. 更高的閱讀效率
我們之所以選擇該產品更多的是其內容的吸引，因此它的可讀性與易讀性是產品設計的基本屬性。可讀性與易讀性的影響因素有很多，包括了字體樣式、字體大小、字重、字間距等，但是頁面中內容的版式也會直接影響信息的閱讀效率。
當信息沒有任何版式，只是純粹的在頁面內平鋪，它的易讀性與可讀性會收到影響。我們可以通過分隔線、間距來調整它們之間的關聯度。通過這種有條理的間距，凸顯了在空間內不同的段落關系，幫助用戶掃描和閱讀文本。
上圖為接近原則的示例，段落之間的距離大于行與行之間的距離，讓相關的內容在視覺上形成緊密的段落，確保用戶可以在視覺上對其進行掃描和閱讀。
2. 更便捷的表單填寫
表單是一個常見的信息錄入工具，糟糕的表單設計會帶來令人抓狂的用戶體驗。作為產品體驗的重要組成部分，無論是Web端還是移動端，信息的輕松錄入都是表單設計的重要目標。接近原則在表單填寫中主要應用于標簽位置、表單分組以及數字展示這3塊。
（1）標簽位置
標簽位置對于用戶快速理解輸入項含義特別重要。在英文場景下，由于其詞組較長，可將標簽放于輸入框頂部并保持左對齊，以便讓用戶輕松的掃描表單，這對于有著長標簽的輸入框尤為重要，特別是當標簽與輸入框之間的距離較遠且關系不明確時，用戶需要花較多的時間來弄清楚不同的標簽與輸入框之間的對應聯系。
（2）表單分組
常規的表單一般包含多個錄入字段，我們需要采用接近原則改變用戶對表單的看法。合理的控制表單內容的相關距離，對它們進行分組，可以有效的幫助用戶對所填寫內容的理解。同組內信息的距離與不同組距離之間對比的節奏感，給用戶帶來了體驗上的舒適性。
例如下圖中左右兩側的輸入量基本一致，但是由于右側對需要輸入的信息按照關聯度做了的分組，給用戶的感覺完全不一樣的感覺。（輸入框量越多，分組后產生的差距效果越明顯）從視覺的角度可以讓信息更有層次，避免了表單瀏覽的疲憊。
（3）數字展示
我們可以在較長數據展示的時候采用接近原則，通過對復雜信息的組塊來提升操作效率，這一點跟米勒定律很像。例如常見的銀行卡號以及金融數字的展示，我們可以采用4個或者3個數字一組的形式，控制不同數字之間的距離，在空間上進行分組，保證數字清晰的可讀性。
3. 負空間的營造
我們在處理頁面內容時，靠得近意味著關聯性強，但當我們對接近原則反向應用，例如通過元素形態、色差等增加與周圍元素負空間的比對可以起到吸引用戶的注意的作用。
當頁面內重要元素周圍負空間較多時，它對用戶的吸引則越大，意味著用戶很容易就會發現它的存在，畢竟該空間內沒有其他信息吸引他們的注意。例如下圖我們一眼就可以看到搜索框，而瀏覽器用戶、圖片、郵件相關信息由于距離其較遠，因此視覺權重較弱反而凸顯了搜索框。
四、寫在最后
將關聯的元素相互靠近，在界面中創建分組是我們經常應用的設計原則，可能在設計中我們已經無意識的使用了好久，但是如果我們可以更進一步了解它則會讓它更加強大。
我們可以利用接近原則來指導如何在頁面中組織信息元素，創建有意義的分組，以便用戶可以清晰的獲取信息，提升產品的用戶體驗。
以上就是我對接近原則的理解，不知道你對它有什么不一樣的看法，歡迎一起討論~
本文由@江鳥的設計生活 原創發布于人人都是產品經理，未經許可，禁止轉載
題圖來自 Unsplash，基于 CC0 協議
該文觀點僅代表作者本人，人人都是產品經理平臺僅提供信息存儲空間服務。
- 目前還沒評論，等你發揮！
