第二章-視覺感知與視覺通道(感知與認(rèn)知)資料講解

視覺感知(gǎnzhī)與認(rèn)知主講人：劉天亮liutl@TEL京(nánjīnɡ)郵電大學(xué)圖像處理與圖像通信江蘇省重點(diǎn)實(shí)驗(yàn)室第一頁，共94頁。大綱(dàgāng)視覺感知認(rèn)知視覺通道(tōngdào)*色彩第二頁，共94頁。2.1.1感知與認(rèn)知(rènzhī)的定義第三頁，共94頁?！癡isualizationisreallyaboutexternalcognition,thatis,howresourcesoutsidethemindcanbeusedtoboostthecognitivecapabilitiesofthemind.”StuartCard可視化致力于外部認(rèn)知，也就是說，怎樣利用(lìyòng)大腦以外的資源來增強(qiáng)大腦本身的認(rèn)知能力。第四頁，共94頁。感知(gǎnzhī)： 關(guān)于輸入信號(hào)的本質(zhì)； 看見的東西認(rèn)知： 關(guān)于怎樣理解和解釋看到的東西什么(shénme)是認(rèn)知？第五頁，共94頁。圖中找動(dòng)物：認(rèn)知(rènzhī)依賴于觀察者的先驗(yàn)知識(shí)RangerRick:,ca.1980sCourtesyofTerryYoo/RossWhitacker

第六頁，共94頁。什么(shénme)是視覺感知？第七頁，共94頁。 是指客觀事物(kèɡuānshìwù)通過人的感覺器官在人腦中形成的直接反映 眼、耳、鼻、神經(jīng)末梢 就是客觀事物(kèɡuānshìwù)通過人的視覺在人腦中形成的直接反映視覺(shìjué)感知感知

感覺器官(gǎnjuéqìguān)那么，視覺感知第八頁，共94頁。認(rèn)知 認(rèn)知心理學(xué)將認(rèn)知過程看成由信息的獲取、分析、歸納、解碼、儲(chǔ)存、概念形成、提取和使用等一系列階段組成的按一定程序進(jìn)行(jìnxíng)的信息加工系統(tǒng) 科學(xué)領(lǐng)域中，認(rèn)知是包含注意力、記憶、產(chǎn)生和理解語言、解決問題，以及進(jìn)行(jìnxíng)決策的心理過程的組合。第九頁，共94頁。認(rèn)知認(rèn)知(rènzhī)依賴于先驗(yàn)！這是一張臉嗎？人腦先驗(yàn)地假設(shè)了這是一張臉，從而形成(xíngchéng)了一個(gè)bias（偏差、錯(cuò)覺）（實(shí)際生活中你可能已經(jīng)看過billion量級的臉了?。。┑谑?，共94頁。認(rèn)知認(rèn)知(rènzhī)依賴于先驗(yàn)！這是一張臉嗎？人腦先驗(yàn)地假設(shè)(jiǎshè)了這是一張臉，從而形成了一個(gè)bias（偏差、錯(cuò)覺）（實(shí)際生活中你可能已經(jīng)看過billion量級的臉了?。。┑谑豁摚?4頁。2.1.2格式(géshi)塔理論第十二頁，共94頁。WolgangK?hler1887-1967KurtKoffka1886-1941MaxWertheimer1880-1943為什么我們在觀看事物的時(shí)候(shíhou)會(huì)把一部分當(dāng)做前景，其余部分當(dāng)做背景？為什么我們(wǒmen)能區(qū)分形狀？什么(shénme)形狀是好的？第十三頁，共94頁。 結(jié)構(gòu)比元素重要，視覺形象首先作為統(tǒng)一的整體被認(rèn)知(rènzhī) 原則（蘊(yùn)涵律） 接近性（proximity） 相似性（similarity） 連續(xù)性（continuity） 閉合性（closure） 簡單性（simplicity）格式(géshi)塔（gestalt）原則假設(shè)視覺感知是一個(gè)整體(zhěngtǐ)的過程并且人類傾向于感知簡單的幾何圖形空間距離上的相似性第十四頁，共94頁。 結(jié)構(gòu)比元素重要，視覺形象首先作為統(tǒng)一的整體被認(rèn)知(rènzhī) 原則（蘊(yùn)涵律） 接近性（proximity） 相似性（similarity） 連續(xù)性（continuity） 閉合性（closure） 簡單性（simplicity）格式(géshi)塔（gestalt）原則根據(jù)事物屬性（形狀、顏色、光照或其他性質(zhì)(xìngzhì)）上的相似性進(jìn)行感知分組。第十五頁，共94頁。 結(jié)構(gòu)比元素重要，視覺形象首先作為統(tǒng)一的整體被認(rèn)知 原則（蘊(yùn)涵(yùnhán)律） 接近性（proximity） 相似性（similarity） 連續(xù)性（continuity） 閉合性（closure） 簡單性（simplicity）格式(géshi)塔（gestalt）原則很自然(zìrán)地沿著物體的邊界，將不連續(xù)的物體事物連續(xù)的整體第十六頁，共94頁。 結(jié)構(gòu)比元素重要，視覺形象首先(shǒuxiān)作為統(tǒng)一的整體被認(rèn)知 原則（蘊(yùn)涵律） 接近性（proximity） 相似性（similarity） 連續(xù)性（continuity） 閉合性（closure） 簡單性（simplicity）格式(géshi)塔（gestalt）原則只要物體(wùtǐ)的形狀足以表征物體(wùtǐ)本身，就容易感知整個(gè)物體(wùtǐ)而忽視未閉合的特征第十七頁，共94頁。 結(jié)構(gòu)比元素重要，視覺形象首先作為統(tǒng)一的整體被認(rèn)知 原則（蘊(yùn)涵(yùnhán)律） 接近性（proximity） 相似性（similarity） 連續(xù)性（continuity） 閉合性（closure） 簡單性（simplicity）格式(géshi)塔（gestalt）原則人類傾向(qīngxiàng)于感知簡單的幾何圖形第十八頁，共94頁。 結(jié)構(gòu)比元素重要，視覺形象(xíngxiàng)首先作為統(tǒng)一的整體被認(rèn)知 原則（蘊(yùn)涵律） 共勢原則（commonfate） 好圖原則（similarity） 對稱原則（symmetry） 經(jīng)驗(yàn)原則（pastexperience）格式(géshi)塔（gestalt）原則從一堆(yīduī)字符中認(rèn)知語句一組物體具有沿著相似的光滑路徑運(yùn)動(dòng)趨勢或具有相似的排列模式時(shí)，將被識(shí)別為同一類物體第十九頁，共94頁。 結(jié)構(gòu)比元素重要，視覺形象首先作為統(tǒng)一的整體被認(rèn)知 原則(yuánzé)（蘊(yùn)涵律） 接共勢原則(yuánzé)（commonfate） 好圖原則(yuánzé)（similarity） 對稱原則(yuánzé)（symmetry） 經(jīng)驗(yàn)原則(yuánzé)（pastexperience）格式(géshi)塔（gestalt）原則對五環(huán)形狀的兩種識(shí)別(shíbié)。上：奧運(yùn)環(huán)；下:割裂的圓環(huán)。個(gè)體識(shí)別世界時(shí)，通常會(huì)消除復(fù)雜性和不熟悉性，并采納最簡化的形式第二十頁，共94頁。 結(jié)構(gòu)比元素重要，視覺(shìjué)形象首先作為統(tǒng)一的整體被認(rèn)知 原則（蘊(yùn)涵律） 接共勢原則（commonfate） 好圖原則（similarity） 對稱原則（symmetry） 經(jīng)驗(yàn)原則（pastexperience）格式(géshi)塔（gestalt）原則按照男女將年齡分布數(shù)據(jù)對稱排列(páiliè)，增強(qiáng)數(shù)據(jù)的可讀性第二十一頁，共94頁。 結(jié)構(gòu)比元素重要(zhòngyào)，視覺形象首先作為統(tǒng)一的整體被認(rèn)知 原則（蘊(yùn)涵律） 接共勢原則（commonfate） 好圖原則（similarity） 對稱原則（symmetry） 經(jīng)驗(yàn)原則（pastexperience）格式(géshi)塔（gestalt）原則某些情況(qíngkuàng)下視覺感知與過去的經(jīng)驗(yàn)有關(guān)第二十二頁，共94頁。2.1.3視覺(shìjué)感知的相對性&絕對性

感知系統(tǒng)(xìtǒng)基于相對判斷，而非絕對判斷(Weber’sLaw)無線框未對齊(duìqí)有線框未對齊ABAB

AB無線框A和B那一個(gè)更高？第二十三頁，共94頁。相對性&絕對性

感知(gǎnzhī)系統(tǒng)基于相對判斷，而非絕對判斷(Weber’sLaw)A和B哪一個(gè)(yīɡè)更亮？第二十四頁，共94頁。視覺(shìjué)感知第二十五頁，共94頁。視覺(shìjué)感知第二十六頁，共94頁。相對性&絕對性

感知系統(tǒng)基于相對(xiāngduì)判斷，而非絕對判斷(Weber‘sLaw)A和B哪一個(gè)(yīɡè)更亮？第二十七頁，共94頁。相對性&絕對性

感知系統(tǒng)(xìtǒng)基于相對判斷，而非絕對判斷(Weber‘sLaw)顏色(yánsè)？第二十八頁，共94頁。相對性&絕對性

感知(gǎnzhī)系統(tǒng)基于相對判斷，而非絕對判斷(Weber‘sLaw)顏色(yánsè)？第二十九頁，共94頁。2.2視覺(shìjué)通道*2.2.1視覺通道(tōngdào)的類型2.2.2視覺通道(tōngdào)的表現(xiàn)力和有效性第三十頁，共94頁。2.2.1視覺(shìjué)通道的類型空間標(biāo)記位置尺寸(chǐcun)顏色亮度飽和度色調(diào)(sèdiào)配色方案透明度方向形狀紋理動(dòng)畫第三十一頁，共94頁。色彩第三十二頁，共94頁。光譜(guāngpǔ)第三十三頁，共94頁。第三十四頁，共94頁。什么(shénme)是基色？紅綠藍(lán)（RGB）紅黃藍(lán)橙，綠，紫羅蘭青，品紅(pǐnhóng)，黃，黑（CMYK）以上所有第三十五頁，共94頁。加色法系統(tǒng)(xìtǒng)（RGB）GreenBlueRedCyanMagentaYellow第三十六頁，共94頁。減色法系統(tǒng)(xìtǒng)（CMYK）MagentaGreenBlueRedCyanYellow(Black)第三十七頁，共94頁。減色法系統(tǒng)(xìtǒng)（RYB）第三十八頁，共94頁。顏色(yánsè)空間第三十九頁，共94頁。RGB顏色(yánsè)空間 可被顯示器表達(dá)(biǎodá)的顏色 感知上不均勻C.Ware,“VisualThinkingforDesign”第四十頁，共94頁。HSL顏色(yánsè)空間色調(diào)（Hue） –人類認(rèn)為的顏色飽和度（Saturation） –純度(chúndù)，與灰色的距離亮度（Lightness） –從黑色到亮色感知上不均勻C.Ware,“VisualThinkingforDesign”非常適合用于編碼(biānmǎ)分類的數(shù)據(jù)屬性；亮度適合編碼有序的數(shù)據(jù)；第四十一頁，共94頁。大塊區(qū)域內(nèi)（如背景），建議使用低飽和度的顏色(yánsè)填充；小塊區(qū)域建議使用更亮的飽和度高的顏色(yánsè)填充，以保證其容易被用戶辨識(shí)。第四十二頁，共94頁。Lab顏色(yánsè)空間 感知(gǎnzhī)上均勻分布 L用來近似人類對亮度的感知(gǎnzhī) a,b用來近似“紅/綠”和“黃/藍(lán)”通道第四十三頁，共94頁。Lab顏色(yánsè)空間亮度(liàngdù)、發(fā)光度第四十四頁，共94頁。色盲第四十五頁，共94頁。色盲紅色盲（Protanope）綠色(lǜsè)盲（Deuteranope）藍(lán)色盲（Tritanope）無L錐形細(xì)胞(xìbāo)無M錐形細(xì)胞(xìbāo)無S錐形細(xì)胞紅/綠色盲藍(lán)/黃色盲第四十六頁，共94頁。色盲(sèmáng)正常(zhèngcháng)紅色盲綠色(lǜsè)盲全色盲BasedonslidefromStone第四十七頁，共94頁。第四十八頁，共94頁。原圖(yuántú)綠色(lǜsè)盲第四十九頁，共94頁。BasedonslidefromStone第五十頁，共94頁。BasedonslidefromStone第五十一頁，共94頁。2.2.2視覺通道(tōngdào)的特點(diǎn)視覺通道的類型將決定可視化不同的數(shù)據(jù)是可能采用的視覺通道定性的視覺通道，適合編碼分類的數(shù)據(jù)信息(xìnxī)；例如，形狀、顏色的色調(diào)或空間位置第五十二頁，共94頁。2.2.2視覺(shìjué)通道的特點(diǎn)定量或定序的視覺通道，適合編碼有序的或數(shù)值型的數(shù)據(jù)信息；例如，直線長度(chángdù)、區(qū)域面積、空間體積、斜度、角度、顏色的飽和度和亮度第五十三頁，共94頁。2.2.2視覺通道(tōngdào)的特點(diǎn)分組的視覺通道，則適合將存在互相聯(lián)系的分類的數(shù)據(jù)屬性(shǔxìng)進(jìn)行分組，從而表現(xiàn)數(shù)據(jù)的內(nèi)在關(guān)聯(lián)性。分組通常是指多個(gè)或多種標(biāo)記的組合模式。辨認(rèn)分組最基本的通道是接近性，根據(jù)格式塔原則，人類的感知系統(tǒng)可以自動(dòng)地將互相接近的對象理解為屬于同一組。第五十四頁，共94頁。表現(xiàn)力和有效性表現(xiàn)力和有效性，將指導(dǎo)可視化設(shè)計(jì)者如何挑選(tiāoxuǎn)合適的視覺通道，實(shí)現(xiàn)對數(shù)據(jù)信息完整而具有目的性的展現(xiàn)。表現(xiàn)力 視覺通道的表現(xiàn)力要求視覺通道準(zhǔn)確編碼數(shù)據(jù)包含的所有信息。即 視覺通道在對數(shù)據(jù)進(jìn)行編碼的時(shí)候，需要盡量忠于原始數(shù)據(jù)有效性 通道表現(xiàn)力符合屬性的重要性第五十五頁，共94頁。視覺通道(tōngdào)的表現(xiàn)力判斷標(biāo)準(zhǔn)精確性：用于衡量人類感知系統(tǒng)對于可視化的判斷結(jié)果和原始數(shù)據(jù)的吻合程度可辨性：區(qū)分具有不同取值范圍的視覺(shìjué)通道的兩種或多種取值狀態(tài)可分離性：視覺(shìjué)突出第五十六頁，共94頁。?對于可視化結(jié)果，人們更傾向于優(yōu)先閱讀標(biāo)題、文本(wénběn)、標(biāo)簽。?盡可能將標(biāo)題置于左上角，并使文字說明盡可能接近對應(yīng)的可視化結(jié)果。結(jié)論(jiélùn)1第五十七頁，共94頁。觀察(guānchá)物體的變化需要集中注意力在可視化中突出變化，以減輕認(rèn)知(rènzhī)負(fù)擔(dān)結(jié)論(jiélùn)盡可能地?cái)U(kuò)大視覺要素間的差異以使它們更加清晰。盡量少使用雜亂的紋理，它很容易將讀者的注意力轉(zhuǎn)移到紋理（所產(chǎn)生的大量邊緣）上而忽略了視覺要素本身。

第五十八頁，共94頁。人類視覺系統(tǒng)觀察的是變化，而不是絕對值，并且容易(róngyì)被邊界吸引。在不同物體間使用高對比度使得(shǐde)物體更容易區(qū)分。結(jié)論(jiélùn)2第五十九頁，共94頁。?使用(shǐyòng)“亮度”產(chǎn)生對比優(yōu)先于使用(shǐyòng)“色彩”對比(duìbǐ)效果第六十頁，共94頁。西班牙的分區(qū)失業(yè)率增長率情況(qíngkuàng)——使用亮度產(chǎn)生對比的優(yōu)秀實(shí)例對比(duìbǐ)效果第六十一頁，共94頁。網(wǎng)格對于對比度的影響(yǐngxiǎng)。左圖是更好的方案。對比(duìbǐ)效果第六十二頁，共94頁。一個(gè)沒有對比度、效果不好(bùhǎo)的實(shí)例對比(duìbǐ)效果第六十三頁，共94頁。圖樣(túyàng)的實(shí)例，突出重點(diǎn)對比(duìbǐ)效果第六十四頁，共94頁。缺少(quēshǎo)對比/重點(diǎn)對比(duìbǐ)效果第六十五頁，共94頁。重點(diǎn)(zhòngdiǎn)突出，效果更好！對比(duìbǐ)效果第六十六頁，共94頁。?讓用戶的視線聚焦在可視化結(jié)果中最重要的部分。?提供給用戶有層次的可視化結(jié)果，幫助用戶找到正確的閱讀(yuèdú)可視化結(jié)果的方法。結(jié)論(jiélùn)2第六十七頁，共94頁。視覺(shìjué)感知第六十八頁，共94頁。人腦先驗(yàn)地假設(shè)(jiǎshè)了這里有一個(gè)圓，其實(shí)：…第六十九頁，共94頁。 記憶在人類認(rèn)知過程中起著至關(guān)重要的因素，但工作記憶容量(róngliàng)十分有限。

可視化可以作為(zuòwéi)幫助增強(qiáng)工作記憶的工具結(jié)論(jiélùn)1第七十頁，共94頁。掃

視！RonRensink2002?實(shí)際上，我們獲取周圍的完整影像所依靠的則是掃視（saccades），它并受不人的主動(dòng)控制。

?依賴于眼球周期(zhōuqī)為20-100ms/次的移動(dòng)，我們可以獲得10-50FPS的影像。?但如果我們想將注意力集中在某一事物上，這通常會(huì)消耗200-600ms，才能集中注意力。第七十一頁，共94頁。眼動(dòng)（Eyetracking）實(shí)驗(yàn)(shíyàn)受試者觀察這一圖表，而眼動(dòng)跟蹤(gēnzōng)設(shè)備則嘗試找出人眼注意的焦點(diǎn)。第七十二頁，共94頁。圖中每一個(gè)圈代表著一次聚焦。圈的大小表示人眼聚焦在上面(shàngmiɑn)的時(shí)間長短。顏色代表先后順序（暖色調(diào)在前，冷色調(diào)在后）。第七十三頁，共94頁。多個(gè)(duōɡè)受試者的熱力圖第七十四頁，共94頁。餅圖的中心(zhōngxīn)并不受注視第七十五頁，共94頁。視覺焦點(diǎn)集中在：中心(zhōngxīn)，標(biāo)簽，圖例第七十六頁，共94頁。有多少(duōshǎo)黑點(diǎn) 交叉點(diǎn)上的黑色圓點(diǎn)在跳躍(tiàoyuè)變化移動(dòng)視點(diǎn)(shìdiǎn)，看到的黑色斑點(diǎn)位置也隨之變化第七十七頁，共94頁。對比(duìbǐ)第七十八頁，共94頁。Shepard’sRotatedTable第七十九頁，共94頁。人類視覺系統(tǒng)觀察的是變化，而不是(bùshi)絕對值，并且容易被邊界吸引。在不同物體間使用高對比度使得(shǐde)物體更容易區(qū)分。結(jié)論(jiélùn)我們的視覺系統(tǒng)對差異而非絕對值更加敏感，更容易被差異較大的邊緣吸引。

第八十頁，共94頁。眼見(yǎnjiàn)不為實(shí)第八十一頁，共94頁?！安豢赡?kěnéng)的盒子”埃斯切爾的不可能的盒子：比利時(shí)藝術(shù)家馬瑟·黑梅克，從荷蘭平面造型藝術(shù)家M.C.的一幅畫中吸取靈感，創(chuàng)造(chuàngzào)了一個(gè)不可能存在的盒子的實(shí)物模型。第八十二頁，共94頁。瘋狂(fēngkuáng)的螺母你知道直鋼棒是怎樣神奇地穿過這兩個(gè)看似乎成直角的螺帽孔的嗎？兩個(gè)螺帽實(shí)際是中空的，雖然它們看起來是凸面的，所以兩個(gè)螺帽并不互相垂直(chuízhí)。螺帽被下方光源照到（一般光線應(yīng)來自上方）