動(dòng)態(tài)圖形的交互設(shè)計(jì)研究

楊樂(lè)萱

摘要：動(dòng)態(tài)圖形的交互設(shè)計(jì)不僅能為受眾提供愉快的感官體驗(yàn)，而且還能提升設(shè)計(jì)作品的藝術(shù)價(jià)值和競(jìng)爭(zhēng)力。本文首先闡述了動(dòng)態(tài)圖形及交互設(shè)計(jì)的概念，其次闡述了動(dòng)態(tài)圖形的交互設(shè)計(jì)意義，并總結(jié)歸納了動(dòng)態(tài)圖形的交互設(shè)計(jì)要素，最后提出了動(dòng)態(tài)圖形的交互設(shè)計(jì)原則。通過(guò)本文的研究，以期為動(dòng)態(tài)圖形的交互設(shè)計(jì)提供一定的思路。

關(guān)鍵詞：動(dòng)態(tài)圖形;交互設(shè)計(jì);要素;原則

中圖分類號(hào)：J524 文獻(xiàn)標(biāo)識(shí)碼：A

文章編碼：1672-7053（2021）04-0080-02

1 相關(guān)概念解析

1.1動(dòng)態(tài)圖形的概念

動(dòng)態(tài)圖形，英文“Motion Graphics”，“Motion”意為運(yùn)動(dòng)、移動(dòng)、動(dòng)態(tài)，“Graphics”意為圖形、圖案、圖畫等。廣義上來(lái)說(shuō)，動(dòng)態(tài)圖形包括字符、表格、LOGO、紋樣、插畫、影像等圖形化元素及其顏色和布局。這種視覺(jué)表現(xiàn)形式具有時(shí)效變化的屬性特征。動(dòng)態(tài)圖形是多領(lǐng)域融合的藝術(shù)表現(xiàn)形式，它需要平面設(shè)計(jì)的構(gòu)成語(yǔ)言、動(dòng)畫設(shè)計(jì)的影視美學(xué)、數(shù)字藝術(shù)的軟件操作技術(shù)等跨專業(yè)的知識(shí)支撐，因而在媒體領(lǐng)域普遍運(yùn)用，在信息傳遞中起到非常關(guān)鍵的作用。

1.2交互設(shè)計(jì)的概念

交互可以直譯為交流、互動(dòng)，是人、物相互之間交集而成的感知與情緒的改變。而交互設(shè)計(jì)就是針對(duì)人、物之間交流互動(dòng)的設(shè)計(jì)，從而達(dá)到交流和互動(dòng)更為流暢舒適的目的。交互設(shè)計(jì)形成的根本原因是人類具有“認(rèn)知摩擦”的特性，認(rèn)知摩擦概念由美國(guó)交互設(shè)計(jì)師 Alan Cooper 提出，他定義認(rèn)知摩擦為：“當(dāng)人類智力遭遇隨問(wèn)題變化而變化的復(fù)雜系統(tǒng)規(guī)則時(shí)遇到的阻力”，通常是產(chǎn)品設(shè)計(jì)不合理而產(chǎn)生的問(wèn)題。因?yàn)椴槐匾募夹g(shù)與功能應(yīng)用讓產(chǎn)品操作繁瑣、加重理解負(fù)擔(dān)，使用者難以利用感官判斷來(lái)掌握使用技巧，從而產(chǎn)生產(chǎn)品使用成本過(guò)高的不利影響。產(chǎn)品的根本屬性是為使用者提供服務(wù)，為了達(dá)到便于使用者感知、了解、使用產(chǎn)品的目標(biāo)，交互設(shè)計(jì)重點(diǎn)在于改進(jìn)不足，并最大限度地為使用者在產(chǎn)品的操作過(guò)程中提供舒適的情感體驗(yàn)。據(jù)此，交互設(shè)計(jì)的定義是指對(duì)產(chǎn)品的操作方式、執(zhí)行程序和內(nèi)容框架的設(shè)計(jì)，從而達(dá)到應(yīng)用的操作便利、理解便利并滿足使用者使用過(guò)程的心理需求。

2動(dòng)態(tài)圖形的交互設(shè)計(jì)意義

2.1提高圖形的表達(dá)性

現(xiàn)階段，在互聯(lián)網(wǎng)技術(shù)提升與新媒體深層應(yīng)用的時(shí)代背景下，動(dòng)態(tài)圖形的交互設(shè)計(jì)向多元綜合化趨勢(shì)發(fā)展。從設(shè)計(jì)原理的層面分析，動(dòng)態(tài)圖形的多樣化布局會(huì)呈現(xiàn)出多種視覺(jué)效果，將其動(dòng)態(tài)特征引入交互設(shè)計(jì)中時(shí)，能夠提升信息的傳達(dá)效率，即提高了圖形的表達(dá)性。

2.2增強(qiáng)受眾的體驗(yàn)感

在新的表達(dá)領(lǐng)域探索動(dòng)態(tài)圖形的交互設(shè)計(jì)，可以挖掘動(dòng)態(tài)圖形更大的體驗(yàn)空間。而從另外個(gè)一角度來(lái)說(shuō)，使用者在接受視覺(jué)信息時(shí)需要滿足一定的藝術(shù)審美需求，形成視覺(jué)和操作交互過(guò)程的體驗(yàn)。為此，以具有交互設(shè)計(jì)特征的動(dòng)態(tài)圖形，能夠增強(qiáng)受眾群體的體驗(yàn)感。

3動(dòng)態(tài)圖形的交互設(shè)計(jì)要素

3.1 圖形要素

以動(dòng)態(tài)圖形（字符、表格、LOGO、紋樣、插畫和影像等圖形元素）為基礎(chǔ)構(gòu)成交互設(shè)計(jì)要素。動(dòng)態(tài)圖形具有較強(qiáng)的傳遞信息功能，設(shè)計(jì)師可以通過(guò)合理的圖形設(shè)計(jì)指引人們進(jìn)行操作，提升交互界面的吸引力和視覺(jué)效果，降低人們操作難度。如字符類動(dòng)態(tài)圖形可以通過(guò)文本或圖文這兩種主要形式呈現(xiàn)。動(dòng)態(tài)文本可呈現(xiàn)較為細(xì)致的內(nèi)容，而圖文是指以字形為基礎(chǔ)與圖形結(jié)合的圖形化文字，在保證文字可讀性的同時(shí)進(jìn)行設(shè)計(jì)，以提高交互設(shè)計(jì)的藝術(shù)效果。

3.2色彩要素

色彩是動(dòng)態(tài)圖形的表層屬性，是可以直接作用于觀賞者大腦并產(chǎn)生本能反應(yīng)的設(shè)計(jì)元素。色彩最主要的作用是形成視覺(jué)效果，設(shè)計(jì)師通過(guò)對(duì)色彩設(shè)計(jì)強(qiáng)調(diào)設(shè)計(jì)主題、傳遞信息，并給予使用者操作提示，每種色彩都各具情緒表達(dá)和象征意義。如藍(lán)色象征成長(zhǎng)，代表鍥而不舍;紫色象征離別，代表憂郁悲傷;藍(lán)紫色象征友誼，代表溫柔關(guān)懷;黃色象征演變，代表生活力。

因此，色彩需要依據(jù)主題內(nèi)容進(jìn)行設(shè)計(jì)，從而在視覺(jué)層面向使用者準(zhǔn)確表達(dá)信息。

3.3動(dòng)態(tài)要素

動(dòng)態(tài)圖形實(shí)質(zhì)是使靜止圖像通過(guò)動(dòng)態(tài)設(shè)計(jì)成為能夠變化的圖形，使其更具活力，傳遞更豐富的信息。動(dòng)態(tài)圖形有五種基礎(chǔ)動(dòng)態(tài)方式：位移、縮放、旋轉(zhuǎn)、形變、色變。位移是指圖形沿指定軌道改變位置，進(jìn)行簡(jiǎn)潔而富有活力的動(dòng)態(tài)設(shè)計(jì)?？s放是指圖形按比例收縮或放大，以此強(qiáng)調(diào)內(nèi)容，引起使用者的注意。旋轉(zhuǎn)是指圖形圍繞某點(diǎn)靈活轉(zhuǎn)動(dòng)，進(jìn)而產(chǎn)生靈動(dòng)的視覺(jué)效果。形變是指物體形態(tài)在各種力的作用下產(chǎn)生壓縮、拉抻、扭轉(zhuǎn)、曲折等或規(guī)則或不規(guī)則的變形。規(guī)則變形具有一定規(guī)律屬性，動(dòng)態(tài)圖形利用規(guī)律模仿現(xiàn)實(shí)物體的物理特質(zhì)，更真實(shí)地模擬出物體在現(xiàn)實(shí)世界中的運(yùn)動(dòng)狀態(tài)。不規(guī)則變形則是不遵守物體形變規(guī)律，可以自由轉(zhuǎn)換形態(tài)，通常情況下設(shè)計(jì)師對(duì)不規(guī)則形變的設(shè)計(jì)有明確的主題內(nèi)容，通過(guò)有趣的變化為使用者加深印象。色變是指圖形通過(guò)改變顏色提高圖形的表達(dá)能力，使其更具內(nèi)涵性。

3.4布局要素

布局是把文本、圖形、顏色、動(dòng)態(tài)等組成要素經(jīng)過(guò)合適的設(shè)定進(jìn)行組織運(yùn)算，將設(shè)計(jì)內(nèi)容直接有序地進(jìn)行表達(dá)。只有合理的布局才能確保用戶在短時(shí)間內(nèi)快速接收信息并進(jìn)行操作。

4動(dòng)態(tài)圖形的交互設(shè)計(jì)原則

4.1 符合認(rèn)知邏輯原則

人對(duì)事物的認(rèn)知基于對(duì)客觀規(guī)律的探究與了解，而設(shè)計(jì)的過(guò)程是虛擬的，人們?cè)诮换ブ型ㄟ^(guò)虛擬體驗(yàn)現(xiàn)實(shí)，用現(xiàn)實(shí)映像對(duì)比激活感官記憶。

如：游戲中一些球類的動(dòng)態(tài)圖形正是依據(jù)部分現(xiàn)實(shí)物理運(yùn)動(dòng)規(guī)律進(jìn)行設(shè)計(jì)的。在游戲《最強(qiáng)彈一彈》中，彈球墜落速度由慢到快，碰撞后彈球運(yùn)動(dòng)由快轉(zhuǎn)慢，彈動(dòng)效果逐漸削弱直至消失。這些動(dòng)態(tài)圖形都是依據(jù)現(xiàn)實(shí)世界物體的慣性運(yùn)動(dòng)、彈性運(yùn)動(dòng)、曲線運(yùn)動(dòng)等物理規(guī)律而進(jìn)行設(shè)計(jì)的，為玩家營(yíng)造出了一種真實(shí)感。

4.2符合內(nèi)涵表達(dá)原則

動(dòng)態(tài)圖形在模仿現(xiàn)實(shí)時(shí)應(yīng)符合運(yùn)動(dòng)規(guī)律以形成視覺(jué)認(rèn)知，并且動(dòng)態(tài)圖形的交互設(shè)計(jì)也應(yīng)更加符合主題信息的內(nèi)涵表達(dá)。

以《紀(jì)念碑谷2》為例，該游戲初始界面是一個(gè)不完整的小圖標(biāo)，通過(guò)漸次展開(kāi)畫面的動(dòng)畫形式調(diào)動(dòng)起玩家的探究興趣，以此吸引玩家的注意力從而表達(dá)探險(xiǎn)游戲的主題。展現(xiàn)全部紀(jì)念碑谷場(chǎng)景后，通過(guò)設(shè)置不同時(shí)長(zhǎng)的間隔與移動(dòng)速度使背景中的雪花有節(jié)奏地移動(dòng)，營(yíng)造唯美的視覺(jué)效果，帶給玩家舒適的游戲體驗(yàn)。

4.3符合動(dòng)態(tài)時(shí)間設(shè)計(jì)原則

動(dòng)態(tài)圖形是基于時(shí)間動(dòng)態(tài)而設(shè)計(jì)的圖形，因此，合理的動(dòng)態(tài)時(shí)間設(shè)計(jì)能夠?yàn)槭褂谜咴诮换ミ^(guò)程中提供流暢而舒適的體驗(yàn)感。反饋型動(dòng)態(tài)圖形在使用者實(shí)施交互指令時(shí)起到迅速反應(yīng)的作用，應(yīng)盡量簡(jiǎn)單快速。若動(dòng)態(tài)圖形的交互反饋超出一秒，用戶將不再保持完整感知并產(chǎn)生卡頓延遲的交互體驗(yàn);以加載動(dòng)態(tài)圖形為代表的狀態(tài)提示型動(dòng)態(tài)圖形，在處于界面加載狀態(tài)時(shí)應(yīng)當(dāng)安撫使用者因等待而產(chǎn)生的焦躁感，因此動(dòng)態(tài)圖形時(shí)長(zhǎng)過(guò)于漫長(zhǎng)或短暫都是不合適的，太過(guò)短暫會(huì)讓使用者形成無(wú)趣的視覺(jué)感，過(guò)于漫長(zhǎng)則會(huì)讓使用者產(chǎn)生枯燥乏味之感。如：在影視作品中，設(shè)計(jì)師通過(guò)改變動(dòng)態(tài)圖形的節(jié)奏來(lái)為觀眾提供影視內(nèi)容的。

4.4符合愉悅有趣的情感體驗(yàn)原則

體驗(yàn)是通過(guò)感官形成的情感，不可設(shè)計(jì)卻可觸發(fā)。動(dòng)態(tài)圖形的交互設(shè)計(jì)通過(guò)三個(gè)方面滿足使用者的情感體驗(yàn)需求：使用合適的視覺(jué)元素引導(dǎo)使用者的情緒，滿足使用者的本能需求;使用合理的交互系統(tǒng)，為使用者提供舒適的操作體驗(yàn)，滿足使用者的行為需求;使用合適的交互動(dòng)作引導(dǎo)使用者對(duì)進(jìn)行情感溝通，并形成共鳴，滿足使用者的反思需求。

4.4.1簡(jiǎn)約的視覺(jué)元素體驗(yàn)

動(dòng)態(tài)圖形的交互設(shè)計(jì)要素包括圖形、文本、色彩、動(dòng)態(tài)、布局等，在情感化設(shè)計(jì)中發(fā)揮著重要作用。統(tǒng)一的視覺(jué)元素會(huì)讓使用者產(chǎn)生舒適的情感體驗(yàn)，而雜亂的視覺(jué)元素難以讓使用戶集中注意力，不利于使用者快速了解主題。因此，在動(dòng)態(tài)圖形的交互設(shè)計(jì)中需要利用統(tǒng)一的視覺(jué)元素向使用者傳達(dá)內(nèi)容，以帶給使用者和諧流暢的體驗(yàn)。

4.4.2簡(jiǎn)單自然的交互行為

動(dòng)態(tài)圖形的交互設(shè)計(jì)需要遵循便捷的應(yīng)用原則。人們會(huì)本能地尋求便利，交互行為語(yǔ)言與內(nèi)容的簡(jiǎn)練直觀能夠激發(fā)使用者體驗(yàn)的興趣。因此，操作設(shè)計(jì)可以引用使用者日常習(xí)慣動(dòng)作，并遵循使用者在實(shí)際生活中的認(rèn)知和經(jīng)驗(yàn)。

5結(jié)語(yǔ)

本文分析了動(dòng)態(tài)圖形在交互設(shè)計(jì)時(shí)應(yīng)遵循的原則，并從交互的角度優(yōu)化動(dòng)態(tài)圖形的各個(gè)設(shè)計(jì)要素，通過(guò)動(dòng)圖形的交互設(shè)計(jì)提高使用者在操作時(shí)的多感官體驗(yàn)。通過(guò)本文的研究，以期為動(dòng)態(tài)圖形的未來(lái)發(fā)展提供更多的可能性。