多年來，設計師們一直在嘗試通過減少摩擦以及為用戶創(chuàng)造更多的價值來提高產(chǎn)品效率。雖然很多產(chǎn)品需要傳遞眾多的流程和功能，但是設計師的角色仍然是簡化用戶達成目標的路徑。

設計師們在每一個新的用戶界面上都會尋求形式和內容之間的完美平衡。在用戶眼中，一切都需要簡單化。設計師如何在避免認知負荷的同時降低復雜性呢？

以認知工效學（Cognitive ergonomics）的概念為出發(fā)點，我們可以認為，認知設計旨在讓界面決策以促進瀏覽者理解為存在，減少短期記憶的負載，加速理解所呈現(xiàn)的內容，防止認知負荷。

什么是認知負荷？

說得通俗一點，只要我們的認知負荷大于我們的工作記憶（working memory）所能處理的范圍，我們的大腦就會因為處理能力有限而面臨承受認知負荷的風險。

要想更好地理解認知負荷，可以看看其鼻祖 John Sweller 的著作認知負荷理論。Sweller探討了有助于理解信息的心理路徑。根據(jù)Sweller的觀點，理解在很大程度上受到內容呈現(xiàn)給觀眾的方式的影響。例如，展示一個正方形的圖像比用語言描述更容易被人理解。

在另一項名為「減少多媒體學習中認知負荷的九種方法」的研究中，UCSB的研究人員探討了認知負荷的幾種潛在情況，并提出了一些關于如何減少或防止認知負荷的建議。這些建議中的許多都適用于網(wǎng)頁設計的實踐。

為什么減少認知負荷很重要？

數(shù)字體驗通常始于意圖：我們在Instagram上查看照片、通過Gmail發(fā)送電子郵件或在LinkedIn上閱讀消息。

目標達成越難、體驗越差、認知負荷越大。根據(jù)1993年提出的峰終定律（Peak-End Rule），我們都傾向于根據(jù)最關鍵以及最終時刻來判斷一段體驗。

困惑的感覺會產(chǎn)生焦慮和挫折感，而這些負面的感覺很可能與你的品牌有關。在考慮用戶體驗時，我們必須考慮使用有效的認知設計。

在試圖解決問題之前先了解問題

在嘗試解決一個設計問題之前，縱觀全局很重要。人們有不同的目標和背景，所以他們可能會對同一個挑戰(zhàn)有不同的理解。有些東西可能對你來說很復雜，但對你的用戶來說可能就并非如此了。

花時間研究你的用戶如何與你產(chǎn)品的界面進行交互。在對你的用戶流程進行更改之前，先觀察你的用戶并與之交談，確定可能的認知負荷情況。

做好UI的關鍵點

為了減少認知負荷，我們需要有策略地決定如何以及何時使用以下方式呈現(xiàn)內容：

讓路徑清晰

即使我們很想通過嘗試呈現(xiàn)多種內容選擇的方式讓用戶能夠快速獲取自己感興趣的內容，但我們還是應該盡量簡化用戶達成目標的路徑。將過多的信息集中在同一個地方并不是理想的呈現(xiàn)方式。

成為向導

設計界面就像講故事一樣，用戶體驗中認知負荷高的主要原因之一就是故事講得不好。盡最大努力引導用戶，保持一致的敘事結構，有清晰的開頭、中間和結尾。

采用明確的標準

通過使用模式來減少認知負荷。探索良好的實踐，比如堅持遵循用戶界面設計的10個可用性啟發(fā)法，以及使用設計系統(tǒng)來設計一個成功的用戶界面。

如何防止認知負荷影響用戶體驗？

認知負荷的發(fā)生并非偶然，很多因素都會造成這種情況。請記住以下這些主要的因素：

過度刺激是你的敵人

請記?。含F(xiàn)在是2020年，不是1999年。閃爍的動畫和GIF不再是典型的好設計之選。并且，動畫和微交互的存在應該有明確的目的。任何形式的視覺刺激都應該用于引導體驗而非誤導體驗。

米勒定律（Miller's Law）指出，一般來說，我們的短時記憶中能夠容納七條信息。這并不意味著一個界面只能有七個元素，但它提醒我們要牢記自己的認知局限，以避免認知負荷。

UAT網(wǎng)站頁面上的主要鏈接出現(xiàn)在加速動畫中間，左右浮動，給閱讀和互動帶來困難。圖片來源：https://www.uat.edu/

解決方案

回顧每個刺激背后的意義，并使其與界面的主要目的保持一致。每個顏色、動畫、插圖和微交互都必須有明確的目的。

在這個個人項目中，Joseph Berry用動畫引導觀眾進入奇妙的沉浸式體驗。圖片來源https://the-goonies.webflow.io/

更少的選擇帶來更多的轉化

在決定同時顯示什么內容時，少即是多。過多的內容會使焦點偏離主要目標動作，降低轉化率。?？硕桑℉ick's Law）告訴我們，選擇越多，做決定的時間就會越長。

Arngren網(wǎng)頁上眾多選擇和標準化網(wǎng)格的缺失，阻礙了人們對視覺元素層次的正確認知。圖片來源：http://arngren.net/

解決方案

根據(jù)上下文將你的內容分離成邏輯組。你可以通過分類學研究、動態(tài)卡片排序、以及將內容分成選項卡、區(qū)塊、屏幕或不同的視覺組來探索選項。

Fiverr除了使用視覺提示（如引導導航的項目符號圖標）外，還使用清晰的文字和圖片對內容進行分類。圖片來源：https://www.fiverr.com

自始至終的一致性

保持用戶熟悉的視覺設計、交互和導航。如果搜索欄位于主頁的右上角并帶有一個藍色的圖標，那么沒人希望它跳到下一頁的頁腳。如果你的銷售渠道中的確認按鈕總是綠色的，那就確保它一直保持綠色，即使是在那個被遺忘的聯(lián)系表單的末尾。

不一致的導航會增加認知負荷。圖片來源：https://www.cambridge.org/

解決方案

現(xiàn)在是時候讓你的設計系統(tǒng)大放異彩了。通過原子系統(tǒng)保持從最小到最大組件的一致性，并將其標準擴展到界面的任何操作，包括導航結構和動畫。

當浮動卡片的主CTA因屏幕滾動而被隱藏時會移動到頁頭，從而保持導航的一致性。圖片來源：https://www.airbnb.com/

減少必要的動作

你是否曾發(fā)現(xiàn)自己在填寫注冊表單信息時，不知道為什么需要填寫某項內容？消除任何對完成主要任務不重要的內容。額外的字段、多余的信息、驗證和點擊次數(shù)越少越好。

百思買強迫用戶做出決定。圖片來源：https://www.bestbuy.com/

解決方案

只有在必要時才進行干預。

分析你的內容是否有多余和不必要的步驟。改進默認選項，減少用戶的交互需求。

法律要求啤酒網(wǎng)站必須確認每個訪問者的年齡。圖片來源：https://www.stellaartois.com/

使用熟悉的模式

作為設計師，我們不必總是無謂地重復。經(jīng)過多年與不同界面進行交互，用戶期望看到熟悉的模式。當這種情況沒有發(fā)生時，工作記憶會發(fā)生較大的負荷來處理信息。

即使在今天，MySpace也使用了不同尋常的橫向導航。圖片來源：https://myspace.com/ladygaga/photos

解決方案

在設計已經(jīng)被大家熟知的解決方案時，你不必從頭開始。

請參考與可用性相關的行業(yè)標準，例如人們通常不閱讀網(wǎng)頁上的每個單詞，而是以F-Shaped模式掃描內容。

重復出現(xiàn)的元素，如搜索欄、登錄屏幕和導航菜單都有完善的標準。重復使用而不是重新設計。

Mercado Livre遵循現(xiàn)代電子商務的良好實踐。圖片來源：https://www.mercadolivre.com.br

保持簡潔

為了簡化心理學家Paul Fitts在1954年的研究中提出的建議，按鈕需要大而易懂。讓用戶更容易做出決定是設計師的責任所在。

這里值得一提的是奧卡姆剃刀（Occam’s Razor）。簡單的說，當給你幾個產(chǎn)生同樣結果的選項時，通常最簡單的那個是最好的。

簡潔性與可訪問性必須齊頭并進。

缺乏對比度是認知設計的敵人。圖片來源：https://typesetdesign.com/

解決方案

使用負空間（negative space）等特征簡化信息的呈現(xiàn)，以強調關鍵內容。重新審視和應用格式塔原則 Gestalt，如鄰近性、相似性和連續(xù)性，以優(yōu)化用戶體驗，不產(chǎn)生混淆。

避免歧義，同時保持文字的清晰和客觀，保持組件符合可訪問性原則，并提供必要的幫助量，作為簡潔體驗的核心要素。

Mural利用負空間和高對比度來清晰地提示頁面上最重要的內容。圖片來源：https://www.mural.co/

總結

通過所有關于認知負荷的理論和討論，往往很容易通過產(chǎn)品和業(yè)務指標看出一個UI的表現(xiàn)是好是壞。如果沒有很好的理由，就不要從根本上改變已經(jīng)成為標準的內容。最重要的是，觀察、傾聽，并讓與你的界面進行交互的用戶發(fā)聲。只有這樣，我們才能設計出能夠真正解決用戶問題的有用產(chǎn)品。

英文原文：https://xd.adobe.com/ideas/process/information-architecture/6-ways-to-reduce-cognitive-load-for-a-better-ui/
原文作者：Nick Babich
編譯作者：微博/公眾號@設計吐司

以上譯文僅代表原作者觀點。如需轉載請遵循CC版權協(xié)議正確標明出處。