基于知覺流暢性的動態圖形時空運動設計研究

高瞻 李振宇

摘? 要：在動態圖形時空運動設計中，知覺流暢性越高，動態圖形設計的認知效率越快，同時也容易獲得輕松愉悅的審美體驗。動態圖形設計需要分析受眾對空間表達的過往經驗，減少感知過程中的認知盲區，同時還要明確設計群體需求，并伴隨社會審美導向、流行風格及社會人群知識程度的變化而變化，從而達到提升知覺流暢性與審美體驗的目的。

關鍵詞：知覺流暢性；信息加工；動態圖形設計；圖形時空運動

基金項目：本文系江南大學2021年本科教育教學改革研究項目（JG2021175）；江蘇藝術基金2022年度資助項目（202202103648）研究成果。

一、引言

新媒體技術的高速發展將視覺傳達設計引入新時代，視覺設計無論是靜態還是動態，都更加注重受眾的認知效率與審美體驗，追求信息接收效率與視覺感受的雙重流暢。動態圖形作為傳遞信息流載體，多維表現使圖形具有時空運動特征，在觀看時會產生潛在的知覺流暢性差異，并進一步影響傳播實效和對美的評價。知覺是認知的基礎，認知是知覺的結果，知覺是多重感覺的綜合。因此，從知覺流暢性理論出發研究動態圖形設計，可以更好地幫助設計師串聯知覺輸入與認知輸出，即動態圖形設計意圖與設計成效的關系，還可搭配恰當的構造組合，激發受眾更佳的審美體驗。

二、知覺流暢性與動態圖形設計

（一）知覺流暢性概念

在感知審美和設計對象時，一個中心中介因素是知覺流暢性[1]。知覺流暢性通常被定義為處理感知信息的輕松或速度的主觀體驗[2]。動物行為學者艾伯爾·艾比斯菲爾德認為，美的對象既不會太復雜，也不會太簡單，美的模式應該是在知覺方面更有效率、更能減輕記憶負擔的模式[3]。知覺流暢性屬于審美加工體驗過程中的初級階段。感知越流暢，審美反應就越積極，美存在于觀者的加工經驗中，加工經驗在某種程度上是客觀刺激屬性和感知者主觀刺激相遇的歷史函數[4]。

感覺同知覺結合在一起構成感知，感知是對感覺進行處理，認知是對感知進行處理[5]。知覺流暢性高的信息線索相較于流暢性低的信息線索認知程度更高[6]。通常知覺流暢性受到觀者主觀心理與過往知覺經驗的影響，其信息感知及認知流暢性也不同。知覺流暢性會影響認知加工時間，從而改變認知效率與審美體驗。

因此，動態圖形的知覺流暢性評價與認知信息的效率，以及審美認知之間存在著重要的聯系。

（二）動態圖形設計概念

動態圖形是指應用動畫及影視的創作方法與手段，以視聽綜合的方式，對文字、圖形、圖像、色彩等圖形元素進行動態演繹，以達到信息傳播、形象塑造與情感表達的目的[7]。在動態圖形設計中，靜幀圖形是圖形的本體設計，圖形時空運動設計是圖形靜幀間的關系設計。靜幀間的關系依賴于動態圖形各要素的聯系，不同要素變化會引發不同的感覺，不同的感覺綜合起來會影響整體的知覺感受。

（三）動態圖形設計與流暢性審美

動態圖形設計的審美策略隨著多領域科技的發展，以及自身創作工具的技術進步，逐漸向流暢性轉型。近年來相關研究表明：一方面，逐幀動畫連續快速播放追求平滑連接，關鍵幀圖形運動調節曲線追求細膩的速度變化等，直接提升圖形信息流暢閱讀，從而提升知覺流暢度；另一方面，動力學及運動學仿真運動追求運動細節的質感，動作捕捉運動更加追求流暢逼真的轉換效果。結合仿生原理，配合觀者過往知覺經驗提升知覺流暢性。美的運動形式是相對于前后幀的運動而言的，搭配適當且具有基因記憶的圖形運動，知覺更容易被喚醒。計算機編程視覺追求新穎的運動方式等，創造流暢的體驗貫穿于動態圖形的整體設計中，它是多維度、多感官、多元素間的平衡統一，是創造多重韻律美感的聯結紐帶。運動方式和知覺感受關聯，能帶來流暢感的圖形運動方式是技術美與藝術美的和諧統一。

由此可見，現階段動態圖形設計相關藝術形式、設計技術等研究與知覺流暢性關聯密切。此研究對動態圖形認知效率提升、優化審美體驗等具有重要意義。

三、知覺流暢性與信息加工流程

知覺流暢性與審美體驗的信息加工模型相關，它是指審美過程中涉及的心理機制。包括感知、內隱記憶整合、外顯分類、認知解釋和評價。其中感知、內隱記憶整合、外顯分類是自動加工過程。感知過程處理顏色、視覺對比度、復雜性、對稱性、分組和順序等，內隱記憶整合過程主要依賴知覺經驗，熟悉性和原型性都是在這個階段產生影響；外顯分類過程主要處理內容和風格，此階段比較依賴藝術專業知識；認知解釋與評價階段，是基于認知的審美判斷[8]。

綜合上述內容，內隱記憶整合階段更側重對呈現的內容進行回憶，外顯分類階段主要根據藝術經驗對呈現的風格進行判斷，二者的加工過程均與知覺經驗相關聯。在動態圖形設計中，內容與風格是不可分割的，內容決定風格傾向，風格影響內容識別。因此，本研究將兩個階段整合，便于分析知覺經驗與知覺流暢度之間的聯系。同時，動態圖形知覺流暢度的效果評價，包括對認知效果的評價，也包括整個信息加工流暢的評價，如圖1。

四、感知與動態圖形時空運動

人們天生具有喜歡關注動態變化事物的心理，人的視覺對于動起來的圖形具有主動和優先關注的傾向。圖形作為運動圖形的基本元素，其形態變化、大小變化、顏色變化、亮度變化、肌理變化、位置變化都會影響運動的方式。圖形在空間及時間變化中，其運動方式與運動方向是影響視覺信息量的主要因素。感知信息數量的多少會直接影響知覺流暢度的高低。

轉場是動態圖形設計的重要組成部分，它引導著畫面空間的切換。空間切換的方式多元，二維、三維、多維等維度切換，以及旋轉、拉伸、拼貼等表現手法的切換，直接影響了知覺流暢度的高低，認知效率的快慢。

圖形的短時呈現，會起到將信息壓縮或省略的效果，反之圖形緩動長時呈現則起到強調信息的作用。圖形呈現時間對信息的關注程度產生影響，進一步對知覺流暢度的高低產生影響。時間是動態圖形感知邏輯的重要體現。

因此，動態圖形的知覺流暢度研究是一個多維度協同問題，也是一個時間與空間相結合的時空運動問題。

（一）運動趨勢整體性

在相同時間頻率下顏色變化的感知要比物體運動快，顏色引導形式（方向）為40ms，運動方向為80ms[9]。知覺流暢性的衡量標準之一為速度，快速變色比快速位移感覺更快。視覺對比與重復相比更具有審美吸引力[10]。顏色變化可以用于協調整體運動方向，增加視覺對比度能夠使運動主體更加清晰，促進加工速度，提升審美效果。

圖2中，a、b、c表現為汽車駛入隧道、隧道內燈光掠過的遠景片段，持續時間約4秒。d、e、f表現為車前立體標志光影變化的近景片段，持續時間約8秒。g、h、i表現為人駕駛汽車，光照在人背后的近景片段，持續時間約2秒。

汽車、立體標志、人均位于畫面中央，相對于背景呈靜止狀態。背景色塊從中間向周圍進行變色移動，呈快速擴散狀態，暗示汽車正快速運動。圖形運動整體性較強，知覺特征明顯。主要體現在：其一，當主體形態與色彩相對靜止，背景形態與色彩快速運動時，運動速度反差大，主體與背景分離清晰，對運動對象與環境的認知加工更為輕松迅速。其二，對稱運動使畫面更加整體，對稱使信息減半，知覺加工難度降低。其三，肌理運動增加光感表現細節，多對象營造光掃過汽車的氣氛，速度感與光感特點明顯。

因此，圖形運動趨勢的整體性，需要構圖、色彩、細節等多方協調，使運動趨勢統一。可通過增加畫面對稱、提升圖-底對比度、添加肌理運動共同強化，協調運動形式與運動方向，提升知覺流暢性，使受眾對描繪的場景進行有效的快速認知。

（二）焦點轉換連續性

動態圖形設計根據敘事需求，常需要進行空間轉換，它既是動態圖形設計的亮點也是難點。空間轉換通常是由轉場運動實現的，轉場時的運動通常比較強烈，人的視線容易被吸引。焦點的構圖位置及運動狀態影響人的視線跟蹤。視線跟蹤連續的焦點運動較為省力，常借助載體實現。

圖3中，a、b、c表現為俯視到平視的空間轉換。d、e、f表現為三維向二維再向三維的空間轉換。g、h、i表現為屏外向屏內的空間轉換。圖形空間轉換流暢，主要體現在：其一，借助電子屏載體實現二維與三維間轉換，載體較為熟知，鏡頭切換順暢；其二，借助旋轉的鏡頭運動使周圍空間不斷轉變，但焦點始終保持在畫面中心，空間銜接自然。

因此，圖形空間焦點轉換的連續性，可通過調整焦點與環境空間的運動對比進行強化，注重轉場載體的合理性，提升畫面的流暢度，使受眾快速進入對轉變空間的認知狀態。

圖4中，a表現為墻正視空間。b表現為四面墻俯視空間。c表現為小偷與墻共存空間。d表現為兩墻拐角空間。e表現為警察與群眾共存空間。f表現為墻內外空間。g表現為墻角空間特寫。h表現為小偷與警察同一空間。i表現為墻正視的特寫。人與墻均位于畫面中心，做順時針或逆時針運動，具有一定規律性。人的運動用于敘事表述，墻的運動用于空間分隔轉場。人與墻的運動范圍相對穩定，認知加工較為輕松。

因此，當動線和轉場在空間方向上近似時，力的方向較為統一，視覺注意力較為集中，對焦點鎖定更加省力，有利于運動中心的追蹤連續，具有規律性的美感。同時規律的轉場方式提供了認知線索，有助于對劇情的推理與理解。

（三）線索層級邏輯性

動態圖形的時間屬性導致圖形表現是轉瞬即逝的，時間推移導致新信息出現，舊信息消失。受眾需要聯系之前與之后圖形呈現的變化，尋找信息線索。這時受眾的瞬時記憶發揮關鍵作用，它的形成是通過感覺器官對外部刺激反應，瞬時記憶保持時間一般在0.25～2s[11]。出場順序與層級，時間的邏輯線決定了思考與反應時間。

圖5中，a、b、c表現為基礎元素的平面旋轉運動。d、e、f表現為局部與整體空間推拉運動。g、h、i表現為橫向平移運動。圖形的時間層級劃分明顯，感知視覺運動與理解信息含義均較為輕松。主要體現在：其一，信息層級劃分清晰，分為元素演化層級、文化藝術展現層級和標志性建筑展現層級三個主體部分。以畫面中心為視覺焦點，三個層級采用不同的運動方式，較為清晰地傳達了信息層次。其二，不同的信息層次，輔助線條與圖形運動方式保持一致，旋轉選用曲線，平移選用直線。輔助速度線有助于運動方向的感知，降低知覺加工成本。

因此，加強圖形線索層級邏輯性，區分信息段落，調整同一層級視覺屬性及輔助元素，進行動效聯動，使受眾對信息層次的認知更為準確。增強的秩序感有利于信息的加工，提升知覺流暢感。

五、內隱記憶、外顯分類與動態圖形

動態圖形設計需要根據知覺經驗定位內容風格。知覺經驗的來源包括人類進化的固有基因、個人受地域文化影響的風俗習慣、自然環境的生活常識等。

原型被認為是針對某種類別的綜合性表征， 基于該類別所屬事物之間最相似的特征，原型性高的對象通常具有該類別較多的共同特征，并且會引發更高的知覺流暢性[12]。原型性由經驗積累慢慢形成，例如鳥類動物間最相似的特征是可以飛翔，具有鳥類一般性和相似性的飛翔動態，就具有較高的原型性。在動態圖形設計中，即使是抽象的幾何圖形，具象的運動表達融合原型性較強的運動特征后，也可以感覺到鳥類在飛翔。

與人類運動相關的知覺經驗具有普適性，較易激發聯想。研究發現，通過動態可視化學習人類運動技能信息，并不會造成較大認知負擔，非人類運動技能知識可能需要擴展認知努力[13]。具有與自然的、類人運動一致的視覺特征線條畫易引發審美偏好并與更高的感知流暢度相關[14]。簡單的幾何圖形賦予活力的運動模式，可以傳達社交接觸的印象[15]。加工具有人類運動特征的圖形動態難度較小，對骨骼動勢具有基因記憶，抽象幾何圖形融入具象人類圖形運動，通過動態表述降低了靜態抽象圖形的理解難度，有助于感知流暢，更容易受到觀者的青睞。

圖6中，a、b、c表現為抽象幾何人奔跑場景，持續3秒。頭由眼睛放大指代，軀干為錐狀幾何形，四肢為長方形。人物整體造型寫意抽象，但奔跑姿態較為具象，整體融合較為自然。d、e、f表現為幾何面部橫向運動，持續8秒。人對面部意象通常優先關注，眼睛較易成為引導運動的視覺焦點，眼球方向的轉動與圖形整體運動方向表現一致，信息加工相對容易，知覺較為流暢。g表現為抽象幾何人正面，耳朵由喇叭指代、鼻子由線條表述、眼睛與嘴唇為概括的幾何形。h表現為重復的正面嘴唇，位于畫面中心。i表現為抽象幾何人正側面結合，增加側面眼睛與嘴唇。從正面到側面的疊加過程中，共持續5秒，通過重復嘴唇轉場，人的視覺注意力集中在嘴唇，使側面嘴唇的出現自然過渡。此短片整體采用抽象圖形語言，內容表述具象，受眾多為愛好爵士樂、設計等藝術相關人士。此類傳達方式易發揮較強的審美吸引力。

因此，通過知覺經驗定位內容風格，針對不同的藝術專業人士，可選擇不同的藝術風格，有助于獲得更高的審美評價。

運用動態圖形演示品牌標志形象，激活品牌活力已成為一種廣泛趨勢，流暢自然的圖形運動，可以為企業傳遞良好親和的形象。圖7中，a表現為居家場景，人物碰杯出現清水材質的感嘆號。b表現為海邊場景，人物擊掌出現海水材質的感嘆號。c表現為結冰質感的標志，浮于水面。d表現為白日頂樓的場景。e表現為綠色的標志動態。f表現為夜晚樓房的場景，感嘆號向上旋轉用于轉場引出標志。g表現為車站場景，標志融入站牌。h表現為花房場景，花香與感嘆號同構。i表現為林中小屋場景，炊煙與感嘆號的同構。

版面中心也是視覺中心，字體位置應配合背景，同時美化版面，遮蓋版面中的不協調因素[16]。感嘆號是OLIFE標志的主要元素，位于畫面中心，在短片中反復出現，在不同場景中以相似質感融入環境。采用感嘆號旋轉的轉場方式，多次曝光加深知覺印象，可以增強對品牌符號的熟悉感。此品牌廣告面向大眾，對場景的塑造多為還原再現，畫面場景與心理場景接近時，熟悉感使知覺更加流暢，有利于品牌理念的傳播。

因此，當通過知覺經驗定位內容風格時，針對非藝術專業人士，這種和現實貼近的藝術風格，有助于獲得更佳的審美體驗。

六、結語

在動態圖形設計中，復雜性高的刺激導致知覺流暢性低，因為加工復雜的刺激更費力。同一時間段內，圖形運動數量少、運動方向有秩序、主體與背景運動對比強、重復的運動方式會降低復雜性。復雜性影響核心信息的分辨難度，從而影響知覺流暢性。當圖形運動數量多或動勢大時，需要降低復雜度，可通過增加對稱、減緩速度、減少數量等方法加強整體性，提升秩序感。當圖形運動數量少或動勢小時，增加細節量如填充變色運動和肌理運動等，有利于豐富畫面細節，增強運動感。亮度變化同樣可以增加運動細節，如霓虹燈原位閃爍。力的方向與數量不統一會帶來分散感，需要調整運動方向的趨同性以及變化方向的規律性，加強運動趨勢的整體性。降低單位時間內的圖形在時間與空間動態的復雜度，有利于提高知覺流暢性。

知覺加工往往是刺激引導，進行“自下而上”加工；認知加工可以由注意引導，進行“自上而下”加工。在動態圖形設計中，重復的圖形運動會引起“自下而上”的加工，反復出現有利于加深知覺印象，降低承載信息的加工難度，可以提高知覺流暢性。顯著的刺激有利于吸引視覺注意，引發“自上而下”的認知加工，可在多次重復的刺激后放入重要的信息，有利于提升認知效率。

因此，在動態圖形設計中，影響知覺流暢性的因素主要為復雜度、原型性，包括與圖形視覺相關的圖形-背景對比、對稱性、信息量，還包括與圖形知覺經驗相關的的重復性、原型性等。動態圖形設計需要分析受眾對空間表達的過往經驗，減少感知過程中的認知盲區。對于藝術經驗較多的受眾可采用風格異化提升興趣，抽象及藝術風格明顯的圖形運動更易受到藝術專業人士關注。對于藝術經驗較少的受眾可利用寫實風格拉近距離，與現實貼近的運動風格更易產生聯想共鳴。

參考文獻：

[1]CHRISTENSEN BT，BALL LJ，REBER R.Perceptual Fluency Effects in Judgments of Creativity and Beauty：Creative Objects are Perceived Fluently Yet They Are Visually Complex[J].Journal of Cognitive Psychology，2020（1）：45—66.

[2]OPPENHEIMER DM，FRANK MC.A Rose in Any Other Font Would not Smell as Sweet：Effects of Perceptual Fluency on Catego—rization[J].Cognition，2008（3）：1179.

[3]箱田裕司， 都筑譽史， 川畑秀明，等.認知心理學[M].宋永寧，譯.上海：華東師范大學出版社，2013.

[4]REBER R，SCHWARZ N，WINKIELMAN P.Processing Fluency and Aesthetic Pleasure：Is Beauty in the Perceiver's Pro-cessing Experience？[J].Personality and Social Psychology Review，2004（4）：366， 381.

[5]聶珍釗.論人的認知與意識[J].浙江社會科學，2020（10）：91-100.

[6]陽長征.社交網絡用戶交互情景體驗對危機信息持續分享意愿影響研究[J].現代情報，2020（1）：79-90.

[7]周年國.動態圖形的設計與信息傳播特性解析[J].包裝工程，2017（22）：147-151.

[8]LEDER H，NADAL M.Ten Years of a Model of Aesthetic Appreciation and Aesthetic Judgments：Theaesthetic Epi-sode-Developments and Challenges in Empirical Aesthetics[J].British Journal of Psychology，2014，105：446-447.

[9]ZEKI S.A Massively Asynchronous，Parallel Brain[J]. Philosophical Transactions of the Royal Society B-Biological Sciences，2015（1668）：103.

[10]VOGEL T， SILVA RR， THOMAS A et al.Truth is in the Mind， but Beauty is in the Eye： Fluency Effects are Moderated by a Match between Fluency Source and Judgment Dimension[J].Journal of Experimental Psychology—General，2020（8）：1588.

[11]郝亞睿，雷斌，張源，等.基于行人認知規律的地鐵引導標識信息優化[J].交通信息與安全，2021（4）：99-107.

[12]孫山，青平，劉貝貝，等.創新型農產品的產品特質對消費者支付意愿的影響——以作物營養強化大米為例[J].農業現代化研究，2018（5）：743-750.

[13]PAAS F，SWELLER J.An Evolutionary Upgrade of Cognitive Load Theory：Using the Human Motor System and Collaboration to Support the Learning of Complex Cognitive Tasks[J].Educational Psychology Review，2012（1）：34.

[14]CHAMBERLAIN R，BERIO D，MAYER V etal. A Dot That Went For A Walk：People Prefer Lines Drawn With Human—Like Kinematics[J].British Journal of Psychology，2021（1）：105.

[15]SANTOS NS，KUZMANOVIC B，DAVID N et al.Animated Brain： A Functional Neuroimaging Study on Animacy Experience[J].Neuroimage，2010（1）：299.

[16]李振宇，高瞻.美術類書籍封面字體及版式設計研究[J].科技與出版，2018（9）：91-92.

作者簡介：

高瞻，江南大學設計學院碩士研究生。研究方向：視覺傳達設計。

李振宇，博士，江南大學設計學院副教授、碩士研究生導師。