網頁設計的認知心理要素范文

本站小編為你精心準備了網頁設計的認知心理要素參考范文，愿這些范文能點燃您思維的火花，激發您的寫作靈感。歡迎深入閱讀并收藏。

摘要：人對事物的認知經由感知、大腦信息加工、記憶信息匹配，再做出行為反饋。網頁作為計算機界面的子類和信息傳遞的載體，在設計上除了要考慮人的視覺特征和行為機能，還要使頁面內容呈現符合人的心理認知。本文將從感受器、信息加工和記憶系統三方面的逐一分析，根據分析結果結合案例總結出的對應的設計方法。

關鍵詞：認知心理;網頁設計;交互設計

如今互聯網產業的飛速發展和顯示設備的流行使人們越來越認識到界面設計的重要性，簡潔清晰的用戶界面不僅給使用者帶來使用效率的提升，也成了各大企業提高產品競爭力和贏得用戶口碑的優勢所在。隨著移動互聯網的發展，原本存在于PC端的網頁有了更豐富的形式，比如基于H5技術的移動端網頁、小程序、hybridApp、以及最新chrome范式的PWA應用等。不斷變化的交互方式難用舊有模式理解，因此提高網頁的可用性和用戶滿意度就需要將設計建立在人的認知規律之上。

1認知心理學的發展

認知心理學是現代心理學研究中最為重要的研究取向，而不僅是單純的心理學分支[2]。從上世紀50年展至今，主要以信息加工理論為依據研究人行為背后的心智處理過程，包括了思維、決定、推理、動機和情感程度的研究。其中符號系統假設解釋了符號和符號組織可以指代某種事物，同時人的情感和情緒個性等因素獨立于人的認知并影響認知，因此諾曼等學者進一步提出考慮人情緒調節的認知模型。可見基于信息加工為核心的研究方法已經成為當代研究人心理活動和社會行為的主流思路[2]。

2界面認知模型分析

2.1用戶的視覺感知分析

大腦對周圍環境的感知八成以上來自視覺。在界面瀏覽過程中，眼睛尋找和分辨頁面內容的方式分為掃視和凝視兩種。通常用戶對一個頁面進行反復掃視和凝視，說明該頁面的信息使用戶感到困惑或者頁面不符合用戶的預期，引起了用戶的誤解。具有明確的信息導航和視覺元素的界面是不會讓用戶產生多次掃視和凝視的。

2.2用戶注意特征分析

知覺是海量的但注意力有限，根據信息通道容量的限制，人不能同時并行處理大量知覺信息，只有專注的那部分信息才會被識別。同時人的注意持續時間也有限度，注意時間越久越容易造成注意力分散。這兩種限制決定了人們對外界的注意具有選擇性。注意的選擇性包括兩個方面：一是目標指向選擇，二是刺激驅動捕獲。目標指向的注意是自上而下的（概念驅動加工），該類型的注意是通過期望、信念等因素觸發需要動機，最終對目標進行注意的過程，這是一種主動的識別模式。因此，當用戶在網頁搜索特定產品時，是一種目的性的搜索過程，明確提供用戶目標路徑并加以勸導能促進交易的達成。另一種被動的注意的方式是通過刺激驅動的，當刺激量達到一定閾值就會被人感知，所以外界輸入的信息越強、越不確定、越難控制則越吸引人的注意。心理學通過對比刺激信號強度證明了一些規律可引起信息量的變化，見表1。

2.3用戶記憶特征分析

人腦對記憶信息加工模型稱作“記憶信息加工三級模型”（圖1），它的加工模式如下：外界刺激被感知后，進入感覺記憶（也叫瞬時記憶），其生命周期大約只有0.2~2秒，而且通常具有鮮明的形象性。感覺記憶被感知才會進入短時記憶，短時記憶通過復述進入長期記憶。短時記憶非常容易受到外界干擾而消失，而且留存的信息元素通常不超過1分鐘。因此要想轉變為長期記憶，需要對短期記憶不斷重復；長時記憶的特性是較為穩定，形成條件是必須經過充分的信息加工，但部分長時記憶如果很少回憶也會漸漸丟失或者很難回憶。

3網頁設計的認知心理要素分析

3.1必要的提示與引導

根據前文介紹的記憶三級模型，由于前兩種記憶都具有低容量和高度不穩定性，因此不要要求用戶記住他當前在哪里以及前面做過什么。如果用戶的視線被打斷，就應該給予必要的提示讓人們專注于當前任務。一個好的范例是從淘寶搜索結果頁進入詳情頁購買，該頁面最可能讓買家作出購買決策的信息是價格，所以標題加粗，價格信息標紅加粗加大。用戶確認后下一步是要做購買決策，所以整個頁面上“立即購買”和“加入購物車”按鈕的色彩是最突出的，同時放在最顯眼的位置上。在網頁表單設計中，同樣也需要引導和提示信息，因為表單本質上是對話，對話需要提出問題和回答問題同時也需提供必要的解釋。例如Radio組件表示三個互斥的選項時，考慮到初級用戶和避免發生歧義的場景，應提供詳情浮層（圖2）。其次表單項的驗證一定要采用異步模式，這樣無論正確與否都能馬上給出結果。不應在最后告訴用戶哪些項目填寫錯誤，這會增加不必要的回視與回憶。

3.2重視可視性

一般意義上的可視性指視覺的通達性，是將產品的功能或重要的操作方式清晰明確地展示在用戶眼前。另一層面，可視性還包括“為用戶提供清楚的操作線索”，目的是使產品符合用戶的思考與行動習慣，避免不必要的操作誤區。[5]

3.2.1視覺的可視性設計由于眼球的中央視覺優秀，其他區域模糊，所以人的視覺采集能力有限。在頁面瀏覽時，目的指向型用戶會首先確認當前位置是否正確，所以導航信息很重要。全局導航欄一般放在頂部或者左側，這主要取決于頁面是否包含二級菜單，因為二級菜單使用標簽卡(Tab欄)而不是MenuList，會讓人產生卡片之間是否互斥的疑慮。其次，合理利用動效和閃爍在網頁中能夠取得良好的效果：當頁面拉取一份較大數據時，應配合進度條或加載動畫告知用戶狀態而不是讓用戶誤認為頁面未響應或操作不成功。

3.2.2聽覺的可視性設計通過聲音實現人機交互是產品設計的常見手段，聲音能配合其他感官進行輔助認知。提示音和錯誤警報能在加深記憶的同時減少認知負荷，甚至能營造帶入感。當然，聲音的使用在網頁設計中要結合場景慎重選擇，過量或不必要的提示會分散用戶注意力降低效率。

3.2.3功能分級的可視性設計[5]復雜功能的頁面使用戶面對的操作可能性包羅萬象。幫助用戶整理頁面邏輯并對內容分級處理可提高頁面的可視性。功能分級包括兩個步驟，一是確定信息層級，將相同功能進行歸類并保留關鍵入口，方便用戶能辨識、選擇、記憶。二是對分組之后的入口進行優先級排序，使功能具備可達性。百度學術將高級搜索隱藏在主要按鈕旁邊，當有需要時通過點擊顯示附加選項，這種足夠簡單和主次分明的設計便于用戶歸納記憶頁面的功能。最后很重要的一點是限制用戶的行為以獲得注意。例如表單中不生效的選項常常置灰；彈窗和遮罩將操作限制在特定區域內等。限制用戶行為的方式贏得注意是一種高風險高收益的方法，使用時要考慮兩方面：一是吸引注意時間不要太長，當用戶感覺不受控制時會放棄繼續使用。二是內容應簡潔易懂，非必要選擇時要預留“逃離”按鈕保證任務流暢進行。

3.3符合用戶習慣

長時記憶的特點是容易產生錯誤、受情緒影響或者經過暗示被篡改。所以保持新頁面與舊有頁面操作習慣相一致有助于用戶減少學習成本。頻繁變動或者要求記憶太多內容會導致界面難以使用，更可能使用戶在記憶和獲取記憶時丟失關鍵特征，增加遺失或錯誤操作的可能性。另一方面用戶通常很懶，這和人的3個大腦有關，研究發現人的舊腦、中腦和新腦分別控制不同行為：舊腦能分辨食物和識別危險；中腦負責情緒控制；新腦負責制定計劃。保持原有思路是無意識的，只需要消耗很少資源進行認知，所以用戶在熟悉的事物面前感到輕松，而調用新腦進行學習則比較困難，這就是為什么人對學習不熟悉的知識有本能的排斥。例如我們日常使用的QWERT鍵盤雖然并不是最科學的鍵盤，但更符合人使用的DSK或MALT鍵盤始終沒有取代前者的地位。這種現象在頁面中也很常見，當用戶習慣了某種頁面布局和模式，之后的變動和改版往往被前一版界面帶著走。這時的優化策略是盡量降低用戶的學習成本。

結語

隨著學科的發展，認知心理學作為先進的學科將越來越加深與電子設備，信息技術，工業設計掛鉤，實體設備和器械的更新迭代要考慮到使用者的各種限制和思考模式，虛擬界面交互方式的變化使用戶難以用舊有的模式來感知和理解，大量信息表達方式和新符號的運用層出不窮，這些變化不斷在挑戰人對新事物的處理能力。而這些原本不存在的問題也為認知心理學提供了更多研究方向。

參考文獻：

[1]戴力農.設計心理學[M].北京：中國林業出版社，2014.3.

[2]胡駿.基于認知心理學的醫療設備界面體驗設計研究[D].浙江大學，2018.

[3]周麗娟.認知心理學在導航設計上的應用[D].北京郵電大學，2011.

[4]柳沙.設計心理學（升級版）[M].上海：上海人民美術出版社，2016.

[5]張麗,呂雪瑤.可視性對產品設計的影響[J].設計，2017.

作者：任宏 賈麗鵬 單位：沈陽航空航天大學