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

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

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

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

動(dòng)效的優(yōu)勢(shì)

1. 展示產(chǎn)品功能

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

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

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

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

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

4. 增加親和力和趣味性

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

動(dòng)效設(shè)計(jì)軟件有哪些？

看到這里可能你最想要知道的肯定哪些軟件可以做動(dòng)效？

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

1. Adobe After Effects

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

它的特點(diǎn)就是強(qiáng)大且牛逼。基本上要的功能都有，UI動(dòng)效制作其實(shí)只是用到了這個(gè)軟件很小的一部分功能而已，要知道很多美國(guó)大片都是通過(guò)它來(lái)進(jìn)行后期合成制作的， 配合PS和AI等自家軟件，更是得心應(yīng)手，Dribbble 上炒雞多的大神都是用這個(gè)軟件在show。

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

AE 教程推薦：

1. 《快速入門！一份給新手的AE圖層菜單修煉手冊(cè)》
2. 《完全停不下來(lái)！10個(gè)好用到令人震驚的AE插件（附視頻演示）》
3. 《一份實(shí)用簡(jiǎn)單好上手的AE表達(dá)式江湖文檔》

2. Adobe Photoshop

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

筆者喜歡用PS 來(lái)制作簡(jiǎn)單的表情動(dòng)畫，逐幀動(dòng)畫用得居多（如下圖的表情）。

3. Adobe Flash

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

4. Pixate

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

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

Pixate 具體介紹及教程：

1. 《WINDOW黨福利！這才是適合設(shè)計(jì)師的免費(fèi)動(dòng)效神器PIXATE》
2. 《WINDOWS設(shè)計(jì)師也可以用！免費(fèi)動(dòng)效神器PIXATE初級(jí)教程（一）》
3. 《PIXATE中級(jí)教程！解析MATERIAL DESIGN中交互動(dòng)畫效果之FAB》

5. Origami

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

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

6. Hype 3

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

Hype 3教程：

1. 《無(wú)代碼做動(dòng)效神器Hype3入門教程》
2. 《教你用HYPE3做APP原型的基礎(chǔ)過(guò)場(chǎng)（附神器）》
3. 《教你用HYPE無(wú)代碼制作PATH扇形菜單動(dòng)畫》

7. Flinto

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

8.Principle

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

9.CINEMA 4D

說(shuō)到C4D或者大家第一反應(yīng)是它是三維軟件啊，沒錯(cuò)！但是它做起動(dòng)效來(lái)也是帥破天際的，，下面是網(wǎng)絡(luò)上用C4d做的一些demo。

C4D 教程：《教你用C4D+PS繪制炫酷的2017特效字體海報(bào)》

10. keynote

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

筆者經(jīng)常為了省事直接都是用它做個(gè)簡(jiǎn)單demo給程序猿看的。快捷方便，要知道時(shí)間就是金錢啊！

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

好啦，由于筆者也并不是全部了解目前市面上的動(dòng)效軟件，按自己的理解相對(duì)主流的動(dòng)效制作軟件就是上面這些，錯(cuò)漏地方還請(qǐng)見諒，由于篇幅有限，PS 制作動(dòng)效簡(jiǎn)單演示推后到下一篇吧，

歡迎關(guān)注作者的微信公眾號(hào)：折騰先生

「折騰先生的教程合集」

1. 《PS教程！手把手教你繪制萌萌噠的小鳥卡通形象》
2. 《PS教程！手把手教你制作沖擊力超強(qiáng)的美漫風(fēng)格海報(bào)》
3. 《省時(shí)高效！7個(gè)資深設(shè)計(jì)師常用的PS實(shí)用技巧》

【優(yōu)設(shè)網(wǎng) 原創(chuàng)文章 投稿郵箱：yuan@uisdc.com】

================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是國(guó)內(nèi)人氣最高的網(wǎng)頁(yè)設(shè)計(jì)師學(xué)習(xí)平臺(tái)，專注分享網(wǎng)頁(yè)設(shè)計(jì)、無(wú)線端設(shè)計(jì)以及PS教程。
【特色推薦】
設(shè)計(jì)師需要讀的100本書：史上最全的設(shè)計(jì)師圖書導(dǎo)航：http://hao.uisdc.com/book/。
設(shè)計(jì)微博：擁有粉絲量180萬(wàn)的人氣微博@優(yōu)秀網(wǎng)頁(yè)設(shè)計(jì) ，歡迎關(guān)注獲取網(wǎng)頁(yè)設(shè)計(jì)資源、下載頂尖設(shè)計(jì)素材。
設(shè)計(jì)導(dǎo)航：全球頂尖設(shè)計(jì)網(wǎng)站推薦，設(shè)計(jì)師必備導(dǎo)航：http://hao.uisdc.com