李月怡
(云南師范大學美術學院,云南 昆明 650000)
動效設計的英文是Motion Design,是運動圖形設計(Motion Graphic Design)的簡稱,也稱為動態(tài)設計。運動圖形設計遵循平面設計和視聽語言的雙重標準,通過視頻或動畫來創(chuàng)作成動態(tài)影像的藝術形式。嚴格意義上講,運動圖形設計是動效設計的一個分支,而它具有眾多的藝術表現(xiàn)形式和作品,所以這兩者的概念逐漸趨同。下文所談的動效設計即動態(tài)設計,或運動圖形設計,不做細微區(qū)分。
手機移動應用動效指的是用戶在 與移動設備交互過程中移動應用用戶界面呈現(xiàn)出的動態(tài)效果。
設計師若只追求靜態(tài)像素的完美呈現(xiàn),而忽略動態(tài)過程的合理表達,會導致用戶不能在視覺上覺察元素的連續(xù)變化,進而很難對新舊狀態(tài)的更替有清晰的感知。
通過「時間點」和「空間幅度」的設計為用戶建立運動的可信度,即視覺上的真實感,當用戶意識到這個動作是合理的,才能更加清晰愉悅地使用產(chǎn)品。
未添加動效的產(chǎn)品,會帶給人一種死氣沉沉的感覺,所有內(nèi)容平鋪直敘、毫無生機,即使界面設計的很美觀,也會缺乏一種靈動細膩的氣質(zhì)。如果把產(chǎn)品比作成美女,那么界面視覺就是美女的顏值,交互動效就是美女的肢體語言。合理的動效能將更立體、更富有關聯(lián)性的信息傳遞出去,提高產(chǎn)品的“表達能力”,增加親和力和趣味性,也利于品牌的建立。并且優(yōu)秀的動效能夠加強用戶與產(chǎn)品的情感傳遞,增加用戶對產(chǎn)品的友好度。
在 UI 設計行業(yè)已經(jīng)趨于飽和、并且產(chǎn)品設計流程逐漸實現(xiàn)體系化和模塊化的今天,設計師如果只會利用組件重復性地“拼湊”頁面而無更多的價值產(chǎn)出,被替代的可能性將會增大。在日常工作之余,若要為公司和團隊輸出更多的價值,動效設計能力便是交互、視覺設計師的必備技能與核心競爭力之一。
動效設計需要使用恰當?shù)囊曈X元素,一方面讓元素能與APP功能主旨相吻合,另一方面也使之契合該界面的時態(tài)。動效的相對面積和動效持續(xù)時間的選擇必須根據(jù)預期功能、預期用戶體驗的影響的具體情況決定。這類動效最重要的是讓用戶感到毫無負擔又如沐春風,也就是不要奪人眼球,悄無聲息的順應用戶行為,引導用戶需求。在設計中要考慮系統(tǒng)兼容和資源占用、動態(tài)速度的節(jié)奏、仿生性or現(xiàn)實重現(xiàn)問題。例如加載過程時間長時,可以設計有趣的加載動畫,緩解用戶等待的焦慮?!梆I了嗎”APP加載界面使用了快速旋轉的時鐘轉盤,匹配該應用為外賣功能主旨的同時,該動效用于短時加載的間隙,讓用戶明確當前狀況。
一個優(yōu)秀的動效必須要自然、符合物理世界的事物運動規(guī)律。這是因為物理世界里的物體是擁有質(zhì)量的,給它們作用力,它們就會移動。由于阻力的存在,幾乎所有的物理運動都有著加速度運動,即人們?nèi)庋鬯姷降木徣刖彸?。如果虛擬世界里的動畫突然開始、停止或突兀地轉變方向,會讓用戶產(chǎn)生不適的感覺,所以在進行動效設計運動形式要蘊含操作邏輯和動作序列,而不是一味地追求某 一動效圖像運動的與眾不同。在信息層級方面,由于在物理世界中, 物體存在近大遠小原則,所以在界面元素也可以通過動效來呈現(xiàn)整個系統(tǒng)的信息的前后位置,展現(xiàn)信息的空間層次感。在轉場過渡的時候,由于人腦灰質(zhì)會對動態(tài)事物(如:移動、形變、色變等)保持敏感。在界面中加入一些平滑舒適的過渡效果,能幫助用戶理解界面前后變化的邏輯關系。
無論是點擊、長按、拖拽、滑動等交互行為,都應該得到系統(tǒng)的即時反饋,將其以視覺或動效的方式展現(xiàn),幫助用戶了解當前系統(tǒng)對交互過程的響應情況,為用戶帶來安全感。譬如在一些應用中,如果密碼輸入錯誤之后,界面會震動并且彈出紅色的提示性文字,這就造成一種緊張感,促使用戶在輸入密碼時謹慎、認真。等待性特征意味著該交互不具備指令效應,但可以形成操作效果,即充分使用動效將看似被動的局面轉化為讓人覺得這一時間段是有價值的。
好的設計往往是以小見大的,在細節(jié)處彰顯情懷。好的體驗也是由每一個細微的感受構成的。功能吸引用戶使用你的產(chǎn)品,細節(jié)設計塑造產(chǎn)品的差異化,將你的用戶留下。通過場景的營造,動效讓用戶的操作變得輕松自然,動效還可與產(chǎn)品定位或公司文化相一致,喚起用戶情感潛在的反應,諸如回憶、聯(lián)想、感悟等。例如“網(wǎng)易云音樂”的音樂播放界面動效,界面視覺元素唱片模仿上世紀七八十年代的唱片機,金屬質(zhì)感的唱臂被形象地展示出來,增強場景的真實感,強化沉浸體驗,十分有情懷。從而更易引發(fā)用戶的情感共鳴,增加用戶對產(chǎn)品的友好度。
在互聯(lián)網(wǎng)時代,UI和網(wǎng)頁中使用動效已經(jīng)成為大趨勢。這往往導致越來越多的應用為了動效而設計,而背離了動效設計的初衷。設計師 Pasquale D’Silva 在2013年的 Web Direction South 上曾這樣說過:好的動效是隱形的。這就要求我們在動效的使用的過程中,就需要更加小心謹慎,確保設計目標不會被其干擾。恰到好處的拿捏產(chǎn)品中需要設計動效的位置、方式,不僅要掌握傳統(tǒng)的動畫理論,更需要對產(chǎn)品的目標,功能要求有著深入理解以及理性的對控件及界面從用戶的角度進行劃分。