在設計過程中,有哪些不容忽視的交互設計要點?

5 評論 10956 瀏覽 50 收藏 19 分鐘

本文總結了一些在交互設計中重要的理論要點,并針對各理論要點展開描述相應的設計策略。主要涉及視覺感知、認知摩擦、認知負荷和情境認知四個方面。enjoy~

一、交互設計中的視覺感知

1. 視覺感知的過程

視覺是人類認識自然、了解客觀世界的重要手段,同時也是理解人類認知功能的突破口。當人們開始觀察外界物體時,視覺系統將剌激以圖像的方式傳遞到大腦,并通過大腦的視覺皮層區域控制人眼的運動來表達對圖像的興趣,這一過程被稱為視覺感知過程。,用戶會經歷了6 個心理過程:

  1. 視覺尋找是指在視線所及的范圍內搜索目標。
  2. 尋找指的是當發現視覺探測到的對象與預期目標吻合時,排除其他對象的干擾,固定跟蹤對象。
  3. 分辨是指對多個相似的對象的信息進行深入探測。
  4. 識別是指根據視覺特征信息和細節信息的差異,識別目標的含義。
  5. 確定是指鎖定的對象與記憶中的存儲信息相吻合,確認目標。
  6. 記憶搜索是以上視覺過程的基礎,以上視覺所獲得的信息都要與記憶信息對比,從而做出判斷。

2. 人機交互界面的視覺感知

人機交互界面中用戶的視覺感知過程遵循著視覺感知過程的規律,即眼睛運動獲取界面信息粗略特征圖,并將其傳遞至大腦,根據注意力的需要,大腦加強與目標相關的信息并抑制不太相關的信息,指引眼睛關注目標的潛在區域,并進一步構建詳細的特征圖,通過對界面信息連續的選擇與過濾,用戶最后鎖定目標獲取所需信息。

如何通過界面元素間的位置關系引起用戶注意,從而快速有效地感知并獲取目標信息是界面設計的重要方面。

從設計角度來說,應當使設計內容容易被發現、容易被識別。人機交互界面的空間呈現盡管有限,但也會包含復雜的視覺信息: 亮度要素、圖形要素、色彩要素、布局因素、信息量的擁擠程度等,現重點討論亮度感知、色彩感知和空間感知對人機交互界面的影響:

(1)亮度感知

人機交互界面中各種信息的呈現,首先依靠的是顯示屏的亮度,因此亮度是界面元素的重要屬性之一。

用戶是從界面的明暗變化中識別出有關目標的信息,即只有從整體目標的亮度感知中才能識別出有意義的實體。

研究表明:色彩組合與亮度對比具有顯著的交互作用。

在較高的亮度對比條件下,用戶更傾向于選擇不同的顏色組合,而在較低的亮度對比條件下,亮度對比要比色彩組合對視覺感知具有更重要的作用。

網易新聞的夜間模式很好的利用了亮度感知

(2)色彩感知

在視覺感知的諸多影響因素中,色彩的作用非常突出。色彩具有3 個基本屬性:色相、明度、飽和度。

在用戶界面的設計中使用色彩要謹慎,設計應該首先考慮單色,在白色背景下的黑色圖案或者在黑色背景下的白色圖案通常適用于大多數的用戶

合理的顏色搭配不僅能夠提高界面信息的認知效果,還能夠豐富界面的層次。

設計通過使用合理的顏色搭配提高了信息的認知

(3)空間感知

空間感知又稱為深度感知。在人機交互界面中我們希望能產生盡可能多的深度信息,因為在人機交互界面中圖像是眼睛和大腦的注意焦點。如果破壞了深度信息,也就喪失了真實感。

在界面的設計過程中,亮度是一個決定視覺感知效果的因素,因此對象的明暗變化成為判斷對象遠近的依據。

此外,利用光與影的變化、內容的重疊與干涉以及細節與空中透視產生的立體效果。如通過對圖案增加陰影、透視等效果,使圖標在視覺上有一定的立體感、三維感的2.5 D的圖標,并逐漸開發出真正立體的三維圖標等。

圖中material design的圓形圖標,寫實的背包圖標都很好的應用了空間感知

二、交互設計中的認知摩擦

1. 認知摩擦理論

認知摩擦這一概念首先是由美國的交互設計師Alan Cooper 提出的,其定義為:

當人類智力遭遇隨問題變化而變化的復雜信息系統規則時遇到的阻力。

認知摩擦闡述的是因認知的差異性導致基于產品開發的界面變得復雜,用戶難以通過界面表象理解程序員的意圖,執行任務過程存在困難如標簽或導航的認知不清晰、操作反饋得不明確或不及時,得不到預期效果等問題。

相對于物理世界中的摩擦現象,認知摩擦則是因為信息化程度的不斷加深,由信息膨脹導致人機交互界面設計不良的一種現象。

在《交互設計精髓》一書中,提出設計者最重要的目標之一,就是要使表現模型和用戶的心理模型盡可能地接近

認知摩擦除了直接導致產品的易用性降低之外,情感流失也是認知摩擦的一個重要方面。

人機交互系統中大量的信息需要集中在有限的界面中,當無法保證用戶如何從眾多的信息中識別出對自己有用的內容時,用戶也很難從界面中尋得情感上的共鳴。

界面應該具有自己內部的和諧,這是最基本的要求。

一個由粗俗的顏色、不精致的線條以及不優雅的字體排布形成的丑陋界面可能會與漂亮的界面具有一樣的精確度,但是卻不太可能激發用戶使用的信心與情感互動。

滴滴現在的界面與1.0版本的界面相比較,更能激發用戶的情感,降低用戶的認知負荷

2. 認知摩擦的特性

(1)不可消除性:人機交互界面的開發者與最終面向者都是人,而不同的人的生活經歷、受到的教育、文化的影響會培養出不同的思維認知方式。因此,只要有人的活動參與,認知摩擦就不可避免。

(2)兩面性:認知摩擦通常起有害作用,但有時又是不可缺少的,在網絡游戲、虛擬學習中用戶的使用興趣、學習斗志都需要依靠認知摩擦引導人對界面的積極探索,但是當超過一定的闊值時,認知摩擦就會轉變為認知沖突,起到抑制作用,增加負面情緒。

網絡游戲中需要依靠認知摩擦來激發用戶對游戲的探索

3. 降低認知摩擦的設計方法

(1)將信息有效的組織從而控制認知差異。

右面的設計方案有效的對信息進行了組織

(2)將界面設計過程與用戶反饋緊密地結合起來,以反饋結果來改進給用戶帶來認知阻力的設計要素,提高認知流暢度。

例如,及時的進行產品的可用性測試;為初版的產品設計用戶反饋機制等。

三、交互設計中的認知負荷

1. 認知負荷的概念

認知負荷的理論是在20世紀70年代由澳大利亞的心理學家]ohn Sweller提出的,他認為感覺輸入和短時記憶的容量都是有限的,并且如果個體直接或間接接收到的信息量多于容量值時,勢必會給個體的認知系統帶來負荷,即形成認知負荷。

在人機交互界面中可以認為,認知負荷是用戶為了順利完成某項工作任務,實際投入到注意和工作記憶中去的認知資源的總量占個體固有認知資源的比例。

人的認知資源(主要表現為工作記憶容量)是有限的,任何學習和任務完成的活動都需要耗費認知資源,從而造成認知負荷。

認知負荷分為外在認知負荷和內在認知負荷:

(1)外在認知負荷:主要與人機交互界面信息的組織呈現方式有關,用于外在認知負荷的認知資源可能會超過用戶的工作記憶容量,從而阻礙用戶使用產品。

例如用戶從界面大量的信息中搜索目標時,無關信息往往成為干擾項,增加外在認知負荷。

復雜的交互界面增加了用戶的外在認知負荷

(2)內在認知負荷:內在認知負荷,主要由在信息讀取過程中需要被同時識別的元素數量決定,元素數量與內在認知負荷成正比。

內在認知負荷的高低主要是由產品的復雜性與用戶知識之間的關系決定。因此,內在認知負荷不僅受到信息內容的影響,還受到用戶特征的影響。

任何年齡段的用戶都能順利的使用微信,微信是一個內在認知負荷很低的產品

2. 控制認知負荷的設計策略

(1)控制外在認知負荷

a、在界面元素的組織上,要遵循一定的視覺搜索原則,要符合人的視覺搜索規律,使用戶以最短的視覺搜索線路找到所需信息,并建立信息之間的聯系,進而整合信息,減少用戶的分散注意力,從而降低用戶的認知負荷。

這是本人設計的開戶的交互流程,頂部的分步指引可以建立流程的聯系,減少用戶的注意力分散

b、在界面元素的呈現方式上,根據信息的特性和用戶的任務需要選擇適合的方式呈現,例如利用色彩塊來表達區域和等級信息,增加復雜內容的幫助提示信息等。

這是本人設計的上傳作品的表單內容,將晦澀難懂的屬性值加上一些說明提示可以有效的降低用戶的認知負荷

(2)控制內在認知負荷

a、采用圖形化、模塊化的構建產品規則,可以提高用戶自身的認知能力,控制內在認知負荷。

b、減少各個元素之間的交互動作,可以降低圖形化結構之間的復雜度,從而有效降低內在認知負荷。

c、采用簡單的信息組織結構,減少各信息架構之間的交叉點和分支,也可以起到降低內在認知負荷的效果。

四、交互設計中的情境認知

1. 情境認知概述

情境認知是對周圍發生的事情感知和了解的意識,是對事件和行為產生影響的目標宗旨。

擁有完整、準確和及時的情境認知對于人機交互界面系統的用戶來說每分鐘都是必要的。

情境認知主要包括四個階段:

  1. 情境認知第一階段(感知階段)影響用戶感知的直接因素: 視覺感知、對象識別、知識認知、環境感知。
  2. 情境認知第二階段(理解階段)影響用戶理解的直接因素:記憶、圖示和認知偏差。
  3. 情境認知第三階段(預測階段)影響用戶預測的直接因素: 推理、記憶和認知偏差。
  4. 情境認知的第四階段(用戶內在因素)間接因素主要包括: 決策、內在能力、經驗、情緒。

2、改善用戶情境認知情況的設計策略

顯示交互界面構成要素的合理性和科學性,是利用外部手段改善情境認知情況的關鍵因素。

為了能切實改善用戶情境認知情況,首先要求對顯示界面構成進行分解,通過各種設計手段使其與情境認知要素進行匹配,使界面能夠提供最優的可視化信息,提高用戶對信息的識別、認知和處理效率。

在各階段的建議設計策略如下:

(1)感知階段:從人機交互界面構成要素入手,以適合讀取、便于記憶的方式進行設計。

  • 減少無效信息顯示
  • 確保信息的清晰易讀,對重要信息有一定的提示
  • 提供與情境任務相關的重要信息顯示

例如京東的企業注冊,信息清晰易讀、獲取焦點時有規則提示、頂部有任務進度相關的提示

(2)理解階段:要求人機交互界面提供與任務情境相符合的認知模式,幫助用戶正確理解當前情境。

  • 提供與情境相關的信息,支持并引導用戶在各種情境下的正確認知
  • 設計界面的應急機制,能夠警告和提示錯誤
  • 界面邏輯層次簡單,提供快捷便利的操作方式

(3)預測階段:要求人機交互界面提供能對任務情境進行預測的認知信息,幫助用戶正確預測將要發生的情況。

  • 對將要發生的具有確定性的情況向用戶說明
  • 對不確定性的情況盡可能的提供給用戶解決方案

例如本人在項目中針對失敗情境的設計,告知用戶造成失敗的可能原因,并且提供了兩種解決方式,解決方式在原因中也做了說明。

總結

以上就是對于交互設計中視覺感知、認知摩擦、認知負荷和情境認知四個設計理論方面的總結,希望可以給大家帶來一些幫助。

#專欄作家#

流年,人人都是產品經理專欄作家。互聯網產品設計師,4年互聯網產品設計經驗。擅長用戶體驗設計,喜歡鉆研需求功能背后的技術實現方式;在成為綜合型產品設計師的道路上不斷努力前進!

本文原創發布于人人都是產品經理。未經許可,禁止轉載

題圖由作者提供

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 加油

    來自上海 回復
  2. 除了顯擺幾個專業詞匯外,沒看出有什么實質性內容。這也是產品經理寫的東西?!

    回復
    1. 在特定的場景,能適時的拽出幾個專業詞匯,也能讓別人對你刮目相看。本文確實比較簡要,后續我會努力寫出干貨內容,謝謝你的建議!

      來自天津 回復
    2. ??

      來自北京 回復
    3. 加油 真棒

      回復