動效設(shè)計(jì)幾乎都是這10個軟件做的

資訊頻道 - 設(shè)計(jì)技 來源:中國設(shè)計(jì)在線 作者:cdo 2017-01-18

想學(xué)習(xí)動效設(shè)計(jì)?別以為只有復(fù)雜的AE 可以做。今天推薦的這10個軟件都可以做出酷炫的動效設(shè)計(jì),功能上各有優(yōu)勢,但效果絲毫不輸AE喲(內(nèi)附大量教程)。

隨著技術(shù)的不斷發(fā)展,動效越來越多的被應(yīng)用于實(shí)際的項(xiàng)目中。手機(jī)、網(wǎng)頁等等媒介都在大范圍應(yīng)用,那么問題就來了,為什么動效越來越吃香?它有哪些優(yōu)勢呢?

首先要說明一點(diǎn)的是,動效之所以越來越吃香不是最近才流行的,而完完全全就是因?yàn)檫^去硬件設(shè)備承受不住啊, 過去要是在手機(jī)里搞個動效,那你手機(jī)就等著卡出翔,要知道過去的內(nèi)存和CPU 都是多么多么的Low…..現(xiàn)在呢?動不動就是4G內(nèi)存和八核CPU了……

再說這個強(qiáng)調(diào)個性的年代,一成不變的設(shè)計(jì)是很難讓消費(fèi)者買單的。

動效的優(yōu)勢

01/

展示產(chǎn)品功能

動效設(shè)計(jì)可以展示產(chǎn)品的功能、界面、交互操作等細(xì)節(jié),讓用戶更直觀的了解一款產(chǎn)品的核心特征、用途、使用方法等細(xì)節(jié)。

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

02/

更有利于品牌建設(shè)

比較恰當(dāng)?shù)睦尤缱罱鼉?yōu)酷更新了logo

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

03/

利于展示交互原型(設(shè)計(jì)細(xì)節(jié))

很多時候設(shè)計(jì)不能光靠嘴去解釋你的想法,靜態(tài)的設(shè)計(jì)設(shè)計(jì)出來后也不見得能讓觀者一目了然。因?yàn)楹芏鄷r候交互形式和一些動效真的很難用嘴來形容,所以才會有高保真Demo,這樣就節(jié)約了很多溝通成本。

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

04/

增加親和力和趣味性

有時候加個動效,能立馬拉進(jìn)與觀者的距離,要是再加些趣味性在里面,用”愛不釋手“這詞也毫不夸張。

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

動效設(shè)計(jì)軟件有哪些?

看到這里可能你最想要知道的肯定哪些軟件可以做動效?

目前市面上確實(shí)蠻多的,筆者建議學(xué)好一個,夠用就好。學(xué)多而不精其實(shí)就是浪費(fèi)時間!

01/

Adobe After Effects

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

AE這個軟件我想都該知道,火得一塌糊涂,如果筆者沒猜錯的話,它目前屬于設(shè)計(jì)師學(xué)動效的首選。

它的特點(diǎn)就是強(qiáng)大且牛逼;旧弦墓δ芏加,UI動效制作其實(shí)只是用到了這個軟件很小的一部分功能而已,要知道很多美國大片都是通過它來進(jìn)行后期合成制作的, 配合PS和AI等自家軟件,更是得心應(yīng)手,Dribbble 上炒雞多的大神都是用這個軟件在show。

但是有些效果工程師不見得能夠幫你實(shí)現(xiàn)出來, 因?yàn)閷?shí)際的項(xiàng)目產(chǎn)品受太多的制約。

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

02/

Adobe Photoshop

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

可能很多人都認(rèn)為PS 只用來作圖和處理圖像的,并不知道PS 可以做gif,然而當(dāng)AE沒有火起來的時候,我們這些老UI 設(shè)計(jì)師們都是用PS 做Gif,用Flash 做Demo(過去我們只需要做PC桌面的動效)。如果我沒記錯的話,PS從CS 6之后開始進(jìn)一步加強(qiáng)了動效的模塊,現(xiàn)在的版本能夠?qū)崿F(xiàn)很多相對復(fù)雜的動效。

筆者喜歡用PS 來制作簡單的表情動畫,逐幀動畫用得居多(如下圖的表情)。

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

03/

Adobe Flash

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

Flash可以說是過去的王者,也是由于時代的發(fā)展原因,現(xiàn)在基本被淘汰了,這里不多做解釋,具體可以百度。

04/

Pixate

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

這個軟件被大牛Google 收購了,然而它Google收購一年后:Pixate Studio宣布卻于10月31號被停止更新了,凄凄慘慘戚戚。簡單說下它的優(yōu)缺點(diǎn):

Pixate是圖層類交互原型軟件。優(yōu)點(diǎn):可交互,共享性強(qiáng),和Sketch結(jié)合相對高,同時對Google Material Design的支持比較好,有許多MD相關(guān)預(yù)設(shè)。Pixate的缺點(diǎn)是沒有時間線,層級管理不是很明確,圖層一多就會非常的繁雜。

05/

Origami

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

這個軟件可以用一句話來形容:超強(qiáng)大的高難度原型工具。

要是沒點(diǎn)代碼知識做壓驚,,建議遠(yuǎn)處觀望就好。

06/

Hype 3

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

Hype 3也算是火了一小段時間的,號稱無代碼動效神器,像AE一樣使用時間軸就做可互動的動畫。PC、手機(jī)、Pad端都可以直接訪問(以web的形式),也可以導(dǎo)出視頻或者GIF。3.0版還有物理特性和彈性曲線,可以發(fā)揮更強(qiáng)大的動畫效果。對中國人來講,它原生支持中文這一點(diǎn)也非常棒!配合sketch效果也是杠杠的。

07/

Flinto

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

界面跟Sketch很像,如果會用sketch那么上手很快。能夠快速實(shí)現(xiàn)各種滾動、轉(zhuǎn)場、點(diǎn)擊反饋效果。手機(jī)和電腦端的預(yù)覽都非常的流暢。貌似現(xiàn)在用的人不少,下圖是demo:

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

08/

Principle

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

這個軟件的和上面的flinto有點(diǎn)類似,界面和sketch類似,同時配合sketch也是非常方便。它主要是做2個頁面間過渡專場特效,元素切換,細(xì)節(jié)動效的工具。優(yōu)點(diǎn)很明顯,效率高,質(zhì)感好,缺點(diǎn)就是不能做整套原型。

09/

CINEMA 4D

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

說到C4D或者大家第一反應(yīng)是它是三維軟件啊,沒錯!但是它做起動效來也是帥破天際的。

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程) 新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程) 新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

 10/

 keynote

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

keynote相當(dāng)于windows的powerpoint,是個幻燈片軟件。但是!或許你并不知道,據(jù)說蘋果的交互設(shè)計(jì)師都是用keynote做交互演示的。只要能夠熟練掌握這個軟件,目前App里的絕大多數(shù)動效都是可以做出來的,但是相對復(fù)雜一點(diǎn)的動效實(shí)現(xiàn)起來就有點(diǎn)不夠。

筆者經(jīng)常為了省事直接都是用它做個簡單demo給程序猿看的?旖莘奖,要知道時間就是金錢!

下面兩個圖就是用它實(shí)現(xiàn)噠,

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)

新人手冊!動效<a href=http://www.dekaron.com.cn/ target=_blank class=infotextkey>設(shè)計(jì)</a>幾乎都是這10個軟件做的(內(nèi)附教程)


聲明:站內(nèi)網(wǎng)友所發(fā)表的所有內(nèi)容及言論僅代表其本人,并不反映任何網(wǎng)站意見及觀點(diǎn)。

全部評論

暫無相關(guān)推薦