隨著互聯(lián)網(wǎng)行業(yè)的發(fā)展和人們對產(chǎn)品使用體驗要求的提高，互聯(lián)網(wǎng)產(chǎn)品在市場中的競爭日益加劇，技術(shù)已經(jīng)不再是各大互聯(lián)網(wǎng)公司保持市場領(lǐng)先地位的唯一核心競爭力，騰訊、百度、阿里巴巴等互聯(lián)網(wǎng)公司紛紛成立UED部門，用戶體驗被提升到了企業(yè)的戰(zhàn)略級高度，一個用戶體驗設(shè)計良好的產(chǎn)品，會在當(dāng)前產(chǎn)品同質(zhì)化嚴(yán)重的市場競爭中起到至關(guān)重要的決定性作用。在這個時代，一個成熟的產(chǎn)品經(jīng)理在設(shè)計產(chǎn)品中也不再局限于簡單的功能性設(shè)計，對用戶體驗設(shè)計的重視程度越來越高。UI與交互設(shè)計是產(chǎn)品設(shè)計開發(fā)中十分重要的一環(huán)，如何將產(chǎn)品的用戶體驗做到極致，成為UI設(shè)計師與交互設(shè)計計師需要思考的問題。

一、心理學(xué)與UI交互設(shè)計設(shè)計的關(guān)系

UI與交互設(shè)計已經(jīng)形成了一門綜合性比較強的學(xué)科，涉及人體工程學(xué)、認(rèn)知心理學(xué)、行為心理學(xué)、社會學(xué)、數(shù)據(jù)分析、設(shè)計學(xué)等。一般情況下，公司的UI/UE設(shè)計師會由設(shè)計類專業(yè)或者心理學(xué)專業(yè)背景的人來擔(dān)任，然而，交互設(shè)計，寬泛地說（不限于互聯(lián)網(wǎng)產(chǎn)品），關(guān)注的是人與物體，人與環(huán)境，還有人與人之間的互動，為了做出好的交互設(shè)計，交互設(shè)計師要去理解人的行為，分析影響和驅(qū)動這些行為的因素與他們之間的關(guān)系，在理解人的交互，和需要什么樣的交互的基礎(chǔ)上對這些因素進行設(shè)計，創(chuàng)造出適合人的、符合人行為與心理規(guī)律的設(shè)計。根據(jù)唐納德·A·諾曼在著作《情感化設(shè)計》中的闡述，把交互設(shè)計中的情感設(shè)計區(qū)分為三個層次（如圖1）。

現(xiàn)在市場上的產(chǎn)品，能夠完美融合這三個層次設(shè)計的產(chǎn)品少之又少，想達(dá)到這個目標(biāo)，我們需要研究的不僅僅是設(shè)計學(xué)維度的東西，而更要求助于心理學(xué)，對心理學(xué)的了解能夠幫助交互設(shè)計師學(xué)會用科學(xué)的方法去分析人的行為，讓設(shè)計師有更合理的理論依據(jù)去做下一步的具體設(shè)計。下面，我們將重點研究“格式塔心理學(xué)”與“認(rèn)知心理學(xué)”在UI與交互設(shè)計中所起的作用。

二、格式塔心理學(xué)與交互設(shè)計

格式塔心理學(xué)是西方現(xiàn)代心理學(xué)的主要流派之一，根據(jù)其原意也稱為完形心理學(xué)。1912年在德國誕生，后來在美國得到進一步發(fā)展。格式塔心理學(xué)主張在觀察現(xiàn)象的經(jīng)驗時要保持現(xiàn)象的本來面目，不能將它分析為感覺元素，并認(rèn)為現(xiàn)象的經(jīng)驗是整體的或完形的（格式塔），所以稱為格式塔心理學(xué)。這是在UI與交互設(shè)計中實際運用最多的心理學(xué)理論之一。它主要包括：接近性原則；相似性原則；連續(xù)性原則；封閉性原則；對稱性原則等。

（一）接近性原理

在我們的認(rèn)知規(guī)律里，我們更加傾向于把形狀上比較接近的元素看成是一個集合或者一個整體（如圖2）雖然圓形和三角形排布在一塊，但我們卻會在此時將距離近的圓形和三角形歸為一組。

這個原則在網(wǎng)頁與APP設(shè)計中的頁面內(nèi)容歸組設(shè)計比較常見，設(shè)計師通過留白進行頁面內(nèi)容的歸組。（如圖3）中為QQ的“動態(tài)”功能頁面，交互設(shè)計師在做這個頁面的交互的過程中，企圖將“游戲”、“購物”、“閱讀”、“音樂”和“熱門活動”放置為一組，他巧妙地采用了格式塔心理學(xué)中的接近性原則，將這5個按鈕在布局上用較近的距離進行組合排列，從而導(dǎo)致我們在觀察這個界面的時候，很容易受大腦中的“格式塔思維”所影響，很自然地將B部分的所有功能認(rèn)為是一個組，C部分的所有功能為一組。

（二）相似性原理：

我們的大腦，通常認(rèn)為相等或相似的元素形成整體或組合。（如圖4）中，我們會不自覺地認(rèn)為它是縱向排列的。

相似性法則也是我們在做UI設(shè)計中經(jīng)常用到的，（圖2）中同樣用了相似性法則，UI設(shè)計師將A組中的“好有動態(tài)”、“附近”、“興趣部落”按鈕設(shè)計得都比B和C組中的按鈕大很多，并且采用了橫向排列，用戶在使用這個界面的時候，就會很容易將A組與B、C組區(qū)分開來。

（三）閉合性原理

閉合性原理就是當(dāng)元素不完整或者不存在的時候，人們會根據(jù)自己的認(rèn)知經(jīng)驗和視知覺的整體意愿驅(qū)使，不完整的元素依然可以被人們所識別。（圖5）是一個不完整的圓，但是我們習(xí)慣性的將圖形作為一個整體去觀看，于是我們會不自覺地在意識里將缺少的形狀補充進去之后，便形成最終我們能夠識別出來的圖形。

這條規(guī)則最常見的便是圖標(biāo)設(shè)計，運用此原則，可以用極簡的語言傳達(dá)更多的內(nèi)容（如圖6）。我們很輕松地就能識別出每個圖標(biāo)的功能，即使它們并不是非常完整。

（四）主體/背景原理

我們在觀察一個界面時，會本能地將觀察對象分為主題和背景兩塊區(qū)域。在觀察對象中占據(jù)我們主要注意力的元素為主體部分（一般主體會被安排在最中間或者黃金分割位置），其余則為背景部分（如圖7）。

“主體/背景原理”多應(yīng)用于平面設(shè)計或者UI設(shè)計中，作為設(shè)計師的工作就是幫助用戶更好地區(qū)分好背景與主體，以協(xié)助用戶思考。這個原則也常用于網(wǎng)頁或者APP設(shè)計中在其他內(nèi)容之上彈出信息，作為需要引起用戶注意的內(nèi)容，此信息一般為暫時性且非常重要的，相對于跳轉(zhuǎn)頁面的形式，彈出信息的方式可以幫助用戶了解彈出的信息所處的環(huán)境，也可以精簡頁面結(jié)構(gòu)，符合用戶對事物的認(rèn)知規(guī)律，（如圖8）為手機系統(tǒng)與應(yīng)用中常用的毛玻璃效果，這個效果就應(yīng)用到了“主題/背景原理”。

三、認(rèn)知心理學(xué)與交互設(shè)計

認(rèn)知心理學(xué)的核心觀點認(rèn)為知識是決定人類行為的主要因素。UI與交互設(shè)計師的工作就是對產(chǎn)品使用者的需求進行正確的認(rèn)知和傳達(dá)，從而提高人們獲取并分析處理信息的能力和效率。人在識別某個圖像時，如果在過去的經(jīng)驗中有這個圖形或相似的圖形，我們稱之為“記憶痕跡”。如果用戶觀察到的圖形與“記憶痕跡”相符合，人們就能付出較少的認(rèn)識成本來識別這個圖形。UI設(shè)計師或交互設(shè)計師在設(shè)計頁面時首先要從用戶最根本的認(rèn)知心理機制研究入手，充分了解用戶的心理，設(shè)計出符合用戶認(rèn)知心理規(guī)律的產(chǎn)品，從而能夠讓用戶獲得良好愉悅的使用體驗。

（一）UI設(shè)計中的“錯怪效應(yīng)”

當(dāng)我們體驗一款互聯(lián)網(wǎng)產(chǎn)品時，如果UI界面圖文排版不好的話，用戶會非常難以理解產(chǎn)品經(jīng)理的表達(dá)意圖，用戶會認(rèn)為是整個產(chǎn)品都不好，而不僅僅只是認(rèn)為其UI和交互設(shè)計不好。就像我們小時候因為不喜歡數(shù)學(xué)老師而不喜歡數(shù)學(xué)課的意義，這種心理偏見是人在成長過程中建立的本能思維習(xí)慣。人類思考問題和判斷一件事物好壞的時候，一個未經(jīng)過邏輯學(xué)訓(xùn)練的人，會很輕易本能地調(diào)用付出成本小且獲得答案快的感性思維，即使其判斷結(jié)果往往是不靠譜的，而且往往大腦也會選擇相信。所以，我們在做UI排版時，一定要極為細(xì)致認(rèn)真，不能做錯哪怕一個像素，一個排版優(yōu)美的UI對于一個產(chǎn)品是至關(guān)重要的。

（二）色彩與認(rèn)知心理學(xué)

我們對色彩的認(rèn)知是從孩提時代開始的，我們小時候都有劃破手指的經(jīng)歷，當(dāng)紅色血液流出的那一刻，伴隨的是疼痛與緊張，當(dāng)我們看到大自然的綠色風(fēng)光的時候，會不由得精神放松。我們幾乎所有人都有這些“記憶痕跡”，我們在設(shè)計頁面搭配色彩時，也要遵循人的“記憶痕跡”，這樣才能協(xié)助用戶思考，不會產(chǎn)生歧義。在（圖9）中，當(dāng)微信有信息提示時，為了引起用戶的注意，UI設(shè)計師采用了紅色圓形的提示標(biāo)志，讓我們把注意力集中到“未讀消息”上，從而避免漏掉新消息，正是應(yīng)用了這一心理學(xué)原理。

（三）模擬生活中常見的事物

從世界上的第一個ICON開始，設(shè)計師就開始嘗試使用人們?nèi)粘Ｉ钪谐Ｒ姷氖禄蛭飦肀硎灸硞€功能，直到今天，這個設(shè)計原則一直沒有改變，只不過在視覺風(fēng)格上由“擬物”做成了“扁平”，但是其設(shè)計原則都是源于“模擬”。在安卓與IOS的操作系統(tǒng)中，設(shè)計師把下拉菜單設(shè)計成像窗簾一樣，可以拉下也可以收起。在一些APP中，設(shè)計師采用了側(cè)滑式的交互設(shè)計（如圖10），就像在模擬我們生活中及其常見的抽屜。這些真是非常贊的設(shè)計，在我們看到這些似曾相識的設(shè)計的時候，我們甚至不用學(xué)習(xí)就可以上手操作。

結(jié)語

UI與交互是產(chǎn)品與用戶溝通的橋梁，一個互產(chǎn)品（不局限于互聯(lián)網(wǎng)產(chǎn)品）的品質(zhì)，UI和交互設(shè)計是產(chǎn)品開發(fā)中十分重要的一環(huán)，UI與交互設(shè)計師要深入透徹地了解與分析用戶的心理規(guī)律，將心理學(xué)應(yīng)用到產(chǎn)品的交互設(shè)計中，才能達(dá)到絕佳的使用體驗。同時，需要指出的是，我們在設(shè)計一個產(chǎn)品時，這些原則可以作為參考，但是“設(shè)計”這件事情本身并沒有規(guī)則，我們做此研究的意義并不是告訴大家設(shè)計師如果遵守某個黃金準(zhǔn)則，產(chǎn)品就能脫穎而出了，我們研究這件事情的意義在于：我們需要找出產(chǎn)品為什么優(yōu)秀的規(guī)律，并且嘗試完善它、靈活運用它甚至打破它，我想，這才是設(shè)計師應(yīng)該做的事。阿恩海姆所說：“如果藝術(shù)過分強調(diào)秩序，同時又用缺乏具有足夠活力的物質(zhì)去排列，就必然導(dǎo)致一種僵死的結(jié)果。