設計心理學和真棒用戶體驗的神經科學

收聽本文的音頻版本

關於為什麼特定的設計會吸引你的眼球並讓你血液循環，這是一門科學。

人類的大腦是懶惰的、有偏見的，並且容易走捷徑。

對人類認知的用戶體驗研究可能是糊狀的、不科學的，並且充滿了錯誤的假設——也許這是懶惰的大腦的錯。

認知是複雜的，許多因素會影響直覺反應或即時印象。 當你問別人：“你為什麼這樣做？” 他們很有可能無法回答，或者您會誤解他們的回答。

進入神經科學。

雖然觀察和訪談等研究方法通常需要用戶體驗研究人員和參與者進行猜測，但眼動追踪等現代技術允許研究人員研究幾乎難以察覺的反應和偏好。

對於具有大量流量的產品，按鈕寬度或文本顏色對比度等看似微小的細節可以產生數百萬美元的差異。 這就是為什麼像 Facebook 和谷歌這樣的科技巨頭開始採用基於神經科學的技術來研究人們如何使用他們的產品。

讓我們從對反應性“快速思考”的介紹開始，並為設計師提供一些技巧，以幫助利用神經科學的力量來創造出色的用戶體驗。

設計心理學：快思考，慢思考

驅動人類行為的大部分因素都是潛意識的，這已不是什麼秘密。 在一個人遇到一個新的應用程序或網站後的幾毫秒內，數以百萬計的神經元被激發，大腦做出數百個潛意識決定。

我在“正確”的地方嗎？ 我應該相信這個網站嗎？

YouTube UX 研究員 Javier Bargas-Avila 在 2012 年的一項研究中確定，人們在網頁曝光後的前 17 到 50 毫秒內會形成審美反應。

從這個角度來看，眼睛眨眼需要 300-400 毫秒。 您的產品可能會在眨眼之間收到審判、判決和判決。

這些印象可能不會記錄，但它們確實會影響行為。 例如，如果一個站點加載緩慢並且大腦將第一個加載的項目讀取為“離題”，那麼用戶可能會立即離開而不是等待站點加載。

像 Facebook 這樣的公司投入大量資源來研究元素的加載順序。 如果有人登錄 Facebook 後沒有看到任何通知徽章，他們可能會立即離開。 如果徽章先加載，它們可能會在內容繁重的新聞提要加載時等待。

諾貝爾獎獲得者丹尼爾·卡尼曼 (Daniel Kahneman) 的著作《思考、快與慢》將人類思維和決策分為兩個系統，以幫助說明差異。

系統 1：快速、自動、頻繁、情緒化、刻板、潛意識。

系統 1 思維是反應性的——負責複雜但本能的認知，例如確定物體之間的距離或確定情緒反應。 您的懶惰大腦通常默認為系統 1 思維。

系統 2：緩慢、費力、邏輯、計算、有意識、不頻繁。

系統 2 思維是分析性的，適用於更複雜的場景，例如確定適當的社會行為或比較具有不同價格和特徵的兩種產品。

由於大腦在每次面對新場景時都不想重新處理信息或做出新的決定，因此人類的大部分決策都屬於系統 1，即“快速思考”。

當快速做出決定時，大腦會過度依賴圖式或心智模型——熟悉的信息和交互模式。 當系統 1 思考時，系統 2 永遠不會生效。 人們可能不知道他們大腦的決策速記，但它強烈影響他們的行為和對產品的感知。

設計心理學

人腦消耗了人體高達 25% 的氧氣，儘管僅佔其質量的 2%。 作為一種生存機制，大腦是懶惰的——模式識別和捷徑意味著更少的精力花在有意識地處理這種情況上。 大腦識別事物，標記它們，然後忽略它們，直到它們再次相關。

大腦對模式的偏好和懶惰的決策可能會讓生存變得更容易，但也會讓用戶體驗設計變得更加困難。 你如何研究你的研究對象甚至無法感知的東西？

最近，一些神經科學技術進入了用戶體驗研究，幫助研究人員闡明了激發“快速思考”的事物。

注意力和感知可以通過眼動追踪相機進行研究。 情緒反應和喚醒可以通過皮膚傳感器或面部分析來確定。 可以用腦電圖測量大腦中的電反應。

對於設計師來說，在眨眼之間捕捉某人的興趣並傳達重要信息可能聽起來像是一項不可能完成的任務。 幸運的是，就像神經科學可以幫助我們診斷問題一樣，它也可以揭示一般的解決方案和最佳實踐。

以下是設計師在設計數字產品時可以藉鑑的神經科學用戶體驗研究的一些一般經驗。

設計心理學提示＃1：使其易於識別

每個人到達網站或應用程序時都對它應該是什麼樣子有一些期望。 接近這種期望有助於設計師從即時的潛意識決策中受益。

打開您的應用程序或網站的人想知道 a) 這是否有我正在尋找的東西； b) 這是高質量的嗎？ 保持設計簡單並保持品牌、服務和產品的前沿和中心有助於人們定位自己。

將一些信息放在首位和中心意味著防止其他信息擠占它。 整理設計與重新排列組件一樣重要。

您會注意到科技公司之間正在向更簡單、不那麼擁擠的界面發展。 這些極簡設計在任務完成方面優於更複雜的設計，並且顯示視覺清晰度會影響在線和離線的購買決策。

科學證明，視覺上簡單乾淨的設計效果更好。 懶惰的大腦可以立即掌握網站的目的並了解要採取的行動。

設計心理學提示 #2：指出即將發生的事情

為某些即將到來的信息或交互做好準備或準備可以提高用戶理解新信息和對新信息作出反應的能力。 您可以讓某人期待諸如 UI 元素、某些交互或流程中的時間安排之類的事情。

例如，Yelp 使用一個額外的屏幕來提醒用戶他們將離開 Yelp 訪問第三方網站。 額外的上下文有助於向用戶發出信號，讓他們期待新的設計和信息架構。

啟動是一把雙刃劍。 您無意傳達的信息仍然會影響決策。 例如，如果您的攝影公司只提供嬰兒照片，那麼人們可能會錯誤地認為您只為嬰兒客戶提供服務。

設計心理學提示 #3：為懶惰的讀者整理

眼動追踪研究能夠在人們與產品交互時跟踪他們的注視。 他們可以生成熱圖，顯示專注於屏幕某一部分的時間長度，或顯示眼睛如何在頁面上跳躍的地圖。

我們知道，跨行業和應用程序類型，大腦通常以 F 模式（或 E 模式）掃描信息。 該人查看頂部的信息，向右閱讀，然後向下掃描頁面以查找相關信息或圖標。

打破 F 模式——例如，將重要信息放在右下角——將使其更難找到。

馴服你的文字

根據 Nielsen Norman 對 45,237 次頁面瀏覽量的研究，人們只閱讀了頁面上大約 20% 的文本。 更糟糕的是，在內容更多的網站上，人們每增加 100 字的文字，只需要多花大約 4 秒的時間。

在人們不逐字閱讀的世界中，Nielsen Norman 採用以下可掃描文本指南。

• 突出顯示的關鍵字
• 有意義的副標題
• 項目符號列表
• 每段一個想法
• 倒金字塔式——從結論開始
• 傳統寫作的一半字數（或更少）

使用顏色流行和對比度

文本組織和位置並不是設計中唯一的重要因素。 顏色理論、權重和對比度可用於引導用戶注意。

NASA 的駕駛艙設計團隊使用亮度（或設計的感知亮度）來幫助管理飛行員在信息競爭激烈的區域的注意力。 駕駛艙設計團隊使用顏色和對比來突出最重要的元素。

亮度和對比度可以在您的產品中使用以突出或淡化特定信息，但它最常在按鈕或號召性用語設計中引用。 正如您在下面的紅色示例按鈕中看到的那樣，雖然左上角的按鈕飽和度最高，但它“感覺”最亮，因為對比度最高。

對比度和亮度只是第一步。 色彩理論建議通過 60% 的時間使用主色、30% 的次要色和 10% 的重點色來平衡產品的顏色。 這種細分與吸引眼球的神經科學是一致的。 因為強調色用得最少，所以最能吸引眼球。

正如使用明亮的顏色可以吸引眼球一樣，使用更柔和的顏色可以幫助用戶確定哪些信息是次要的或次要的。 例如，大多數網站使用更中性顏色的頁腳區域來顯示與頁面上其餘信息的分離。

任何功能或信息設計者取消優先級有助於用戶直接關注最重要的交互或信息。

設計心理學技巧#4：直覺檢查

幸運的是，您不需要數千美元的眼動追踪軟件或腦電圖來判斷設計是否有效。

5 秒測試是確定您的設計是否可以立即理解的強大工具。

在 5 秒的測試中，參與者查看網站或應用程序 5 秒，然後回答有關主題和設計的問題。 由於無法重新參考圖像，參與者給出了他們的“印象”——參與者假設產品的目的和功能，以及他們將做什麼或他們將在哪裡尋找下一步。

你的產品可能擁有用戶想要的所有功能，但如果懶惰、喜歡模式的大腦無法立即掌握這些功能，它就會繼續前進。

設計師是“讀心者”

隨著我們更多地了解設計心理學、大腦和感知，整個行業的設計規範將繼續發生變化。 連接線是數據——隨著神經科學和認知研究方法的改進，可用於 UX 設計的數據類型和質量也會有所提高。

出色的用戶體驗設計不是魔術，而是科學。 神經科學。

本文是與用戶體驗研究員Caitria O'Neill合作撰寫的，他曾在 Facebook 工作，目前在 Airbnb 工作，也是斯坦福大學d.school的研究員。

• • •

進一步閱讀 Toptal 設計博客：

• 電子商務用戶體驗——最佳實踐概述（附信息圖）
• 以人為本的設計在產品設計中的重要性
• 最佳 UX 設計師作品集——鼓舞人心的案例研究和示例
• 移動界面的啟發式原則
• 預期設計：如何創造神奇的用戶體驗