視覺傳達設(shè)計的交互動畫特效制作手法探析

王瑩

伴隨網(wǎng)絡(luò)文化的發(fā)展，我國已進入信息化時代，視覺傳達設(shè)計也被廣泛用于各類媒體、信息內(nèi)容、文化作品之中，而通過采用交互性設(shè)計，使信息的傳達更為直觀有效。本文結(jié)合交互性設(shè)計的概念，對視覺傳達設(shè)計中的交互動畫特效制作手法進行了分析，得出交互動畫特效是優(yōu)化視覺傳達設(shè)計的有效方法和信息傳播的有效手段。

動畫特效常常被應(yīng)用在視覺傳達設(shè)計的交互設(shè)計當中，主要是因為其具有交互屬性特點。在進行動效制作的設(shè)計流程當中，設(shè)計者必須要了解動效的運動規(guī)律，可以用來解決設(shè)計中的哪些問題，從而將其合理地運用到設(shè)計及部分細節(jié)當中，在制作過程中，設(shè)計者也可以適當加入與作品相應(yīng)的動效效果，豐富作品的表現(xiàn)形式，提升表現(xiàn)效果?？偠灾?，設(shè)計者在設(shè)計過程中需要結(jié)合多方面因素進行考慮，從而使作品與觀看者之間的交互產(chǎn)生良好反饋。

一、交互性設(shè)計的概念

交互性是一種被用來幫助用戶提供科學有效的控制與方便使用信息的手段，其不僅使用戶對作品、信息、內(nèi)容的理解程度與注意力得到增強，同時也延長了信息在用戶大腦中的存留時間。一般的交互形式都只是最底層的對數(shù)據(jù)進行轉(zhuǎn)換的交互，而當交互形式變?yōu)橐孕畔橹黧w時，則需要利用知識進行輔助，并對交換數(shù)據(jù)進行相應(yīng)的結(jié)算。同理，相對于其他類型的圖形、圖像，或是和時間相關(guān)的音樂、錄音、影像視頻等等，都能夠?qū)ζ鋬?nèi)容進行交互處理，使用戶對內(nèi)容的理解達到一個新的層次，從而將交互性提升到一個更高的層次。對交互結(jié)果具有可控性同時能夠進行對信息的反饋，這是交互性設(shè)計的重要特點，同時也是對交流與經(jīng)驗的傳遞。而想要達到視覺傳達設(shè)計的最高層次，則需要在設(shè)計過程中能夠根據(jù)用戶的實際使用情況進行相應(yīng)調(diào)整，從而使用戶能夠參與到交互設(shè)計過程當中，從而使交互設(shè)計產(chǎn)生良性循環(huán)，持續(xù)不斷地發(fā)展。

二、交互動畫特效制作手法

1.作為小動畫動效制作的第一手法，GIF小動畫受到廣泛用戶的喜愛，其經(jīng)常被用來制作對細節(jié)要求較高的位圖小動畫，且具有成本低、可壓縮、容量小、制作方法簡單等優(yōu)點，同時作為一種圖片格式在各個操作系統(tǒng)中都能夠廣泛傳播。而且，用來制作GIF小動畫的軟件也有很多，例如我們比較熟悉和常用的photoshop、After、Flash、Effects等軟件，都能夠?qū)⑿赢嬕訥IF的格式導(dǎo)出，然后分享。在交互設(shè)計中，GIF小動畫常常被用作一些頁面當中的小標簽、加載進度條等細節(jié)元素，且在制作過程中需要把握精度與大小之間的平衡。

2.與GIF動畫較為類似的一種動效形式是逐幀動畫，其原理是將動畫分解成一張張等間距的逐幀圖片，并配合JAVASCRIPT的腳本模擬編寫制作而成。逐幀動畫的兼容性較為適合移動端，但在設(shè)計中應(yīng)用較少。而逐幀動畫與GIF動畫的區(qū)別在于，通過腳本可以對逐幀動畫的播放快慢、動作暫停等進行控制，而相對于GIF小動畫來說，無法通過腳本或后期代碼來對其屬性、透明度、播放速度進行相應(yīng)的控制和改變。

3.作為在動畫特效當中的重要成員之一，CSS3常常被應(yīng)用于平面層的動畫，但由于其部分屬性的限制導(dǎo)致無法獲得瀏覽器的有效支持，阻礙了其推廣與應(yīng)用。CSS3的動畫主要有三大屬性，分別是Transform變形：包含扭曲、移動、旋轉(zhuǎn)、縮放和矩陣變形五大特效；Transition過渡：可以對執(zhí)行變換的時長、速率、屬性進行修改，并可以延遲時間；Animation動畫：可以看做是前兩個特效的結(jié)合，即幾個連續(xù)的動作，也就是動畫。

4.作為動效制作中不可缺少的一種制作方法，可縮放矢量圖，其又被稱為SVG，常常用作線條類的動畫，但對IE8及Android4.2及以下的系統(tǒng)兼容性較差。一般在對設(shè)計元素中進行描邊動畫的特效制作時，都會采用SVG來進行，當然，相對于一些比較復(fù)雜的動畫，同樣可以勝任，只是制作難度以及實現(xiàn)成本較高。

SVG動畫圖可以被方便地存儲為文檔格式，主要因為它是由固定順序的定位錨點進行鏈結(jié)而生成的，所以，當你在制作SVG動畫時，則應(yīng)該使用illustrator軟件進行適量圖的繪制。

三、交互動畫特效制作的基本原則

1.在進行視覺傳達設(shè)計的過程中，通過采用交互動效制作可以使觀看者的記憶、感知、學習獲得一定程度的提升。在作品設(shè)計過程中，存有異形元素的作品往往都會具有其特殊性質(zhì)，從而使觀看者對其產(chǎn)生深刻的記憶和印象。當設(shè)計者在設(shè)計過程中將其中的某個元素故意進行強調(diào)處理，使其多次出現(xiàn)在觀看者眼前，從而使觀看者對該元素的認知度得到提升，而利用該原理，在一些信息量較多的圖像環(huán)境、靜態(tài)展示環(huán)境及文字內(nèi)容較多的環(huán)境中，通過融入一些微妙的動態(tài)元素便可以有效增強觀看者的感知與記憶，從而使內(nèi)容信息的傳達更為深刻有效。

2.為了使交互更具有視覺沖擊效果，在進行視覺傳達設(shè)計的過程中，將二維運動元素或三位運動元素與其有效結(jié)合，從而使設(shè)計中的交互元素能夠更加生動、形象的展現(xiàn)出來，豐富其表現(xiàn)形式，不僅增強了對觀看者的視覺沖擊，同時也具有很強的目的性。

3.通過交互動效設(shè)計，使視覺傳達設(shè)計中的內(nèi)容重點能夠被有效地突顯出來，使觀看者有效過濾掉無用信息，同時，信息狀態(tài)與畫面的改變使信息得到有效傳達，文字與圖片的交互動態(tài)效果將觀看者的注意力有效吸引，從而有效融入到作品當中，給觀看者帶來更好的觀看體驗，及重點信息的有效傳遞。

四、總結(jié)

在進行視覺傳達設(shè)計的過程中，對元素的設(shè)計也是需要慎重考慮的，而且，在實際設(shè)計過程中當中，動態(tài)元素要比靜態(tài)元素更能夠吸引觀看者的注意力，且隨著制作者的藝術(shù)觀點與創(chuàng)作思維的不同，使其呈現(xiàn)的藝術(shù)效果也各有不同，從而產(chǎn)生許多獨具特色的優(yōu)秀設(shè)計作品。將動效制作與視覺傳達設(shè)計有效結(jié)合，使交互作品的表現(xiàn)形式與表現(xiàn)效果得到提升，使內(nèi)容中的重點信息得到有效傳播，從而獲得觀看者的廣泛認可與贊揚。

（作者單位：江西泰豪動漫職業(yè)學院）