格式塔心理與界面設(shè)計(jì)

1、 格式塔心理與界面設(shè)計(jì)格式塔心理與界面設(shè)計(jì) 主講教師主講教師 羅雙蘭羅雙蘭 v格式塔心理學(xué)格式塔心理學(xué) 觀看一些圖像，理解圖像視知覺(jué) 關(guān)于格式塔實(shí)驗(yàn)的對(duì)話 概念 基本觀點(diǎn) 格式塔心理學(xué)經(jīng)典實(shí)驗(yàn)：似動(dòng)現(xiàn)象 知覺(jué)組織原則 利用“格式塔”原理進(jìn)行界面設(shè)計(jì)的構(gòu)圖 遠(yuǎn)景可以提供物體大小的線索 v格式塔心理學(xué)實(shí)驗(yàn)對(duì)話格式塔心理學(xué)實(shí)驗(yàn)對(duì)話 v主持實(shí)驗(yàn)的心理學(xué)家請(qǐng)你描述你在桌上看到的東主持實(shí)驗(yàn)的心理學(xué)家請(qǐng)你描述你在桌上看到的東 西。西。 v網(wǎng)絡(luò)教育應(yīng)用首頁(yè)的界面設(shè)計(jì)分析網(wǎng)絡(luò)教育應(yīng)用首頁(yè)的界面設(shè)計(jì)分析 你能看出圖中的橫線是平行的嗎？你能看出圖中的橫線是平行的嗎？ 格式塔心理學(xué)格式塔心理學(xué) v以以Gestalt為

2、名的格式塔心理學(xué)也稱(chēng)為名的格式塔心理學(xué)也稱(chēng)”完完 形形“心理學(xué)（心理學(xué)（Gestalt psychology）于）于 20世紀(jì)初發(fā)源于歐洲，它主要是在研究人世紀(jì)初發(fā)源于歐洲，它主要是在研究人 類(lèi)知覺(jué)與意識(shí)上的問(wèn)題。類(lèi)知覺(jué)與意識(shí)上的問(wèn)題。 v格式塔心理學(xué)起始于視覺(jué)領(lǐng)域的研究，但格式塔心理學(xué)起始于視覺(jué)領(lǐng)域的研究，但 它又不限于視覺(jué)領(lǐng)域，甚至不限于整個(gè)感它又不限于視覺(jué)領(lǐng)域，甚至不限于整個(gè)感 覺(jué)領(lǐng)域，其應(yīng)用范圍包括學(xué)習(xí)、回憶、志覺(jué)領(lǐng)域，其應(yīng)用范圍包括學(xué)習(xí)、回憶、志 向、情緒、思維、運(yùn)動(dòng)等等過(guò)程。向、情緒、思維、運(yùn)動(dòng)等等過(guò)程。 格式塔心理學(xué)格式塔心理學(xué) vGestalt這個(gè)字源自德文，它有兩種涵義：這個(gè)

3、字源自德文，它有兩種涵義： 一指形狀或形式，亦即物體的性質(zhì)，例 如，用“有角的”或“對(duì)稱(chēng)的”這樣一 些術(shù)語(yǔ)來(lái)表示物體的一般性質(zhì)，以示三 角形的一些特性意指三角形的概念。 指一個(gè)具體的實(shí)體和它具有一種特殊形 狀或形式的特征，例如，“有角的”或 “對(duì)稱(chēng)的”是指具體的三角形物體的屬 性之一。 格式塔心理學(xué)格式塔心理學(xué) v格式塔心理學(xué)反對(duì)心理學(xué)中的格式塔心理學(xué)反對(duì)心理學(xué)中的元素主義元素主義,認(rèn)為心理認(rèn)為心理 元素的分析并不能使我們了解整體的心理現(xiàn)象元素的分析并不能使我們了解整體的心理現(xiàn)象,所所 以它主張以整體的觀點(diǎn)來(lái)描述意識(shí)與行為以它主張以整體的觀點(diǎn)來(lái)描述意識(shí)與行為. 似動(dòng)現(xiàn)象的研究與格式塔心理學(xué)的建

4、立似動(dòng)現(xiàn)象的研究與格式塔心理學(xué)的建立 v似動(dòng)現(xiàn)象似動(dòng)現(xiàn)象是一種運(yùn)動(dòng)知覺(jué)。是一種運(yùn)動(dòng)知覺(jué)。20世紀(jì)初期，心理學(xué)世紀(jì)初期，心理學(xué) 對(duì)運(yùn)動(dòng)知覺(jué)的研究進(jìn)展極為緩慢。原因是當(dāng)時(shí)的對(duì)運(yùn)動(dòng)知覺(jué)的研究進(jìn)展極為緩慢。原因是當(dāng)時(shí)的 心理學(xué)家皆以感覺(jué)的組合解釋知覺(jué)，而由于運(yùn)動(dòng)心理學(xué)家皆以感覺(jué)的組合解釋知覺(jué)，而由于運(yùn)動(dòng) 知覺(jué)涉及一系列感覺(jué)，很難把運(yùn)動(dòng)知覺(jué)分析為感知覺(jué)涉及一系列感覺(jué)，很難把運(yùn)動(dòng)知覺(jué)分析為感 覺(jué)成分覺(jué)成分. v1910年，惠特海默在火車(chē)上的旅途中突然想到年，惠特海默在火車(chē)上的旅途中突然想到 了一種研究視覺(jué)的運(yùn)動(dòng)知覺(jué)的方法了一種研究視覺(jué)的運(yùn)動(dòng)知覺(jué)的方法. 格式塔心理現(xiàn)象研究：似動(dòng)現(xiàn)象格式塔心理現(xiàn)象研究：似動(dòng)

5、現(xiàn)象 v惠特海默是以速示器來(lái)做實(shí)驗(yàn)的。這種速示器可惠特海默是以速示器來(lái)做實(shí)驗(yàn)的。這種速示器可 控制不同的時(shí)間間隔，把兩條角度不同的光亮的控制不同的時(shí)間間隔，把兩條角度不同的光亮的 直線投射到黑色的背景上直線投射到黑色的背景上. v觀看似動(dòng)現(xiàn)象動(dòng)畫(huà)觀看似動(dòng)現(xiàn)象動(dòng)畫(huà) v 相繼呈現(xiàn)一條垂直相繼呈現(xiàn)一條垂直(a)和一條水平（和一條水平（b）的發(fā)亮線段）的發(fā)亮線段 v 改變兩條線段呈現(xiàn)的改變兩條線段呈現(xiàn)的時(shí)距時(shí)距,并測(cè)量對(duì)它們的知覺(jué)經(jīng)驗(yàn)。并測(cè)量對(duì)它們的知覺(jué)經(jīng)驗(yàn)。 v 結(jié)果：結(jié)果： 當(dāng)兩條線段的時(shí)距短于30毫秒時(shí)，看到a、b同時(shí)出現(xiàn)； 當(dāng)時(shí)距長(zhǎng)于200毫秒時(shí)，看到a、b先后出現(xiàn)； 當(dāng)時(shí)距約為60毫秒時(shí)，看

6、到線段從a向b運(yùn)動(dòng)。 v 韋特海默解釋說(shuō)，當(dāng)視網(wǎng)膜受到兩條線段的刺激后韋特海默解釋說(shuō)，當(dāng)視網(wǎng)膜受到兩條線段的刺激后,會(huì)引會(huì)引 起皮層相應(yīng)區(qū)域的興奮。在適當(dāng)?shù)臅r(shí)空條件下，這兩個(gè)興起皮層相應(yīng)區(qū)域的興奮。在適當(dāng)?shù)臅r(shí)空條件下，這兩個(gè)興 奮回路之間發(fā)生融合，形成短路，因而得到運(yùn)動(dòng)的印象。奮回路之間發(fā)生融合，形成短路，因而得到運(yùn)動(dòng)的印象。 v物體運(yùn)動(dòng)的速度太慢或太快，都不能使人物體運(yùn)動(dòng)的速度太慢或太快，都不能使人 產(chǎn)生運(yùn)動(dòng)知覺(jué)。產(chǎn)生運(yùn)動(dòng)知覺(jué)。 v例如：人們不能覺(jué)察手表上時(shí)針的運(yùn)動(dòng)。例如：人們不能覺(jué)察手表上時(shí)針的運(yùn)動(dòng)。 v物體運(yùn)動(dòng)的速度超過(guò)一定限度，人們就看物體運(yùn)動(dòng)的速度超過(guò)一定限度，人們就看 到彌漫性的閃

7、爍。到彌漫性的閃爍。 v 似動(dòng)主要依賴(lài)于似動(dòng)主要依賴(lài)于刺激物的強(qiáng)度、時(shí)間間隔、空間距離、刺激物的強(qiáng)度、時(shí)間間隔、空間距離、視視 野中有無(wú)參照點(diǎn)、對(duì)象離觀察者的距離等。野中有無(wú)參照點(diǎn)、對(duì)象離觀察者的距離等。 這些物理參數(shù)的相互關(guān)系可以用科爾特定律來(lái)表示：這些物理參數(shù)的相互關(guān)系可以用科爾特定律來(lái)表示： v 當(dāng)刺激間的時(shí)距不變時(shí)，產(chǎn)生最佳運(yùn)動(dòng)的刺激強(qiáng)度和空當(dāng)刺激間的時(shí)距不變時(shí)，產(chǎn)生最佳運(yùn)動(dòng)的刺激強(qiáng)度和空 間距離成正比；間距離成正比； 當(dāng)空間距離恒定時(shí)，刺激物的強(qiáng)度與時(shí)距成反比；當(dāng)空間距離恒定時(shí)，刺激物的強(qiáng)度與時(shí)距成反比； 當(dāng)強(qiáng)度不變時(shí)，時(shí)距與空間距離成正比。當(dāng)強(qiáng)度不變時(shí)，時(shí)距與空間距離成正比。 蒙娜

8、麗莎微笑之謎蒙娜麗莎微笑之謎 格式塔心理學(xué)與電影、動(dòng)畫(huà)原理格式塔心理學(xué)與電影、動(dòng)畫(huà)原理 v動(dòng)畫(huà)原理、電影原理動(dòng)畫(huà)原理、電影原理-似動(dòng)現(xiàn)象（不是真正的似動(dòng)現(xiàn)象（不是真正的 位移）位移） v格式塔心理學(xué)家們對(duì)似動(dòng)與真正運(yùn)動(dòng)的關(guān)系、似格式塔心理學(xué)家們對(duì)似動(dòng)與真正運(yùn)動(dòng)的關(guān)系、似 動(dòng)的機(jī)制、似動(dòng)中圖形因素與運(yùn)動(dòng)因素的相互關(guān)動(dòng)的機(jī)制、似動(dòng)中圖形因素與運(yùn)動(dòng)因素的相互關(guān) 系、似動(dòng)的深度效應(yīng)等等，開(kāi)展了大量的研究工系、似動(dòng)的深度效應(yīng)等等，開(kāi)展了大量的研究工 作作 。 v以格式塔的以格式塔的“整體構(gòu)成整體構(gòu)成”原理解釋影像的似動(dòng)現(xiàn)原理解釋影像的似動(dòng)現(xiàn) 象和深度感的幻覺(jué)，認(rèn)為似動(dòng)現(xiàn)象和深度感不僅象和深度感的幻覺(jué)，認(rèn)

9、為似動(dòng)現(xiàn)象和深度感不僅 產(chǎn)生于生理的視覺(jué)暫留現(xiàn)象，而且依賴(lài)于把影像產(chǎn)生于生理的視覺(jué)暫留現(xiàn)象，而且依賴(lài)于把影像 組織成更高層次的動(dòng)作整體的組織成更高層次的動(dòng)作整體的“特殊的內(nèi)心體特殊的內(nèi)心體 驗(yàn)驗(yàn)”“完形完形”過(guò)程，是大腦的積極參與過(guò)程，是大腦的積極參與“添添 加給靜止影像加給靜止影像”的結(jié)果。的結(jié)果。 v格式塔中的視覺(jué)關(guān)系格式塔中的視覺(jué)關(guān)系 v和諧 v變化 v沖突 v混亂 形狀、大小、顏色趨近一致，并且排列有序 和諧來(lái)自所有局部的感官接近 和諧基礎(chǔ)上局部的外觀(形狀、大小、顏色)改變， 但這種變化沒(méi)有改變所有局部的同一性質(zhì) 在“和諧”的基礎(chǔ)上,局部不僅僅產(chǎn)生了形狀、大小、顏色 的“變化”，而且

10、產(chǎn)生了性質(zhì)上的改變，與整體中的其他局 部“格格不入”。 整體當(dāng)中包含太多性質(zhì)不相關(guān)的局部，視覺(jué)系統(tǒng)很難判斷出整 體到底是什么，這個(gè)時(shí)候就產(chǎn)生了“混亂”。 格式塔的知覺(jué)組織原則格式塔的知覺(jué)組織原則 v我們可以組織知覺(jué)世界的規(guī)則我們可以組織知覺(jué)世界的規(guī)則 v1.1.類(lèi)似原則類(lèi)似原則: : 類(lèi)似的部分傾向于被一起知覺(jué)為一組類(lèi)似的部分傾向于被一起知覺(jué)為一組. . v2.2.簡(jiǎn)單原則簡(jiǎn)單原則 盡可能地把圖形知覺(jué)為好的圖形盡可能地把圖形知覺(jué)為好的圖形. .格式塔心理學(xué)家格式塔心理學(xué)家 稱(chēng)之為完好形式稱(chēng)之為完好形式. .一個(gè)好的格式塔是對(duì)稱(chēng)的一個(gè)好的格式塔是對(duì)稱(chēng)的, ,簡(jiǎn)單簡(jiǎn)單 的和穩(wěn)定的的和穩(wěn)定的, ,已

11、經(jīng)不可能再簡(jiǎn)單已經(jīng)不可能再簡(jiǎn)單, ,再整齊再整齊 . . v3.3.接近原則接近原則 在時(shí)間或空間上緊密在一起的部分似乎是相屬的在時(shí)間或空間上緊密在一起的部分似乎是相屬的, , 傾向于被知覺(jué)在一起傾向于被知覺(jué)在一起. . 格式塔的知覺(jué)組織原則格式塔的知覺(jué)組織原則 v 4.4.連續(xù)原則連續(xù)原則 我們的知覺(jué)有追隨一個(gè)方向的傾向我們的知覺(jué)有追隨一個(gè)方向的傾向, ,以便把元素聯(lián)接在一以便把元素聯(lián)接在一 起起, ,使它們看起來(lái)是連續(xù)的使它們看起來(lái)是連續(xù)的, ,或者向著一個(gè)特定的方向或者向著一個(gè)特定的方向. . v 5.5.封閉原則封閉原則 我們的知覺(jué)有一種完成不完善圖形我們的知覺(jué)有一種完成不完善圖形,

12、,填補(bǔ)缺口的傾向填補(bǔ)缺口的傾向. . v 6.6.圖形和背景圖形和背景 我們傾向于把知覺(jué)組織成被觀察的對(duì)象我們傾向于把知覺(jué)組織成被觀察的對(duì)象( (圖形圖形) )和對(duì)象賴(lài)以和對(duì)象賴(lài)以 產(chǎn)生的背景產(chǎn)生的背景. .圖形似乎更加實(shí)在圖形似乎更加實(shí)在, ,從背景中凸現(xiàn)出來(lái)從背景中凸現(xiàn)出來(lái). . 類(lèi)似原則類(lèi)似原則 接近原則接近原則 接近原則接近原則 接近原則接近原則 90o 270o 180o 360o 90o 270o 180o 360o 接近原則接近原則 相似原則相似原則 相似原則相似原則 相似原則相似原則 相似原則相似原則 閉合原則閉合原則 連續(xù)原則連續(xù)原則 利用利用“格式塔格式塔”原理進(jìn)行構(gòu)圖原理

13、進(jìn)行構(gòu)圖 v刪除刪除 大眾汽車(chē)廣告，使用了元素刪除 明確哪些內(nèi)容 和關(guān)鍵文本是 必須保留 采用簡(jiǎn)約風(fēng)格 v貼近貼近 歸類(lèi) 有條理 不擁擠 讓人感覺(jué)通透 使用輔助線和柵格系 統(tǒng)對(duì)復(fù)雜的設(shè)計(jì)元素 進(jìn)行分類(lèi)，最后達(dá)到 視覺(jué)的統(tǒng)一。 v結(jié)合：結(jié)合： 將單獨(dú)的視覺(jué)單元完全聯(lián)合在一起，無(wú)將單獨(dú)的視覺(jué)單元完全聯(lián)合在一起，無(wú) 法分開(kāi)。使原來(lái)并不相干的視覺(jué)形象自然而然地法分開(kāi)。使原來(lái)并不相干的視覺(jué)形象自然而然地 關(guān)聯(lián)起來(lái)。關(guān)聯(lián)起來(lái)。 異形同構(gòu)：把兩種或幾種不同的視覺(jué)形象結(jié)合在一起，在視覺(jué) 表達(dá)上自然而然地從一個(gè)視覺(jué)語(yǔ)義延伸到另一個(gè)視覺(jué)語(yǔ)義。 只要你用，就一定會(huì)翹 v接觸接觸:指單獨(dú)的視覺(jué)單元無(wú)限貼近，以至于它們

14、彼指單獨(dú)的視覺(jué)單元無(wú)限貼近，以至于它們彼 此粘連。在視覺(jué)上就形成了一個(gè)較大的、統(tǒng)一的此粘連。在視覺(jué)上就形成了一個(gè)較大的、統(tǒng)一的 整體。接觸的形體有可能喪失原先單獨(dú)的個(gè)性，整體。接觸的形體有可能喪失原先單獨(dú)的個(gè)性， 變得性格模糊。變得性格模糊。 濺落的飲料與杯子接觸，融合為一個(gè)視覺(jué)整體 接觸與結(jié)合的區(qū)別是：接觸的兩個(gè)視覺(jué)單元仍然是相對(duì) 獨(dú)立的，而結(jié)合的兩個(gè)視覺(jué)單元再也無(wú)法分開(kāi)。 v重合：所有的視覺(jué)單元在重合：所有的視覺(jué)單元在色調(diào)或紋理色調(diào)或紋理等方面都是等方面都是 不同的不同的，那么，那么，區(qū)分區(qū)分已被聯(lián)結(jié)的原來(lái)各個(gè)視覺(jué)單已被聯(lián)結(jié)的原來(lái)各個(gè)視覺(jué)單 元就越元就越容易容易;相反，如果所有的視覺(jué)單元在

15、色調(diào)或相反，如果所有的視覺(jué)單元在色調(diào)或 紋理等方面都是一樣的，那么，原來(lái)各個(gè)視覺(jué)單紋理等方面都是一樣的，那么，原來(lái)各個(gè)視覺(jué)單 元的元的輪廓線就會(huì)消失輪廓線就會(huì)消失，從而形成一個(gè)單一的重合，從而形成一個(gè)單一的重合 的形狀。的形狀。 絕對(duì)伏特加的廣告，將品牌與各種事物進(jìn)行了視覺(jué)重合 v絕對(duì)伏特加的廣告欣賞 v“格調(diào)格調(diào)”與與“紋理紋理”：由大量重復(fù)的單元構(gòu)成的。：由大量重復(fù)的單元構(gòu)成的。 兩者的主要區(qū)別在于視覺(jué)單元的兩者的主要區(qū)別在于視覺(jué)單元的大小或規(guī)模大小或規(guī)模，除，除 此之外，它們基本上是一樣的。此之外，它們基本上是一樣的。 v透過(guò)窗戶(hù)看到不遠(yuǎn)處的樹(shù)林透過(guò)窗戶(hù)看到不遠(yuǎn)處的樹(shù)林-格調(diào)格調(diào) v在飛

16、機(jī)上俯覽一整片樹(shù)林在飛機(jī)上俯覽一整片樹(shù)林-紋理紋理 “初夏的楊樹(shù)林” 這種紋理叫做“瀕海紅樹(shù)林” v閉合：把局部形象當(dāng)作一個(gè)整體的形象來(lái)感知。閉合：把局部形象當(dāng)作一個(gè)整體的形象來(lái)感知。 這種知覺(jué)上的特殊現(xiàn)象。這種知覺(jué)上的特殊現(xiàn)象。 “閉合”就是不在視場(chǎng)中展現(xiàn)設(shè)計(jì)的全貌，而只給關(guān)鍵的局 部，讓人們通過(guò)完形去延伸和理解整體，比如“一葉知秋” v計(jì)白當(dāng)黑：空白與實(shí)體的對(duì)比，黑白對(duì)比計(jì)白當(dāng)黑：空白與實(shí)體的對(duì)比，黑白對(duì)比 v留白：留白：“虛實(shí)相生，無(wú)畫(huà)處皆成絕妙虛實(shí)相生，無(wú)畫(huà)處皆成絕妙” v “密不透風(fēng)，疏可跑馬密不透風(fēng)，疏可跑馬” v “畫(huà)留三分空，生氣隨之發(fā)畫(huà)留三分空，生氣隨之發(fā)” v空空 不等于不

17、等于 真空真空 通用電氣的網(wǎng)站截圖 寒江獨(dú)釣圖 v排列排列:將構(gòu)圖中過(guò)多的視覺(jué)單元進(jìn)行歸整的一種方法。將構(gòu)圖中過(guò)多的視覺(jué)單元進(jìn)行歸整的一種方法。 v 形式形式:整列法、格柵法整列法、格柵法 v 整列，可簡(jiǎn)單地解釋為整列，可簡(jiǎn)單地解釋為“對(duì)齊對(duì)齊”。 v 兩種整列類(lèi)型：實(shí)際上的整列、視覺(jué)上的整列。兩種整列類(lèi)型：實(shí)際上的整列、視覺(jué)上的整列。 v 視覺(jué)整列的例證：書(shū)中的文字，文字段落實(shí)際上就是由一視覺(jué)整列的例證：書(shū)中的文字，文字段落實(shí)際上就是由一 些并不存在的共同線進(jìn)行了整列的。些并不存在的共同線進(jìn)行了整列的。 v 格式塔閉合原理，貼近原理造成的。格式塔閉合原理，貼近原理造成的。 v 實(shí)際上的整列：

18、存在著實(shí)際的對(duì)齊線。比如，圖文之間的實(shí)際上的整列：存在著實(shí)際的對(duì)齊線。比如，圖文之間的 對(duì)位排列。對(duì)位排列。 v柵格法柵格法 v 當(dāng)一個(gè)現(xiàn)成的格式塔中用到兩個(gè)或更多的交叉當(dāng)一個(gè)現(xiàn)成的格式塔中用到兩個(gè)或更多的交叉 整列時(shí)，就會(huì)出現(xiàn)一種柵格劃分，將版面分為若整列時(shí)，就會(huì)出現(xiàn)一種柵格劃分，將版面分為若 干塊干塊 v歸類(lèi)歸類(lèi):當(dāng)構(gòu)圖中各個(gè)視覺(jué)單元具有共同的特征時(shí)，它們當(dāng)構(gòu)圖中各個(gè)視覺(jué)單元具有共同的特征時(shí)，它們 就顯示出一種視覺(jué)歸類(lèi)的趨向，這種視覺(jué)簡(jiǎn)化法也稱(chēng)為相就顯示出一種視覺(jué)歸類(lèi)的趨向，這種視覺(jué)簡(jiǎn)化法也稱(chēng)為相 似歸類(lèi)。似歸類(lèi)。 v 大小歸類(lèi)：當(dāng)單獨(dú)的視覺(jué)單元顯得大小相似時(shí)，看起大小歸類(lèi)：當(dāng)單獨(dú)的視覺(jué)單元顯得大小相似時(shí)，看起 來(lái)就同屬一類(lèi)。這時(shí)，就很容易