信息產品中動態圖形設計的交互適用場景研究

李郭

摘 要：以用戶體驗的功能性為依據，對動態圖形進行概念界定及分析其應用環境，并提出了動態圖形在信息產品中的交互適用場景，總結其價值及意義，使動態圖形以更優化的人機交互模式呈現給用戶多維視覺體驗。

關鍵詞：動態圖形；交互方式；適用場景

伴隨移動智能設備的廣泛普及與其性能的不斷提升，在操作體驗信息產品的同時，用戶提出了更高更新的要求，使得信息產品形成日益豐富的龐大產品生態圈。動態圖形作為一種直接有效的新型信息傳達交互方式，可以為產品凸顯品牌價值，拉進與用戶的情感交流，從而提升產品操作流暢性及體驗易用性，被設計師們越來越多的運用在信息產品中。

1 動態圖形的概念及應用環境

動態圖形設計，稱為Motion Graphics Design或簡稱為Motion Design，即為動態條件下的圖形設計。[1]動態圖形設計是由傳統靜態圖形設計衍生而出，并且將圖形元素從靜態表現置入到時間的表現維度中，在時間的維度上具有一個有始有終的延生區間，而非一個一個的靜止點。因此，既包含傳統圖形設計的特征、原則及規律，又因信息傳達方式與時間因素緊密聯系而區別于傳統圖形設計。此外，制作技術條件及應用展示媒介較大程度影響和制約著動態圖形的設計形式，直接影響到設計的方式方法及作品本身。動態圖形是以傳達、展示信息為主要目的的動態視覺傳達手段，信息服務產業的改良升級，使得動態圖形設計發展潛力巨大。動態圖形所依賴的軟件層面是由智能終端操作系統所承載的，ios作為第一個智能終端的操作系統，起搭載的動態圖形的交互設計方式具有新的指導價值和借鑒含義。動態圖形設計基于前端、硬件及后臺程序支持，操作界面實現了由單一靜態到多維動態的展示方式的轉變，使得用戶擁有更豐富的視覺體驗，從而提升用戶的情感化操作經驗，增強用戶對信息產品的使用黏度。[2]

2 信息產品中動態圖形的交互適用場景

動態圖形的視覺表現對于提升被逐漸廣泛應用于信息產品設計、廣電傳媒、工業產品宣傳與推廣、建筑瀏覽、學術教學與科研等眾多領域信息產品的用戶體驗可起到畫龍點睛的作用，然而動態圖形在信息產品中的運用并非華而不實的花架子及無緣由的堆砌，在何種交互場景出現均是以解決某種功能需求為宗旨，最重要的是一定要服從用戶體驗。

2.1 引導

引導是信息產品中動態圖形設計應用較多的一個場景。引導包括兩方面內容：一是開場引導頁（即新手幫助）。二是對于隱藏內容、操作的提示及引入。開場引導頁是用戶首次安裝并打開應用后所呈現的界面，功能堪比說明書。目的在于用戶未使用之前，在最短時間內提前告知用戶產品的主要功能、特點、操作方式并迅速上手，開始體驗之旅。開場引導頁按照目的可分為功能介紹類、推廣類、使用說明類及問題解決類，產品的第一印象將極大地影響到后續的產品使用體驗，因而別出心裁的引導頁尤為重要。提示引入頁通常以最直接有效的方式告知用戶應該怎么做，或者吸引他們去做什么，可通過動態對功能的位置、方向、路徑、喚出操作等進行暗示和指導，以便用戶在有限的信息產品界面中發現更多功能。

2.2 加載

加載頁是由于加載數據內容過多或網速原因而形成的界面間的過渡，系統級的過渡一般分為兩種——菊花轉和進度條，菊花轉用于剩余時間無法預知的情況下；進度條則用在可預知完成進度和剩余時間的情況下。加載設計的好壞直接影響產品的用戶體驗，通過一種有趣的美學形式表現程序運行的進度，一方面做出承諾，帶給用戶安全感，另外可以合理疏導用戶因等待而產生的焦慮情緒，從而避免用戶大量流失的慘劇發生。進程演示類動態圖形的設計，加入了動態過渡，使得內容不再是枯燥的從0到1的跳轉，復雜的程序語言轉化為動態視覺語言“我正在處理你的內容，請稍等”。豐富的信息量及有趣幽默的動態圖形內容可增加用戶的期待值，除了對信息產品本身的期待，還有對加載設計本身的期待，從而使用戶潛移默化的減少覺察正在加載的時間。[3]加載的動態圖形設計，可結合產品的品牌形象，抽象和具象方面均可入手，給人留下更深刻的印象。

2.3 轉場

信息產品中的轉場，即從一個界面切換到另一界面，為了避免界面之間跳轉的過于生硬呆板，利用動態圖形補上了界面跳轉的中間過程，是的用戶體驗更加自然和流暢，可以說轉場是動態圖形目前應用最多的場景。轉場的動態設計包括堆砌動態效果、界面重組動態效果、平滑與平鋪動態效果、空間翻轉動態效果及線索連續動態效果等。轉場設計的動態圖形呈現方式又可細分為多種類型，如3D翻轉、淡入淡出、抖動、旋轉、立方體效果、收縮效果、翻頁、放大縮小等等。轉場動態圖形的制作可更多地從產品目的、產品整體特點、場合、實現性能等多方面進行考慮，使得操作更加精致流暢，提升產品品質。

2.4 反饋

在引導、加載、轉場后，動態圖形適用的另一場景即反饋。反饋可分為過程反饋和結果反饋——過程反饋指的是在操作過程中，為了告知用戶操作的狀態變化使得界面對操作進行的反饋。[4]結果反饋即完成操作后，根據結果給出的反饋，可分為操作成功的反饋和操作失敗的反饋。在結果反饋中，我們通常較多的看到動態圖形的運用，如果是成功的操作結果，往往僅限告知狀態，用戶無須執行操作，反饋就可以自動消失，而如果是失敗的操作結果，則需要引起關注，可以相對強勢一些，反饋出現的位置可以考慮相關性，采用相對警示的顏色和設計風格等。針對過程反饋，動態圖形也不失為一種對用戶很有幫助的方式，幫助用戶在操作過程中預知操作的目標和結果，可以使得應用更加細膩。

3 結論

動態圖形通過移動端信息產品，承擔著抽象視覺的傳達、身體感知的介入和智能生命形態的模擬角色，使得用戶獲得差異化的產品使用經驗，從而使信息產品獲得用戶的歸屬感。動態圖形的適用場景、范圍及模式將朝著豐富多樣的方向發展，同時需要兼顧信息傳達的準確性、場景及需求的適用性、功能的有效性，并考慮到移動終端的硬件支持及相應之下，取得形式與內容的完美平衡及統一，提升產品的易用性，滿足用戶的根本訴求。

參考文獻：

[1] 李渝.動態圖形設計基礎[M].重慶：西南師范大學出版社，2011：2.

[2] 宿子順.基于iOS平臺的功能性動畫設計研究[J].機械設計，2013，30（9）：120-121.

[3] Trumpet.談談加載的那點事[EB/OL]. http：//ued.focus.cn/wordpress/？P =2622，2013-06-04.

[4] 傅小貞，胡甲超，鄭元攏.移動設計[M].北京：電子工業出版社，2014：170.