格式塔心理學(xué)在產(chǎn)品人機(jī)界面設(shè)計(jì)中的應(yīng)用研究

權(quán)雯欣 梁艷霞 嚴(yán)文杰

摘? 要：該文主要研究格式塔心理學(xué)在產(chǎn)品人機(jī)界面設(shè)計(jì)中的應(yīng)用。通過(guò)不同的產(chǎn)品人機(jī)界面設(shè)計(jì)案例，分別分析格式塔心理學(xué)中的接近性、相似性、閉合性、連續(xù)性、對(duì)稱性5個(gè)原則。接近性原則和相似性原則與試圖給對(duì)象分組的傾向相關(guān);閉合性原則和連續(xù)性原則與試圖給對(duì)象完整形態(tài)的傾向相關(guān);而對(duì)稱性原則與試圖簡(jiǎn)化圖形使其符合人的視覺(jué)習(xí)慣相關(guān)。格式塔原則讓界面上的信息以分組和完整的方式呈現(xiàn)，有助于設(shè)計(jì)師了解人的視覺(jué)規(guī)律，從整體上把握事物的知覺(jué)結(jié)構(gòu)，將產(chǎn)品人機(jī)界面設(shè)計(jì)中的顯示和操作裝置進(jìn)行組織、簡(jiǎn)化、統(tǒng)一，使界面更加協(xié)調(diào)和易于理解，從而方便用戶操作，提高人機(jī)系統(tǒng)效率。

關(guān)鍵詞：格式塔? 心理學(xué)? 產(chǎn)品? 人機(jī)界面設(shè)計(jì)? 視覺(jué)系統(tǒng)? 知覺(jué)結(jié)構(gòu)

中圖分類號(hào)：TB47 ? ?文獻(xiàn)標(biāo)識(shí)碼：A 文章編號(hào)：1672-3791（2020）02（a）-0005-04

Abstract： Study the application of Gestalt psychology in product human-machine interface design.The 5 principles of proximity， similarity， closure， continuity and symmetry in Gestalt psychology are analyzed by different human-machine interface design cases.The proximity principle and the similarity principle are related to the tendency of trying to group the objects. The closed principle and the continuity principle are related to the tendency to try to give the object a complete form. And the symmetry principle is related to the attempt to simplify the figure to make it conform to the human visual habits. The Gestalt principle allows the information on the interface to be presented in groups and in a complete way. It helps designers to understand the visual rules of human beings， to grasp the perception structure of things on the whole， and to organize， simplify and unify the display and operation devices in the design of the human-machine interface， so that the interface is more coordinated and easy to understand， so as to facilitate user operation and improve the efficiency of human-machine system.

Key Words： Gestalt; psychology; Product; human-machine interface design; Visual system; perceptual structure

產(chǎn)品界面是用戶與產(chǎn)品之間傳遞和交互信息的媒介，因此，產(chǎn)品人機(jī)界面的交互設(shè)計(jì)直接關(guān)系到產(chǎn)品設(shè)計(jì)的成功與否[1]。誕生于1912年的格式塔心理學(xué)又被稱為“完形心理學(xué)”[2]，它強(qiáng)調(diào)經(jīng)驗(yàn)與行為的整體統(tǒng)一，其核心是給不完整的視覺(jué)信息尋找最簡(jiǎn)單直接的解讀辦法。目前，格式塔心理學(xué)在產(chǎn)品軟件界面設(shè)計(jì)方面的應(yīng)用較為廣泛，如移動(dòng)UI設(shè)計(jì)、PPT設(shè)計(jì)、標(biāo)志設(shè)計(jì)等。該研究旨在將格式塔心理學(xué)中的幾個(gè)經(jīng)典原則與產(chǎn)品人機(jī)界面設(shè)計(jì)相結(jié)合，探討其在產(chǎn)品易用性方面的價(jià)值，讓用戶體驗(yàn)簡(jiǎn)單、和諧、友好、自然的界面。

1? 格式塔心理學(xué)在產(chǎn)品人機(jī)界面設(shè)計(jì)中的應(yīng)用研究

格式塔心理學(xué)基于知覺(jué)判斷層面的5個(gè)基本原則是：接近性原則、相似性原則、閉合性原則、連續(xù)性原則、對(duì)稱性原則[3]。以下通過(guò)案例進(jìn)行具體分析。

1.1 接近性原則

所謂接近性原則，就是指“相比較而言，彼此之間距離較近的物體會(huì)比距離較遠(yuǎn)的物體看起來(lái)更有關(guān)聯(lián)，更容易被當(dāng)成一個(gè)整體”[4]。如圖1所示，各星形的形狀和大小完全一致，但在人的視知覺(jué)中，距離較近而且平行的星形會(huì)自然成為一個(gè)整體，因此用戶會(huì)認(rèn)為左圖中的星形排成了三行，而右圖中的星形則排成了三列。

接近性原則的實(shí)例如圖2所示，在圖2左側(cè)所示的空調(diào)遙控器設(shè)計(jì)中，調(diào)節(jié)空調(diào)溫度高低的功能分別用印有“+”“-”符號(hào)的三角形按鈕來(lái)實(shí)現(xiàn)，兩個(gè)按鈕之間有一定距離，而且“+”“-”的布置也與人的認(rèn)知特性不相符合，無(wú)疑會(huì)給使用者帶來(lái)諸多不便。而圖2右側(cè)所示的空調(diào)遙控器，其溫度設(shè)定功能由一組連接在一起、其上印有左右箭頭的按鈕來(lái)實(shí)現(xiàn)，功能類似的按鈕放置在一起，且其箭頭布置符合人的認(rèn)知規(guī)律，因此操作起來(lái)自然方便快捷。

如上所述，在產(chǎn)品人機(jī)界面設(shè)計(jì)中要表現(xiàn)某物和某物之間是否有關(guān)聯(lián)時(shí)，距離是非常重要的。大多數(shù)情況下，將功能類似的界面放在一起，將功能不同的界面分開一定距離，這樣的產(chǎn)品人機(jī)界面使用起來(lái)會(huì)更加方便和人性化。

1.2 相似性原則

所謂相似性原則，就是指“帶有共同特征的圖形，比如形狀相同、顏色相同、指向相同等，容易被認(rèn)為是一類的”[4]。如圖3中，各色塊的分布距離一致，但因形狀和顏色的不同，在視覺(jué)上明顯被分成了4組圖形。

圖4中所示為某數(shù)控機(jī)床操作面板的局部布置圖，在該面板的設(shè)計(jì)中，字母鍵與0～9數(shù)字鍵分別用了不同的形狀和顏色，清晰易辨，一目了然，給操作帶來(lái)極大的方便。同樣，面板右下方4個(gè)一組的箭頭鍵也用形狀和顏色與周圍按鈕區(qū)分開來(lái)。此即相似性原則在產(chǎn)品人機(jī)界面設(shè)計(jì)中的典型應(yīng)用。

由此可知，如果一個(gè)界面中若干個(gè)操作對(duì)象的形狀、顏色、結(jié)構(gòu)特征相類似時(shí)，用戶就會(huì)把它們看作一類能滿足同一個(gè)任務(wù)需求的組件。設(shè)計(jì)人員要讓用戶能夠快速有效地區(qū)分不同功能的操作對(duì)象，就需要為不同的操作對(duì)象設(shè)定獨(dú)特的形狀、顏色和結(jié)構(gòu)特征。

1.3 閉合性原則

所謂閉合性原則，就是指“由于某個(gè)圖形而形成的封閉空間有助于一個(gè)整體的組成”[4]。人的視知覺(jué)整體性決定了人的視覺(jué)系統(tǒng)能將敞開的圖形閉合，并感知為完整形象而不是分散的碎片。閉合性原則簡(jiǎn)要圖示見圖5，圖形由 3個(gè)不完整的圓形組成，3個(gè)圓形中間留有空白，但是人的視覺(jué)系統(tǒng)會(huì)將空白自動(dòng)補(bǔ)全為一個(gè)白色三角形。同時(shí)視覺(jué)系統(tǒng)也會(huì)自動(dòng)判斷，認(rèn)為圓形被三角形擋住了一部分，而不是本身就不完整。

圖6所示為某微波爐操作面板，在該面板上，在微波爐常用的12個(gè)功能模塊（如“牛奶/咖啡”“烤肉”等）的圖標(biāo)設(shè)計(jì)中，每個(gè)功能按鈕用一個(gè)圖標(biāo)、名稱，外加一個(gè)將其包圍起來(lái)的不完整的圓角矩形來(lái)表示，但由于人視知覺(jué)的整體性，在人感知這12個(gè)功能模塊時(shí)，在大腦中會(huì)自動(dòng)將每個(gè)不完整的圓角矩形彌補(bǔ)完整，如圖6右側(cè)圖中的紅色線框所示;同樣的設(shè)計(jì)還體現(xiàn)在面板下方的兩大功能模塊中。

1.4 連續(xù)性原則

所謂連續(xù)性原則，就是指“具有連續(xù)性的要素容易被認(rèn)為是一類的”[4]。在連續(xù)性圖形中，圖形的構(gòu)成成分沿著已經(jīng)明確的方向連續(xù)下去，形成對(duì)稱、平衡或延伸的運(yùn)動(dòng)軌跡。用戶的視覺(jué)具備一定的活動(dòng)慣性，傾向于看到連續(xù)的形式，必要時(shí)便會(huì)填補(bǔ)遺漏。如圖7所示的圖形中，兩條不同顏色的交叉斜線，盡管在中間被一個(gè)圓形所斷開，但由于其顏色方面的連續(xù)性，因此在知覺(jué)時(shí)還是會(huì)被感知為兩條完整的斜線。

連續(xù)性原則的典型應(yīng)用如圖8所示的汽車儀表盤，在該儀表盤設(shè)計(jì)中，考慮到車內(nèi)空間的局限以及人的視野特性，將汽車駕駛中常用的3個(gè)儀表“發(fā)動(dòng)機(jī)轉(zhuǎn)速表”“汽車速度表”“油位及溫度表”緊湊布置在一起，除了中間的汽車速度表是一個(gè)較為完整的圓形儀表外，兩側(cè)的“發(fā)動(dòng)機(jī)轉(zhuǎn)速表”和“油位及溫度表”的表盤則均為一個(gè)不完整的圓形儀表，看起來(lái)它們被中間的儀表遮擋住了一部分，但在連續(xù)性原則的作用下，人的知覺(jué)會(huì)自動(dòng)將其視為一個(gè)完整的圓形儀表，如圖8中的黃色圓形線框所示。采用連續(xù)性原則可以使產(chǎn)品的人機(jī)界面在視覺(jué)表現(xiàn)上更為簡(jiǎn)潔。

1.5 對(duì)稱性原則

對(duì)稱又稱“均齊”，是在統(tǒng)一中求變化。自然界中到處可見對(duì)稱的形式，如鳥類的羽翼、花木的葉子、人臉的五官等。對(duì)稱的圖形具有單純、簡(jiǎn)潔的美感以及靜態(tài)的安定感，對(duì)稱本身具有平衡感，對(duì)稱是平衡的最好體現(xiàn)，符合人們的視覺(jué)習(xí)慣。

在現(xiàn)實(shí)生活中，用戶的視覺(jué)區(qū)域中不止有一個(gè)可能的解析，但用戶通常更傾向于分解復(fù)雜的場(chǎng)景來(lái)降低復(fù)雜度，用戶的視覺(jué)系統(tǒng)會(huì)自動(dòng)組織并解析數(shù)據(jù)，從而簡(jiǎn)化這些數(shù)據(jù)并賦予它們對(duì)稱的屬性。如圖9所示，左圖復(fù)雜的形狀會(huì)被用戶看成是右圖中兩個(gè)疊加的菱形，而不是兩個(gè)頂部對(duì)接的“L”形或一個(gè)小菱形在中間的八邊形。這是由于用戶的視覺(jué)系統(tǒng)認(rèn)為一對(duì)疊加的菱形比其他兩種解釋更對(duì)稱、簡(jiǎn)單和更容易理解。

圖10所示為某電視遙控器，該遙控器的設(shè)計(jì)擺脫了傳統(tǒng)電視遙控器按鍵設(shè)計(jì)的繁文縟節(jié)及名目繁多，而是異常簡(jiǎn)約。僅有的5組共7個(gè)按鍵布局采用了以圖中紅色豎線為中心的左右對(duì)稱結(jié)構(gòu)，給人以簡(jiǎn)潔、均衡、穩(wěn)定的視覺(jué)美感和極為人性化的操作體驗(yàn)。

2? 結(jié)語(yǔ)

格式塔心理學(xué)展示了人的視覺(jué)系統(tǒng)是如何被優(yōu)化從而感知結(jié)構(gòu)的。視覺(jué)系統(tǒng)通過(guò)主動(dòng)對(duì)所處環(huán)境中的視覺(jué)信息構(gòu)建結(jié)構(gòu)，從而讓人更快地了解物體和事件。

在以上案例分析中，可以明顯感受到格式塔心理學(xué)的5條原則并非獨(dú)立存在，而是互相作用和影響。接近性原則和相似性原則與試圖給對(duì)象分組的傾向相關(guān);閉合性原則和連續(xù)性原則與試圖給對(duì)象完整形態(tài)的傾向相關(guān);而對(duì)稱性原則與試圖簡(jiǎn)化圖形使其符合人的視覺(jué)習(xí)慣相關(guān)。格式塔原理讓界面上的信息以分組和完整的方式呈現(xiàn)。因此，設(shè)計(jì)師在進(jìn)行產(chǎn)品人機(jī)界面設(shè)計(jì)的過(guò)程中，在感性上注重視覺(jué)效果的同時(shí)，理性上能夠按照格式塔原則組織結(jié)構(gòu)，那么用戶就會(huì)更容易獲取相應(yīng)的顯示和操作信息，從而更加快速、高效、準(zhǔn)確地完成人機(jī)交互過(guò)程，提高人機(jī)系統(tǒng)效率。

參考文獻(xiàn)

[1] Jacob，Robert JK.Elements of next-generation non-WIMP user interfaces[A].Description on Graphics Interface，2001[C].2001：235.

[2] 商榮華.格式塔美學(xué)原理在現(xiàn)代版式設(shè)計(jì)中的應(yīng)用[J].文藝爭(zhēng)鳴，2017（2）：204-208.

[3] 楊煥.智能手機(jī)移動(dòng)互聯(lián)網(wǎng)應(yīng)用的界面設(shè)計(jì)研究[D].武漢理工大學(xué)，2013.

[4] （日）中村聰史，著.搞砸了的設(shè)計(jì)[M].鄔佳笑，譯.北京：人民郵電出版社，2016.