網(wǎng)頁設(shè)計(jì)的認(rèn)知心理要素范文

本站小編為你精心準(zhǔn)備了網(wǎng)頁設(shè)計(jì)的認(rèn)知心理要素參考范文，愿這些范文能點(diǎn)燃您思維的火花，激發(fā)您的寫作靈感。歡迎深入閱讀并收藏。

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

關(guān)鍵詞：認(rèn)知心理;網(wǎng)頁設(shè)計(jì);交互設(shè)計(jì)

如今互聯(lián)網(wǎng)產(chǎn)業(yè)的飛速發(fā)展和顯示設(shè)備的流行使人們?cè)絹碓秸J(rèn)識(shí)到界面設(shè)計(jì)的重要性，簡(jiǎn)潔清晰的用戶界面不僅給使用者帶來使用效率的提升，也成了各大企業(yè)提高產(chǎn)品競(jìng)爭(zhēng)力和贏得用戶口碑的優(yōu)勢(shì)所在。隨著移動(dòng)互聯(lián)網(wǎng)的發(fā)展，原本存在于PC端的網(wǎng)頁有了更豐富的形式，比如基于H5技術(shù)的移動(dòng)端網(wǎng)頁、小程序、hybridApp、以及最新chrome范式的PWA應(yīng)用等。不斷變化的交互方式難用舊有模式理解，因此提高網(wǎng)頁的可用性和用戶滿意度就需要將設(shè)計(jì)建立在人的認(rèn)知規(guī)律之上。

1認(rèn)知心理學(xué)的發(fā)展

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

2界面認(rèn)知模型分析

2.1用戶的視覺感知分析

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

2.2用戶注意特征分析

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

2.3用戶記憶特征分析

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

3網(wǎng)頁設(shè)計(jì)的認(rèn)知心理要素分析

3.1必要的提示與引導(dǎo)

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

3.2重視可視性

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

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

3.2.2聽覺的可視性設(shè)計(jì)通過聲音實(shí)現(xiàn)人機(jī)交互是產(chǎn)品設(shè)計(jì)的常見手段，聲音能配合其他感官進(jìn)行輔助認(rèn)知。提示音和錯(cuò)誤警報(bào)能在加深記憶的同時(shí)減少認(rèn)知負(fù)荷，甚至能營造帶入感。當(dāng)然，聲音的使用在網(wǎng)頁設(shè)計(jì)中要結(jié)合場(chǎng)景慎重選擇，過量或不必要的提示會(huì)分散用戶注意力降低效率。

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

3.3符合用戶習(xí)慣

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

結(jié)語

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

參考文獻(xiàn)：

[1]戴力農(nóng).設(shè)計(jì)心理學(xué)[M].北京：中國林業(yè)出版社，2014.3.

[2]胡駿.基于認(rèn)知心理學(xué)的醫(yī)療設(shè)備界面體驗(yàn)設(shè)計(jì)研究[D].浙江大學(xué)，2018.

[3]周麗娟.認(rèn)知心理學(xué)在導(dǎo)航設(shè)計(jì)上的應(yīng)用[D].北京郵電大學(xué)，2011.

[4]柳沙.設(shè)計(jì)心理學(xué)（升級(jí)版）[M].上海：上海人民美術(shù)出版社，2016.

[5]張麗,呂雪瑤.可視性對(duì)產(chǎn)品設(shè)計(jì)的影響[J].設(shè)計(jì)，2017.

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