“怎樣才能改善用戶體驗(yàn)設(shè)計(jì)？這是關(guān)于用戶體驗(yàn)研究恒久不變的話題。今天給大家推送的是關(guān)于運(yùn)用認(rèn)知心理學(xué)中的相關(guān)理論來(lái)提升用戶體驗(yàn)的研究。希望對(duì)大家有幫助。 文章太長(zhǎng)，會(huì)分成兩次推送，歡迎期待~

最好的用戶體驗(yàn)設(shè)計(jì)應(yīng)該是用戶察覺(jué)不到的。在界面中，它的出現(xiàn)自然而平滑。但是在現(xiàn)實(shí)中，許多關(guān)鍵設(shè)計(jì)的初衷卻是為了引導(dǎo)、有趣和避免出現(xiàn)問(wèn)題。

好的用戶體驗(yàn)既能幫助用戶達(dá)成用戶所期望的目的，又能讓用戶的所有操作都是在無(wú)意識(shí)之下進(jìn)行的。在瀏覽網(wǎng)頁(yè)時(shí)，用戶的注意力不應(yīng)該停留在界面和設(shè)計(jì)上，他們更應(yīng)該關(guān)注的是如何達(dá)成他們的目的。作為設(shè)計(jì)師，你的職責(zé)是事先清除障礙為他們提供一條更直接的路徑，幫助他們完成目標(biāo)。

“通常，飛速行駛的貨車不可能輕松地停下來(lái)。因?yàn)樗枰ㄙM(fèi)很多努力，運(yùn)用更多的動(dòng)能去改變運(yùn)動(dòng)狀態(tài)。與其強(qiáng)迫人們從他們的主任務(wù)上轉(zhuǎn)移注意力，不如直接帶他們?nèi)ニ麄兿肴サ牡胤健！?/p>

——Luke Wroblewski，谷歌產(chǎn)品總監(jiān)

換個(gè)思路來(lái)看。復(fù)雜和混亂的界面迫使用戶去尋找解決問(wèn)題的方法，而通常情況下，這些方法并不是一目了然的。用戶會(huì)因?yàn)檫^(guò)多的選項(xiàng)、界面、導(dǎo)航等產(chǎn)生困惑，以至于他們?cè)谒伎紩r(shí)感到不知所措。要知道，即便是很短暫的停頓，也足以讓用戶跳出網(wǎng)站，認(rèn)清他們坐在電腦前這一現(xiàn)實(shí)。

這種過(guò)度的思考就被稱為認(rèn)知超載，在這篇文章里，我們將為你解釋如何避免它的產(chǎn)生。那首先，我們需要明白，在我們的大腦中究竟是什么有被超載的風(fēng)險(xiǎn)。

圖片來(lái)源： Dierk Schaefer

認(rèn)知超載的科學(xué)根源

認(rèn)知負(fù)荷是指你的工作記憶可以處理的信息總量。當(dāng)你的工作記憶接收到的信息超出了它能自如控制的范圍時(shí)，認(rèn)知超載就產(chǎn)生了，它將會(huì)直接導(dǎo)致挫敗感并形成最終的決策。

但這究竟意味著什么？工作記憶到底是什么？針對(duì)這些我們又應(yīng)該怎樣進(jìn)行設(shè)計(jì)呢？還是讓我們先來(lái)了解一下認(rèn)知負(fù)荷理論的起源吧。

JOHN SWELLER和認(rèn)知負(fù)荷理論

認(rèn)知研究可以追溯到幾個(gè)世紀(jì)前，在上世紀(jì)80年代，澳大利亞教育心理學(xué)家John Sweller首次將這項(xiàng)研究應(yīng)用到教學(xué)設(shè)計(jì)中。Sweller試圖為每一種類型的學(xué)習(xí)者找出最適合他們的學(xué)習(xí)方法，讓他們可以記住他們學(xué)到的所有知識(shí)。換言之，怎樣的課程設(shè)計(jì)才是最佳的？

1988年，Sweller發(fā)表了論文“認(rèn)知負(fù)荷理論，學(xué)習(xí)困難和教學(xué)設(shè)計(jì)”（“Cognitive Load Theory, LearningDifficulty, and Instructional Design），這將他的研究工作推上了一個(gè)新的高峰。而該篇論文在1994年被修改后再版。

他的研究中運(yùn)用了數(shù)據(jù)組織結(jié)構(gòu)中的圖表數(shù)據(jù)庫(kù)，概述了有效和無(wú)效的教學(xué)方法，而他關(guān)于工作記憶負(fù)荷極限的研究則是設(shè)計(jì)師們?cè)噲D找到的最有用的內(nèi)容。

Sweller的研究在許多方面是擴(kuò)展了George Miller的信息加工理論。George Miller是一位認(rèn)知心理學(xué)家和語(yǔ)言學(xué)家，他在20世紀(jì)50年代測(cè)試出短期記憶的極限。Miller的研究在數(shù)字化設(shè)計(jì)，特別是分塊技術(shù)方面非常精辟，這將在本文后面討論。另外，Miller還創(chuàng)作了論文“神奇數(shù)字七，加或減二”（“The Magical Number Seven, Plus orMinus Two PDF），這個(gè)理論促使許多設(shè)計(jì)師將菜單項(xiàng)的數(shù)量限制在五和九之間—-盡管這項(xiàng)技術(shù)已經(jīng)在數(shù)字設(shè)計(jì)中不再被重視。

雖然這些理論最初只是被試用于教育領(lǐng)域，但其實(shí)它們也同樣適用于用戶體驗(yàn)（UX）設(shè)計(jì)?？梢哉f(shuō)，同樣的技術(shù)，它在增強(qiáng)記憶力和學(xué)習(xí)力的同時(shí)也減少了用戶的煩惱。

工作記憶

如果你每次打開(kāi)冰箱，都必須回答一個(gè)像謎語(yǔ)一樣的問(wèn)題，“什么東西小的時(shí)候四只腳走路，長(zhǎng)大了以后兩只腳，而老了以后有三只腳？”這是一個(gè)老段子，對(duì)嗎？但是，根據(jù)認(rèn)知負(fù)荷理論，使用這種讓人無(wú)奈的用戶體驗(yàn)設(shè)計(jì)始終會(huì)讓用戶感到相同的挫敗感。

圖片來(lái)源：ErikaWittlieb

要真正理解認(rèn)知負(fù)荷理論，你首先要理解什么是工作記憶。大腦在短時(shí)間內(nèi)完成一個(gè)任務(wù)的過(guò)程即是工作記憶。工作記憶必須借助所有的外部刺激和短期記憶元素，如果需要的話，還會(huì)從長(zhǎng)期記憶中提取信息。工作記憶相當(dāng)于計(jì)算機(jī)內(nèi)存，而長(zhǎng)期記憶則相當(dāng)于硬盤驅(qū)動(dòng)器。

工作記憶和短時(shí)記憶通常會(huì)被替換使用，但它們卻稍有不同。工作記憶是處理信息的過(guò)程，而短期記憶更像是信息的便簽本，它雖然重要，但卻沒(méi)有長(zhǎng)期記憶重要。

讓我們來(lái)看看這篇文章是如何解釋這種差異的。當(dāng)你在閱讀時(shí)，你可能會(huì)遇到一個(gè)用藍(lán)色字體書寫的陌生概念。你的工作記憶需要知道這個(gè)用藍(lán)色字體書寫的概念是什么意思，以理解這篇文章的深層含義。你的長(zhǎng)期記憶知道，藍(lán)色字體意味著一個(gè)鏈接，所以你的工作記憶知道要點(diǎn)擊鏈接獲取更多的信息。同時(shí)，你的短期記憶記住你在文章中的位置，所以當(dāng)你從外部頁(yè)面返回時(shí)，你不會(huì)迷失位置—-但到了第二天早上，這個(gè)位置就會(huì)被遺忘。

圖片來(lái)源：Tim Gouw

在設(shè)計(jì)中的應(yīng)用

Steve Krug是一位很有影響力的作家，他在網(wǎng)頁(yè)設(shè)計(jì)中極力推崇認(rèn)知負(fù)荷理論。他的書《Don’t make me think》被許多設(shè)計(jì)師認(rèn)為是影響重大的著作。書中記錄了許多寶貴的經(jīng)驗(yàn)，下面就列舉一些我們非常熟悉的：

• 每個(gè)頁(yè)面必須可以自我解釋，因?yàn)橛脩艉芸赡芟駨闹黜?yè)進(jìn)入你的網(wǎng)站一樣，從中途進(jìn)入你的網(wǎng)站。
• 用戶想要的“滿意”，通常是第一個(gè)合理的或最容易的解決問(wèn)題的方法，而不是最佳的。此外，作為習(xí)慣性生物，用戶會(huì)重復(fù)使用相同的方法解決問(wèn)題，而不會(huì)刻意尋找一個(gè)更好的選擇.
• 當(dāng)一個(gè)有著平均能力或經(jīng)驗(yàn)的人能夠使用系統(tǒng)來(lái)完成他們的目標(biāo)時(shí)，就意味著系統(tǒng)的可用性是合格的。
• 大部分情況下，我們使用網(wǎng)絡(luò)是想節(jié)約時(shí)間。所以，用戶的行為通常會(huì)像鯊魚一樣，“一直移動(dòng)，否則會(huì)死掉”。
• 后退按鈕是Web瀏覽器中最常用的功能。
• 即使返回主頁(yè)按鈕不常被用到，但是它的存在卻能給用戶以安全感。

除了Krug，許多人都闡述了認(rèn)知負(fù)荷理論對(duì)設(shè)計(jì)的作用，包括尼爾森諾爾曼集團(tuán)的可用性大師。

總之，用戶在瀏覽網(wǎng)站過(guò)程中哪怕是一瞬間的思考，也會(huì)對(duì)他們的工作記憶造成負(fù)擔(dān)。例如 “這個(gè)可以點(diǎn)擊嗎？“首頁(yè)按鈕在哪兒？”和“我怎么保存？”等等問(wèn)題，都會(huì)不同程度破壞用戶體驗(yàn)。

造成認(rèn)知超載的最常見(jiàn)原因

很多設(shè)計(jì)變量都在偷偷的對(duì)用戶大腦征稅，而且在用戶的外部生活和環(huán)境中也有許多變量是你無(wú)法控制的。一個(gè)用戶可能會(huì)擔(dān)心第二天的工作演示，或者在他的窗外正好有很嘈雜的建筑—-這些事情都會(huì)損耗他們的工作記憶，無(wú)論你們的網(wǎng)站設(shè)計(jì)的多么簡(jiǎn)單。

我們要清楚一點(diǎn)，每個(gè)用戶的工作記憶能力都不同。隨性的用戶比那些對(duì)每件小事都無(wú)比專注的用戶更能專注于你的網(wǎng)站。不經(jīng)常上網(wǎng)的用戶必然比經(jīng)驗(yàn)豐富的網(wǎng)絡(luò)用戶思考的更多。

雖然我們不能量化所有的認(rèn)知超載，但是我們可以避免大多數(shù)可能引發(fā)它的設(shè)計(jì)錯(cuò)誤。下面，我們將網(wǎng)頁(yè)設(shè)計(jì)中發(fā)現(xiàn)的最常見(jiàn)的錯(cuò)誤類型以及避免它們的最佳方法進(jìn)行分類說(shuō)明。

1. 不必要的操作

用戶的每一步操作都會(huì)增加他們的認(rèn)知負(fù)荷。太多的不必要的操作會(huì)讓用戶的思考脫離問(wèn)題本身或者讓他們抓狂。因?yàn)橛脩舻墓ぷ饔洃浭菍Ｗ⒂谕瓿商囟ǖ哪繕?biāo)，不必要的操作將迫使用戶投入更多的精力，而這無(wú)疑需要用戶使用更多的工作記憶去完成任務(wù)。不得不說(shuō)，這些不必要的步驟很考驗(yàn)用戶的耐心。

速度和節(jié)奏是減少認(rèn)知負(fù)荷的基本要素。用戶希望以輕快的、目的性很強(qiáng)的步驟來(lái)完成他們的任務(wù)，所以應(yīng)該提前消除任何延遲。

圖片來(lái)源： Touch of Modern

用戶都知道他們?cè)谶M(jìn)入網(wǎng)頁(yè)之前需要提交他們的電子郵件地址，但Touch of Modern的首頁(yè)卻要求在注冊(cè)之前提交…所有東西！第一個(gè)強(qiáng)制性操作和后面各種不必要的選項(xiàng)會(huì)嚇跑相當(dāng)大數(shù)量的潛在用戶。

解決方法：

下面這個(gè)方法可以幫助你有效的找到不必要的操作：列出用戶完成一項(xiàng)任務(wù)必須操作的步驟。例如發(fā)送電子郵件：

• 點(diǎn)擊電子郵件圖標(biāo)。
• 點(diǎn)擊“發(fā)送到”輸入框。
• 輸入電子郵件地址。
• 點(diǎn)擊“主題”輸入框。

凡此種種，不一而足。

現(xiàn)在，重新查看這個(gè)操作清單并且尋找可刪減的步驟，想到什么了嗎？你可以通過(guò)將光標(biāo)一開(kāi)始就自動(dòng)定位在“發(fā)送到”字段從而刪除步驟2。這將減少用戶的麻煩，雖然很微小。但你消除的每一步都是一場(chǎng)勝利。

圖片來(lái)源：Google

讓我們來(lái)看一下谷歌的主頁(yè)。光標(biāo)一開(kāi)始就停在搜索框中，于是所有的用戶需要做的就是開(kāi)始輸入文字。這些微小的交互無(wú)疑提升了整體的用戶體驗(yàn)，所以不要忽視它們。

2. 過(guò)度刺激

混亂，嘈雜和其它分散注意力的界面會(huì)讓用戶從他們手頭的任務(wù)上分心。這就好比，幾個(gè)人同時(shí)跟你說(shuō)話你會(huì)很難集中精神一樣，在網(wǎng)頁(yè)上，當(dāng)有太多的圖像、動(dòng)畫、圖標(biāo)、廣告、文本類型和明亮的顏色時(shí)，那簡(jiǎn)直是一場(chǎng)搶奪你注意力的“大戰(zhàn)”。

記住，每個(gè)人的工作記憶在向前完成目標(biāo)的過(guò)程中，會(huì)因?yàn)橥饨绲拇碳?duì)每一步工作重新排序。每一次分心，尤其是視覺(jué)上的強(qiáng)烈刺激，都會(huì)耗費(fèi)用戶的一部分注意力。

圖片來(lái)源：LINGsCARS

LINGsCARS可能是一個(gè)極端的例子，你可以看到每個(gè)元素都在激烈地競(jìng)爭(zhēng)著，例如明亮的顏色和動(dòng)畫，直擊感官。甚至于，在屏幕的兩個(gè)不同區(qū)域竟然有兩個(gè)動(dòng)畫同步地刺激著用戶。

解決方法：

首先，去除一切不必要的東西。一般情況下，只保留必須存在的東西才是最佳的，可以減少加載時(shí)間也讓用戶體驗(yàn)更加流暢。更重要的是，在美學(xué)如何影響網(wǎng)站的第一印象（PDF）的研究中發(fā)現(xiàn)，與視覺(jué)上復(fù)雜的網(wǎng)站相比，用戶更喜歡簡(jiǎn)潔的網(wǎng)站。

你也可以為了頁(yè)面平衡讓你的內(nèi)容多樣化。過(guò)多單一的表達(dá)方式（例如：文本或圖像）用戶同樣難以忍受。將視覺(jué)內(nèi)容—-圖片，視頻，信息圖表等等—-合理的組合在一起，讓頁(yè)面更加和諧，也讓用戶更容易理解。

電影和電視網(wǎng)站IMDB無(wú)疑傾向于大量的視覺(jué)內(nèi)容，但它依然使用了相當(dāng)數(shù)量的文本內(nèi)容來(lái)維持它的頁(yè)面平衡。

圖片來(lái)源：IMDb

在抽取出一個(gè)頁(yè)面上必須要展示的元素之后，你應(yīng)該采用一種讓用戶瞬間能懂的方式組織這些元素。對(duì)稱或者創(chuàng)造性的不對(duì)稱布局顯示信息都可以很快的被理解，簡(jiǎn)單的說(shuō)，就是用一種方式，盡力的減少大腦的工作。這樣不僅是對(duì)稱和不對(duì)稱都能讓眼睛感覺(jué)很舒適，而這樣的結(jié)構(gòu)也能讓界面交互更容易。

讓我們來(lái)看一下Groupon是怎樣布置頁(yè)面的吧。左中是文本類的垂直菜單，右中是一個(gè)有特色的凍酸奶交易文本描述，插在文本中間的照片和色塊的使用，分分鐘創(chuàng)造出一個(gè)讓人喜愛(ài)的沙漏結(jié)構(gòu)。

圖片來(lái)源： Groupon

對(duì)稱不僅僅是指頁(yè)面的兩側(cè)要用相同的設(shè)計(jì)布局，它的含義可以引申為頁(yè)面視覺(jué)重心和視覺(jué)方向的平衡。從這個(gè)角度來(lái)看，不對(duì)稱的頁(yè)面也可以看起來(lái)很有組織性，比如下圖顯示的OTHR。

圖片來(lái)源： OTHR

將你的頁(yè)面內(nèi)容精減到只包含簡(jiǎn)單的和非競(jìng)爭(zhēng)性的元素，這只是完成了預(yù)防過(guò)度刺激工作的一半。千萬(wàn)記住，要用一個(gè)簡(jiǎn)單直接的布局合理地呈現(xiàn)這些元素。

原文地址

譯者：唐唐

來(lái)源：微信公眾號(hào)【INUX】

本文由 @INUX?授權(quán)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)作者許可，禁止轉(zhuǎn)載。