MG 全稱是 Motion Graphic(動態(tài)圖形),是一種現(xiàn)在非常流行的動畫分支。它更像是介于平面設(shè)計與動畫片之間的一種產(chǎn)物。動態(tài)圖形在視覺表現(xiàn)上使用的是基于平面設(shè)計的規(guī)則,而在技術(shù)上使用的是動畫制作手段。簡單來說,這類動畫往往都以簡約的幾何圖形來描述物理特性,但表現(xiàn)力極強。輕簡的特性也成為 UI設(shè)計中的一個點睛環(huán)節(jié)。
那如何制作一個有趣又有生命力且符合邏輯的動效呢?在我看來需要著重了解以下這4個物理特性,就能解決所有基本問題。
四大心法:阻力、慣性、透視、焦距。
一、阻力
大家在做動畫的時候很容易考慮到慣性,慣性往往是物體自身的特性。阻力則是外界事物對物體產(chǎn)生的影響。但當(dāng)我們看不見這個外界事物的時候,就會忽略這點。
小車運動中,它上面的旗幟看上去是不是很奇怪?這就是忽略了阻力對對象帶來的影響。
材質(zhì)相對較輕的旗幟會比車子更容易受到空氣阻力的影響,這樣看上去才比較符合現(xiàn)實。
二、慣性
慣性是動畫中最常見的動態(tài)規(guī)律。也是最容易出效果的參數(shù)。我們調(diào)整物體的緩入緩出的幅度來表現(xiàn)不同質(zhì)量的物體運動。
動畫上方的小球是勻速接近磁鐵,下方的小球是勻加速接近磁鐵。哪個看上去更符合現(xiàn)實呢?你答對了!下方的小球表現(xiàn)出物體本身的慣性。當(dāng)有外力突然吸引時,物體由于本身質(zhì)量的影響,逐漸失去靜止的狀態(tài),而不是瞬間。
動畫下方表達的是柔軟的小球,在當(dāng)外力影響時,整個球體慣性分布不均勻,球體左側(cè)和右側(cè)產(chǎn)生了慣性先后速度差,產(chǎn)生了形變。當(dāng)最終觸碰磁鐵后,慣性差導(dǎo)致球體左側(cè)結(jié)束比右側(cè)晚,產(chǎn)生了回彈。
三、透視
在二維動畫中,透視是一個相對較難表現(xiàn)形式。我們往往需要利用參照物來體現(xiàn)二維物體之間的空間關(guān)系。
我們在坐高鐵的時候觀察窗外,風(fēng)景是這樣移動的嗎?樹林、遠山和更遠的云層。三者由于透視的關(guān)系,是不會以相同的速度移動的。
「近中遠」分別對應(yīng)「快中慢」,利用不同速度來表現(xiàn)前后關(guān)系。我們利用參照物的差速動畫,就能做出具有很好空間感的效果。
四、焦距
同樣和透視一樣,二維的世界很難表現(xiàn)焦距這個概念。但我們可以利用色彩和虛實的手段來模擬。
左邊的小人在前?或著右邊的小人在前?或者他們只是并排站立?由于二維的限制性,人們只能通過自己的想象來彌補三維空間的缺失。不同人會得出不同的結(jié)論。在這里我們可以通過顏色來做到簡易的前后關(guān)系。顏色暗淡或明亮的可能由于光源關(guān)系,顯得離我們比較遠或比較近。(結(jié)合實際場景)
利用模糊,我們能表現(xiàn)出更好的空間效果和鏡頭感。這是利用繪畫設(shè)計和平面設(shè)計中的虛實關(guān)系。
接下來放幾個小編在實際設(shè)計中應(yīng)用的案例,大家感受一下(來自開課啦APP):
△ 品牌形象蜜蜂上升動畫
△ 下拉刷新的品牌動畫
△ 開課啦心理魔法院
最后
掌握和清楚這四點心法,能夠讓你在設(shè)計動態(tài)影像時如魚得水。但其實想做出一個優(yōu)秀的動效并不只有這些。需要你有一顆善于觀察的心,善于發(fā)現(xiàn)你身邊的那些自然規(guī)律。
歡迎關(guān)注作者的微信公眾號:「開課啦UED」
「動效設(shè)計精選」
復(fù)制本文鏈接 文章為作者獨立觀點不代表優(yōu)設(shè)網(wǎng)立場,未經(jīng)允許不得轉(zhuǎn)載。
發(fā)評論!每天贏獎品
點擊 登錄 后,在評論區(qū)留言,系統(tǒng)會隨機派送獎品
2012年成立至今,是國內(nèi)備受歡迎的設(shè)計師平臺,提供獎品贊助 聯(lián)系我們
AI輔助海報設(shè)計101例
已累計誕生 737 位幸運星
發(fā)表評論 為下方 2 條評論點贊,解鎖好運彩蛋
↓ 下方為您推薦了一些精彩有趣的文章熱評 ↓