多圖預警，且長達 4000 字。
在進入主題之前，讓我們先來看看一道題目。
假設你是一名公共汽車司機。在第一站上來 6 個男人和 2 個女人，在第二站 2 個男人下車，1 個女人上車。在第三站 1 個男人下車，2 個女人上車。在第四站 3 個男人上車，3 個女人下車。在第五站，2 個男人下車，3 個男人上車，1 個女人下車，2 個女人上車。
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
問題來了：
公交車司機叫什么名字？
這道題體現(xiàn)了記憶過程的一些基本特征。
我將在接下來的內容中，簡單的介紹一下人類記憶的過程與一些設計原理之間的關系。
0. 記憶的過程
人類的記憶過程可以劃分為 3 個階段：
- 編碼（encoding）
- 存儲（storage）
- 提取（retrieval）
其中，編碼是通過各種感覺系統(tǒng)來接受信息，并進行初步加工的過程，總的來說就是關于人類如何感知這個世界的方法。百萬年來，人類進化出了幾種可以幫助我們更好地活下去的心理特征。
我們就從編碼過程的三個基本特征開始。
1. 記憶過程的第一步：編碼
這是我們公司洗手間的推廣位，大家能快速看到哪些文字呢？
這是我們公司洗手間的推廣位，大家看看有什么問題？
在這張推廣圖中，正文的文字被復雜的背景圖所干擾，變得難以閱讀。在這個場景這個時刻，每次看到都讓我很糾結。
上圖這個界面呢，又有什么問題？
同樣地，這個界面的主體應該是用戶發(fā)布的內容，但也許是為了渲染氣氛，加入了表意不明的背景圖和花邊紋理，搶奪了用戶的大量注意力資源。
上圖是進入某個 app 后，首屏都還沒加載完，馬上看到的空前絕后的新手引導。用戶本來可以好好的瀏覽內容，逐步了解這個產品的價值，然而這個引導的字比首頁的字還多……
通過上面的例子，我想告訴大家的是，人的注意力資源是非常有限的。上面的界面被人為地制造了大量干擾，耗費了過多注意力資源，讓我們難以獲取關鍵信息。
1.1 編碼過程的基本特征：人類的注意力資源非常有限
有限到什么程度？請看圖。
你以為用戶看到的是上面的樣子，其實是用戶的清晰視野只有下面的區(qū)域。
怎樣度量這個核心區(qū)域？你可以把手臂往前方伸直，然后朝上伸出拇指，你能看到的拇指指甲大小約等于人眼分辨率最高的區(qū)域，范圍之外的分辨率成指數(shù)級下降，邊緣區(qū)域甚至只有相當于屏幕上的幾個像素。
既然注意力資源這么有限，我們在設計上應該怎么做呢？
我們在開始設計之前，要思考用戶在每個界面的核心目標，不添加任何多余的元素，避免干擾用戶。
這是驗證 Apple ID 的第一步，需要用戶輸入 iPhone 的解鎖密碼。由于輸入密碼是一個需要耗費大量注意力資源的行為，整個界面真正做到了毫無干擾。
既然注意力那么稀缺，為什么上圖又不只顯示一個窗口呢？因為當前這個場景，用戶需要的是多窗口多任務聯(lián)動，因此只能夠通過其他方法來突出重點。這里使用了合理的視覺層級關系，讓我們可以快速捕捉到上方的窗口就是當前的主體。
1.2 編碼過程的基本特征：填補遺漏的傾向
我們再看下方的這一組圖，能否識別出分別是什么東西？
我們的大腦其實是很「先進」的，可以自動填充那些沒閉合的事物，也可以把不連續(xù)的東西連起來，把它們看做一個整體。上圖中的熊貓，我們不會看成是一堆黑色色塊，右邊的兩條相交的曲線，也不會成是一堆小點。
我們可以利用人類這種自動「補漏」、自動「縫合」的心理特征，來減少界面上的部分元素。
上圖是涂手的作品詳情頁，通過邊緣的切割，和右側、下側的陰影處理，就可以讓我們感知道是一個正方形的畫布容器。
通過這個心理特征，還以用來拓展屏幕的有限空間。
只露出內容的一部分，就可以讓用戶感知到后續(xù)有更多的內容，突破了屏幕的限制，也節(jié)省了版面空間。
1.3 編碼過程的基本特征：分組的傾向
我先說一個假的故事……
一個美女要我馬上去跟她吃飯，我開心得要死，立刻去乘坐宇宙最快的交通工具——地鐵。剛走到地鐵門口，看到這樣一個指引，馬上一臉懵逼。
大家能快速辨識到哪邊是進站，哪邊是出站么？
好不容易來到了商場電梯，一看……
當我悄悄地按下了兩個按鈕之后，美女電話來了，她說你來這么晚，不吃了，直接來我房間吧，房間號是 114。美女就如救世主一樣把我從電梯口拉了回來。
然后我興沖沖的跑到一樓酒店入口，準備看看 114 號房在哪里……
為什么看到剛剛幾張圖，我們會覺得很別扭甚至無法理解呢？
因為人是有將事物分組的傾向，剛剛看到的都是分組不合理的例子。那應該怎么分組才合理呢？我們先來做個小實驗。
在上圖中，在進行數(shù)量計算之前，有的同學可能會根據(jù)顏色來把圓分組，有點同學可能會根據(jù)大小來分組。但是應該很少同學會直接一個一個數(shù)。
如上圖所示，經過一定方式的排列之后，我們會更容易計算圓的數(shù)量。這就反映了一個問題，為什么我們更容易感知有一定規(guī)律的事物？
百萬年前，我們的祖先為了更好地理解事物，逐漸學會在復雜之中尋找規(guī)律，從而進化成為一種基本信息加工本能。這就是人類將事物分組的傾向。
我們傾向于把位置上靠近的物體看成一組，也傾向于把形狀、顏色、運動方向相似的物體看成一組。
回頭看看一些設計得很不錯的案例，你會發(fā)現(xiàn)，把組分好也是一種技術活。
把界面元素按照不同的特征來排列，可以幫助用戶更快識別，節(jié)省了大量注意力資源。
上面就是一些與記憶編碼過程相關的特征。大家看看下圖的界面應用了哪些特征和設計方法？
2. 記憶過程的第二步：儲存
信息在經過識別加工后，就會進入到我們大腦的儲存區(qū)域。按照時效來區(qū)分，記憶分為兩種——短時記憶和長時記憶。
在繼續(xù)下去之前，大家先回答兩個問題。
- 人類記憶的編碼過程，有哪幾種認知傾向？
- 剛剛地鐵站入口的圖里面，地鐵站的墻壁是什么顏色？
我相信有大部分同學回答不出來。上面的東西也不是很多，只有 3 個概念、1 種顏色，距離我介紹完也就相隔幾分鐘，為什么還是記不住全部東西？
有沒有試過，接了個電話后，忘記接電話前在做啥；談話過程中被打斷，回頭發(fā)現(xiàn)忘記談到哪里；正在進行復雜的數(shù)字運算，被打斷后需要重新計算。
被忘記的東西，是因為被儲存到容量極小、極其不穩(wěn)定、時效最短幾秒最長僅有 2 分鐘的短時記憶里面。
而應該有些同學能記住部分甚至全部概念，為什么呢？
因為他們之前有了解過這些相關概念，或者他們在聽的時候有下意識地不斷復述，在不斷復述的過程中，這些短時記憶就會轉變?yōu)?strong>長時記憶。
短時記憶是依靠不斷復述來轉變成長時記憶。
長時記憶也有自己的弱點：
- 易出錯，就像高壓縮比的圖像，解釋度不高，提取之后很零散、模糊，例如「提筆忘字」；
- 受情緒影響，傷心、生氣等情緒激動的時候，短時記憶最容易變成長期記憶，特別是女性；
- 追憶時可被改變，經常記錯別人的事情發(fā)生在自己身上。
這里要注意的是，短時記憶是各種感官接收到的感覺，還有各種注意現(xiàn)象的集合，如果不轉變成長時記憶，就會消失。短時記憶并不是從長期記憶里提取出來的緩存。
既然短時記憶那么不穩(wěn)定，我們在設計上又可以做些什么呢？
2.1 清晰的流程與反饋
首先，還是得明確用戶目標，特別是在包含多步操作的交互流程中，提供清晰的任務流程和反饋。
2.2 記住用戶的選擇
其次，我們要記住用戶的選擇，減少用戶的記憶負擔。
▲ 喜馬拉雅 FM 記住了我的上次登錄方式。
▲ 京東的購物車，除了會提醒我商品降價之外，還會記住購物車的選中狀態(tài)，而且多端實時同步。
▲ PC 端的京東購物車實時同步勾選狀態(tài)。
我自己經常遇到一個情況，就是在某些 apps 里面操作的時候被打斷，回來之后就不知道在做什么了。我也會擔心自己設計出這樣的產品，因此我想到一個土辦法，來驗證自己的設計是否清晰高效。
在設計任務的關鍵頁面的時候，假設此時收到一條重要的微信，然后你去微信，回復該消息后，再回來這個頁面，還知道這個頁面是干嘛的么？
當短時記憶轉變?yōu)殚L時記憶之后，儲存過程就結束了。在有需要的時候，外界的刺激或者我們自己都可以把長時記憶回憶出來，這就是我們記憶的提取階段。
3. 記憶過程的第三步：提取
看到張學友，你們第一時間會想起什么？
有人會想起他的歌和演唱會，有人會想起他的廣告，有人會想起他的電影，我只會想起他的表情包。為啥呢？這是因為每個人都有不同的心理模型。
心理模型：人們對世界的認知和處事的經驗，受教育、家庭、社會環(huán)境等因素影響，不同的人，會有不同的心理模型?？梢哉f是各種長時記憶的合集。
我們一直期望用戶在使用我們產品的時候，把主要任務流程都爛熟于心，但除非是高頻的需求，否則用戶不可能經常使用我們的產品，因此他們對我們的產品的了解，也僅儲存在短時記憶里面。
因此，在產品設計當中，需要思考如何幫助用戶更好地理解和記住我們的功能與流程。
3.1 符合目標用戶的心理模型
首先，我們要找出目標用戶，然后所有的設計都要符合該用戶群的心理模型，讓該用戶群更容易理解和記憶我們的產品功能或流程。
上圖是 iOS 相冊查看大圖的功能，我們可以通過很自然的拿捏手勢來縮放圖像，而且圖片的展開和收起都在同一個位置上，哪里來哪里去，符合了全球人民的世界觀和人生觀，真正做到了普適設計。
上圖是 iOS 系統(tǒng)的登錄框，在輸錯密碼之后，他會用擬人的手法來模擬錯誤提示，就像在搖頭一樣。據(jù)我了解，全球好像只有一個種族的搖頭不是表達否定的意思。
上圖是一個航班細節(jié)的信息，非常難以識別和提取。人類進化了上百萬年，但文字的心理模型僅存在數(shù)千年，因此文字閱讀并不是自然的，而是靠后天不斷練習而成的心理模型。因此，純文字的表述讓用戶難以儲存和提取。
通過優(yōu)化排版布局后，會比純文字更容易識別，但是也不太利于記憶的提取。
這個界面與前面的相比，更容易識別和提取，因為它通過各種圖形化元素來表達關鍵信息，并且通過拖動操作來代替文字輸入和點按選擇。圖形跟自然手勢都是比較通用的心理模型。
3.2 符合邏輯
另外一方面，有很多新的新創(chuàng)意，用戶都沒有見過，所以沒有任何可用的心理模型。那為了讓用戶更容易理解，這些創(chuàng)意必須符合邏輯。
上圖的界面跳轉、多選操作在我們現(xiàn)在看來最平常不過，但是對于剛開始接觸智能手機操作系統(tǒng)的人來說是全新的東西，頁面從邊緣滑入、多選的操作、狀態(tài)的實時變化，在現(xiàn)實世界中不存在這樣的模式。頁面前進、返回的動效是相呼應的，操作和反饋是對得上的，這就符合了基本的邏輯，用戶也容易理解和記憶。
3.3 穩(wěn)定的最簡路徑
有一個經典的心理學案例，有一個人，上班的時候一直走了遠路，后來另外一個人告訴他有一條捷徑，但是他第二天還是走了遠路，那個人就問他為什么，他回答說「我趕時間，所以我走了遠路」。為了節(jié)省注意力資源，也為了減少犯錯的機會，人類傾向于使用那些更省力的方法。
這就帶給了我們一個啟示，就是在設計任務流程的時候，要優(yōu)先保證任務路徑的穩(wěn)定，然后把各個流程節(jié)點簡單化。這里用的是「最簡」而不是「最短」，是避免大家把很多東西放在同一個流程上，就覺得讓用戶走了捷徑。
在我關閉朋友圈之后的一段時間，我還是習慣性的會去打開朋友圈。然后，我點錯了入口。
穩(wěn)定的最簡路徑，在不斷重復后，可直接轉化為肌肉記憶。我覺得做產品做設計的終極目標，就是要讓關鍵功能都變成肌肉記憶。
總結
以上就是記憶過程與設計之間的一些關系。
其實很多原理大家都知道，我只是用心理學上的一些特征，來告訴大家這些設計原理背后的原因，加深大家的理解。
本文同時發(fā)表于 我的博客
