在上篇中，我們聚焦產(chǎn)品中的用戶流程行為，討論為減少用戶操作負(fù)擔(dān)和優(yōu)化等待而做的交互設(shè)計；在中篇中，我們從人的主觀感受出發(fā)，討論產(chǎn)品的禮儀和為舒適而做的交互設(shè)計；在本篇中，我們將討論人的感知和目標(biāo)，探究那些”人們其實已經(jīng)知道，卻沒有被發(fā)現(xiàn)“，但偉大產(chǎn)品為此做的動人細(xì)節(jié)。

為感知而做的設(shè)計：交互設(shè)計的基石

談到“感知”和“目標(biāo)”將無法回避認(rèn)知心理學(xué)，今天我們所討論的“交互設(shè)計”成形于人機(jī)界面（GUI）產(chǎn)生之后。這因為隨GUI發(fā)展，不可視操作與概念化過程中發(fā)生的問題，必須通過“交互設(shè)計”予以合理解決。這時認(rèn)知心理學(xué)家通過理解人的認(rèn)知和行為模式，不但評估具體化設(shè)計的優(yōu)劣，還進(jìn)一步指導(dǎo)交互設(shè)計的具體實施。

此處不得不提到，80年代加州圣迭戈大學(xué)的認(rèn)知心理學(xué)教授Don Norman將心理學(xué)引入到設(shè)計中，奠定了交互設(shè)計和體驗設(shè)計的基石。后來者Steve Mulder、Alan Cooper、Jeff Patton則完善了交互設(shè)計的方法工具。

在增強(qiáng)感知方面，Norman在《日常的設(shè)計》中提到了五種方法，即可供性、意符、反饋、映射和概念模型。而后來者如深澤直人提出的閾下設(shè)計，在可供性方面走的更遠(yuǎn)，所以在這里稍做調(diào)整，以直覺化、可視化反饋，保持一致，方位感，符合心智模型五個方面討論為感知而設(shè)計。

案例一 MACBOOK和iOS的輸入鍵盤：直覺化設(shè)計

我們生活的世界充滿了線索，我們隨手將瓶子放在桌子上，是因為桌子平整和剛剛好的高度；我們爬山走累了，坐在石頭上，是因為石頭的輪廓給讓我們感知可以就坐。人們每時每刻都在測量周遭的物體的可供性，只是大多時候都沒有發(fā)現(xiàn)這一點。

Norman在《日常的設(shè)計》中所闡述的可供性是事物客觀特征和人印象的結(jié)合，而深澤直人提出的閾下意識（無意識設(shè)計）中的可供性，則強(qiáng)調(diào)通過產(chǎn)品輪廓構(gòu)建屬性，增強(qiáng)人的直覺化感知。

當(dāng)意識到人的感知會被物體的輪廓所左右，我們就會發(fā)現(xiàn)身邊的直覺化設(shè)計。

MACBOOK相比Thinkpad的鍵盤更具可供性，不是因為MACBOOK的鍵盤比Thinkpad的更大，而是前者通過不同材質(zhì)和不同顏色增強(qiáng)了按鍵輪廓，以及通過輪廓展示出舒適剛好的間隔。

同樣，IOS的鍵盤相比安卓鍵盤更具可供性，也并非因為它畫的比安卓更像鍵盤，而是簡潔的信息，飽滿的字體設(shè)定與疏密剛好的輪廓，讓人更容易聚焦按鍵。

直覺化設(shè)計不是強(qiáng)調(diào)給予用戶感官上的刺激，而是通過產(chǎn)品輪廓和位置與用戶的直覺產(chǎn)生高度共振。比如我們經(jīng)常會見到領(lǐng)紅包的模態(tài)視圖，多點將領(lǐng)取按鈕的位置下移至離用戶更近位置，用戶在閾下意識下點擊領(lǐng)取從而注冊，不是因為這個紅包畫的更像紅包導(dǎo)致的。

案例二 iOS的按鍵顯示與放大鏡：可視化反饋

乘坐電梯時常見到一種現(xiàn)象，人們按了一下關(guān)門按鍵，過了1秒，又按了一下，然后又按，最后門關(guān)上了，這源于電梯關(guān)門存在延遲與沒有提供及時反饋，雖然人們知道電梯存在這個問題，但當(dāng)再次來到這電梯中，卻又重復(fù)反復(fù)按鍵的一幕。人們在操作的時候，需要獲得可視化與及時反饋，否則就會感受到強(qiáng)烈的不穩(wěn)定感。

前邊提到OFO使用了一個糟糕的解鎖鍵盤，大按鍵設(shè)計與輸入反饋可以讓我們少犯錯誤。但當(dāng)鍵盤不是數(shù)字而是字母，受限于屏幕尺寸，我們并不能加大按鍵尺寸，該如何做呢？iOS早就想到了這一點，在第一代iPhone上就提供了輸入可視化反饋，讓人們及時知道是否已經(jīng)準(zhǔn)確輸入，同時不干擾視覺焦點。

同樣的模式，iOS在長按文本復(fù)制也有用到，用戶的手指長按時會覆蓋焦點位置，此時提供放大鏡的可視化反饋，有助于讓用戶充分感知是否準(zhǔn)確框取。

iOS的系統(tǒng)鍵盤通過可視化反饋增強(qiáng)了操作感知，而糟糕的三星手機(jī)，在窄小的鍵盤上輸入根本看不到按鍵反饋，手指按壓文字復(fù)制時也看不到反饋，如同電梯中不亮的關(guān)門鍵一樣每一次都讓人不安。

案例三 iOS的天氣開啟流量：保持一致

我們知道產(chǎn)品不論視覺設(shè)計還是交互設(shè)計都應(yīng)保持一致。當(dāng)我們看到加重的文字理解這是標(biāo)題，隨著我們閱讀再次看到加重文字，就會馬上感知到這就是標(biāo)題；當(dāng)我們拖動一個文件到垃圾箱代表刪除，我們會感知拖動另外一個也可以刪除。如果視覺元素排版不一致，就會讓我們感到內(nèi)容混亂，不容易理解；同樣如果一致的交互行為結(jié)果截然不同，我們就會感覺到困惑，甚至懷疑系統(tǒng)本身。

今天在網(wǎng)絡(luò)上有無數(shù)人抱怨iOS的天氣數(shù)據(jù)無法打開，而造成困擾的原因在于，對于開啟應(yīng)用數(shù)據(jù)流量的操作，iOS竟然為天氣應(yīng)用設(shè)計了不同的流程。

當(dāng)我們需要開啟普通應(yīng)用的數(shù)據(jù)流量步驟是：

1. 進(jìn)入設(shè)置
2. 滾動列表選擇某個應(yīng)用
3. 列表選擇無線數(shù)據(jù)
4. 開啟無線數(shù)據(jù)與蜂窩數(shù)據(jù)

而在設(shè)置列表里并不包含天氣，開啟天氣數(shù)據(jù)流量的步驟是：

1. 進(jìn)入設(shè)置
2. 進(jìn)入蜂窩移動網(wǎng)絡(luò)
3. 列表選擇使用無線與蜂窩數(shù)據(jù)應(yīng)用
4. 滾動列表選擇”天氣“
5. 開啟無線與蜂窩數(shù)據(jù)

不一致的交互讓用戶無法正確感知和找到開啟天氣數(shù)據(jù)流量的入口，從而倍感困惑。

案例四 iOS與摩拜單車的轉(zhuǎn)場動畫：方位感

在辦公室里我們經(jīng)常使用中央空調(diào)溫控器，糟糕的溫控器按鈕的空間排列無法與用戶內(nèi)心產(chǎn)生共振，每一次使用都需要重新觀察和理解每個按鍵的含義；優(yōu)秀的溫控器設(shè)計，風(fēng)力上升下降，溫度按鍵調(diào)節(jié)與數(shù)字，都能夠使用空間布局和人內(nèi)心產(chǎn)生共鳴，只要是用一次，下一次閉上眼睛都可以操作。

如同我們在某些立交橋或?qū)懽謽抢锶菀酌允б粯?，糟糕的交互設(shè)計總是隨著功能和界面的增加，讓我們困惑和思考自己所處在的位置；優(yōu)秀的設(shè)計甚至不用標(biāo)志，僅通過空間關(guān)系就讓人與環(huán)境產(chǎn)生共鳴。

我們每天使用的iOS就是通過界面間的X、Y、Z軸轉(zhuǎn)場，及焦點縮放展現(xiàn)界面信息之間層級關(guān)系，以及理解我們所處的位置。通常情況下，APP設(shè)計者都注意到了這一點，比如Airbnb：搜索、房源和攻略通過X、Y和Z軸轉(zhuǎn)場分離，每一信息類別和當(dāng)前所處位置可清晰感知。

不好的例子是摩拜單車，無論是左側(cè)菜單、搜索、消息，都是向左滑動的X軸轉(zhuǎn)場，而模態(tài)視圖不論觸發(fā)位置一律采用下落Y軸轉(zhuǎn)場，人們根本無法通過界面間運(yùn)動關(guān)系感知信息層級關(guān)系，信息之間關(guān)系因此混亂，就像糟糕溫控器例子里簡單粗暴橫向排列的按鈕一樣。

案例五 支付寶與微信卡包：符合心智模型

Norman提到產(chǎn)品設(shè)計中存在三個模型，實現(xiàn)模型，呈現(xiàn)模型，和用戶心智模型。當(dāng)產(chǎn)品的呈現(xiàn)模型趨于用戶心智模型，用戶就會輕松的理解和使用。當(dāng)呈現(xiàn)模型趨于實現(xiàn)模型而不是用戶心智模型，用戶就需要順應(yīng)、理解和平衡，有時因為理解錯誤，就會出錯，甚至?xí)虼烁械酱鞌?、憤怒和逃離。

今天我們知道電腦中根本沒有真實的文件夾、桌面和垃圾箱，這是70年代施樂實驗室設(shè)計圖形化系統(tǒng)時使用符合用戶心智的概念，將可視化操作與用戶日常行為相聯(lián)系。

支付寶與微信將優(yōu)惠券、銀行卡的列表使用卡包的概念。日常生活中，掏出錢包，拿出信用卡，使用完后，再放回錢包，“卡應(yīng)該放在錢包中”的概念模型是用戶所熟悉的。類似的例子，我們轉(zhuǎn)賬給朋友，支付寶和微信使用“紅包”的概念，也是為了將可視化操作與日常行為聯(lián)系。手機(jī)中根本沒有現(xiàn)實中的紅包，而是通過符合心智的模型增強(qiáng)了用戶感知，減少了用戶的錯誤理解和焦慮。

今天越來越多的產(chǎn)品懂得使用紅包的概念拉新，反觀airbnb，邀請好友獲得“旅游基金”是一個陌生概念，沒有和用戶的日常行為聯(lián)系，這是一個需要用戶理解而不能輕易感知，不符合用戶心智的例子。

因懂你而做的設(shè)計：

我們周遭的人造事物大多都是經(jīng)過設(shè)計的，而為了產(chǎn)品競爭或商業(yè)目的達(dá)成，今天智能設(shè)備上越來越復(fù)雜的功能和操作有時并沒有幫助我們，甚至讓我們感到多余和沮喪。以人為中心的設(shè)計，強(qiáng)調(diào)將人的需要、能力和行為模式進(jìn)行分析，然后再進(jìn)行設(shè)計來滿足人的需要，設(shè)計的前提是先理解人。

Norman在《情感化設(shè)計》中提到人的認(rèn)知存在三個層次，本能層、行為層和反思層，Alan Copper將其映射到交互設(shè)計中用戶的目標(biāo)：體驗?zāi)繕?biāo)（用戶想要什么樣的感覺）、使用目標(biāo)（用戶想要做什么）和人生目標(biāo)（用戶想要成為什么樣的人）。

談因懂你而做的交互設(shè)計，我們沿著Norman到Alan Copper的思路展開。

案例一 Bilibili、Acfun和野獸派：懂得如何迎合你

本能層認(rèn)知是用戶接觸產(chǎn)品時就會感受到的，所以體驗?zāi)繕?biāo)通常是簡單、通用和人性化的。不過設(shè)計者如果希望迎合受眾，通常會考慮更多的體驗動機(jī)，在體驗?zāi)繕?biāo)的達(dá)成上頗費(fèi)苦心。

Bilibili和Acfun都是以90后二次元為主要用戶群的視頻APP，在頁面元素、卡通圖標(biāo)和下拉刷新的加載動畫上，都盡力在迎合90后二次元的群體特征，展示了十分有趣的情景。

同樣的電商APP野獸派，用戶群是不滿足于傳統(tǒng)電商的年輕白領(lǐng)，在首頁使用精致的地圖展示店鋪，雖然這種交互模式增加了用戶識別的困惑，但是卻十分迎合這類用戶追求新鮮、不同、精致的體驗?zāi)繕?biāo)。

案例二 iOS與錘子日歷：懂得你的日常行為

行為層認(rèn)知是用戶在使用過程中感受到的，其映射的使用目標(biāo)代表著用戶使用產(chǎn)品執(zhí)行任務(wù)的動機(jī)。為了達(dá)成這一點，設(shè)計者通常需要關(guān)注用戶的日常行為和場景，以及用戶具體的使用行為和任務(wù)。

在日常生活中，我們常見三種日歷，即黃歷、月歷和年歷。黃歷每一頁是一天，每頁可以瀏覽和記錄更多信息，但在不同天之間推算天數(shù)不便；月歷將一個月記錄在一頁上，方便計算一月內(nèi)不同天的間隔，但推算相鄰月的間隔日期不便；年歷適合全覽和推算月間的日期間隔，但在瀏覽和記錄信息上不便。

iOS設(shè)計了一個優(yōu)秀的日歷，用戶可以順暢的在周、月和年的不同瀏覽模式間切換，而當(dāng)用戶想要看下個月的某天和今天間隔幾天，不會受限于是否在同月的限制，這正是源于對人們?nèi)粘Ｐ袨榈臏?zhǔn)確理解。相反，錘子的日歷完全機(jī)械復(fù)刻了現(xiàn)實中的月歷，人們必須按照月歷那樣切換，但日期客觀上是連續(xù)的，在推算相鄰兩月間隔日子時，人們也就碰到了如同現(xiàn)實中一樣的問題。

懂得用戶的日常行為和場景，iOS的日歷更好的達(dá)成了用戶的使用目標(biāo)。

案例三 知乎和RNIfilm：懂得你如何使用產(chǎn)品

達(dá)成用戶使用目標(biāo)的另一種方式是關(guān)注用戶的使用行為和任務(wù)。

當(dāng)我們在使用知乎的時候，跳出APP，過一會再進(jìn)入，頂部就會非模態(tài)顯示刷新；當(dāng)我們下拉列表的時候，會在信息中顯示之前瀏覽到哪里，知乎所做的這些，是因為理解用戶具體使用的行為和任務(wù)，都是為了用戶能更好的“刷”知乎。

同樣的例子，照片后期APP RNIfilm在打開手機(jī)照片的時候，沒有直接使用iOS的相冊，而是提供了一個經(jīng)過設(shè)計的相冊視圖，在該視圖中提供相冊的正序和倒序兩種排列方式，還記得你為了翻半年前拍攝照片的局促嗎？RNIfilm幫你減少了操作。這也是建立在理解用戶使用行為和任務(wù)的基礎(chǔ)上。

懂得用戶在產(chǎn)品中的具體使用行為和任務(wù)，知乎和RNIfilm更好的達(dá)成了用戶的使用目標(biāo)。

案例四 斯塔克的設(shè)計:懂你的進(jìn)取心

反思層認(rèn)知產(chǎn)生于用戶使用產(chǎn)品之后，它所映射的人生目標(biāo)代表了用戶的期待，涉及更深層的驅(qū)動力，用戶動機(jī)、欲望和自我形象，設(shè)計師所做的正是以用戶的人生目標(biāo)將產(chǎn)品最終轉(zhuǎn)化為更高層次系統(tǒng)。

在Norman的《情感化設(shè)計》書中，將斯塔克的設(shè)計歸類為第三層設(shè)計，但Norman并沒有講的十分清楚。而在國內(nèi)各種設(shè)計文章中介紹他時，普遍使用“設(shè)計鬼才”，“極簡主義”。在我看了他出場的09年設(shè)計選秀紀(jì)錄片《名師出高徒》時，反復(fù)聽到他在訓(xùn)斥參賽選手時用了“進(jìn)取心”這一詞，恍然大悟。

我們再看斯塔克的設(shè)計，不論是幽靈座椅、外星人榨汁機(jī)、騎士馬桶刷，都會發(fā)現(xiàn)這些設(shè)計不只是極簡主義，而是大眾設(shè)計，進(jìn)一步說，是使用普通、廉價的的材料，通過塑造出產(chǎn)品的進(jìn)取心而最終為產(chǎn)品注入靈魂和力量。今天我們看待和使用這些產(chǎn)品的時候，能夠感受到這種不平凡。大眾并不甘于平凡，懂得使用進(jìn)取心的設(shè)計激發(fā)大眾深層的欲望和驅(qū)動力，是斯塔克設(shè)計的獨(dú)到之處。

案例五 微信和支付寶:不是為溝通和支付而做的產(chǎn)品，而是達(dá)成你的人生目標(biāo)

Norman進(jìn)一步提到，人的目標(biāo)大致是四類：過美好的生活；成就自己的抱負(fù)；成為某方面的專家；在同輩中有魅力、受歡迎、被尊重。

我們再看微信和支付寶：這可不是為解決人的溝通和支付的問題而做的產(chǎn)品。

我們使用微信和他人溝通，同時每天刷微信朋友圈，曬各種生活，其驅(qū)動力難道不是為了成為一個有魅力、受歡迎被尊重的人嗎？

我們種銀行卡關(guān)聯(lián)賬戶，使用支付寶快捷支付，短期支撐房屋水電支付，打理我們的日常收支、儲蓄，長期則通過余額寶等理財，難道不是為了過更美好的生活嗎？

我們發(fā)現(xiàn)，當(dāng)產(chǎn)品不僅幫助我們實現(xiàn)體驗?zāi)繕?biāo)和使用目標(biāo)，還有助于為我們達(dá)成人生目標(biāo)時，仿佛就像斯塔克的設(shè)計一樣，注入了靈魂和力量，而我們最終也狂熱的成為了產(chǎn)品的忠實粉絲。

感謝大家閱讀。

相關(guān)閱讀

微交互的設(shè)計案例與思考（上篇）

微交互的設(shè)計案例與思考（中篇）

作者：彩虹貓sir，交互設(shè)計師一枚，堅持原創(chuàng)，以文會友，希望和大家共同感悟，思考，成長。

本文由 @彩虹貓sir 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。