在InVision勾徽，GIF動畫絕對不僅僅是玩玩而已咒林，因為它們在invision的營銷和教育方面也發(fā)揮了很大的作用肆资。甚至會選擇GIF作為自己的主頁造虏，而且不會使用復雜的花哨的代碼磅崭。
所以儿子，最后總是有人問，GIF動畫是如何制作的砸喻？
設計GIF動畫
1.基本要求
這是我自己的一點小秘密柔逼，所有的GIF都是錄制的視頻，使用的工具是：screenflow（譯者推薦一個GIF錄制工具：LICEcap割岛，非常實用）愉适，這也是我制作產(chǎn)品時用到的軟件，它們是非常容易學習的癣漆，而且還有一些非常棒的動畫工具可以使用维咸。
當我制作好一個視頻文件之后，就會通過導入到Photoshop 文件>導入>視頻幀作為圖層惠爽。
注意：不管是使用screenflow或者是AE制作腰湾，記住最后一定要導出成一個視頻。
2.顏色越少＝更多的樂趣
如果是想制作一些比較復雜的GIF疆股，那么就要確定好自己的用色费坊，它不僅會影響到文件的大小，還可以使得GIF的動畫可持續(xù)的時間更加長些旬痹，更復雜的GIF就盡量使文件小些（通常對我而言1M左右正好附井。）
3.如果可能，請使用運動模糊
像scrennflow和AE都可以使用運動模糊的功能两残，并導出視頻永毅，這樣不僅可以顯得更加專業(yè)，還可以在ps中出現(xiàn)丟幀現(xiàn)象時幫助做一些修改人弓。
4.集中重點部分
想象一下沼死，我如果在GIF中添加很多的其他東西，例如提示和用戶名崔赌，光標點擊加號按鈕意蛀，將鼠標懸停到臉上耸别，更多的提示和懸停狀態(tài)。用戶通常并不需要看到這么多县钥，所以只要顯示自己所需的以及文件的大小控制秀姐。
導出GIF動畫
做好了下面幾步，就只要直接導出GIF動畫就好了若贮。如果文件大小合適省有，那就很棒，如果太大那就要用到下面的方法了谴麦。
5.刪除重復幀
如果我們仔細觀察就會發(fā)現(xiàn)動畫中有些地方是會有暫停和停留的地方蠢沿，這里就包括一些重復的幀，只有0.03秒的持續(xù)時間匾效，如果說有10個幀是重復的搏予，那么我們可以刪除其中的9個，并將這一個重要的關鍵幀設計的時間設置更長一些弧轧，例如1秒。
如果之后確定沒有問題了碗殷，就可以嘗試著導入視頻精绎，并將其限制為每兩幀，這樣就會減小文件的大小了锌妻。
注意：這個不是硬性規(guī)定代乃，如果說你做的GIF有超過150幀，那就很難保證文件下降了仿粹。
6.減少顏色的使用
當在GIF中保存photoshop時搁吓，就會在右邊看到一個“顏色”的下拉框，對于這里吭历，盡量保證低堕仔，但又不至于使得GIF打開變成一個個沒法使用的色塊。
7晌区、對部分損失做好調(diào)整
談到這點其實我也不太清楚摩骨，但是我也能感知到，如果我們在1到10之間設置這個值就會感受到朗若，減少文件大小又對質(zhì)量沒有太多的損害恼五。
如果說上面提到的都嘗試了，還是沒有辦法使得文件變小哭懈，那么就應該考慮自己是不是做的太多了灾馒，也許有另一種方法來完成這個呢，或者是一個GIF分成兩個GIF遣总。最后如果我們專注于GIF睬罗，那么就會把它成更加有創(chuàng)意的產(chǎn)品轨功。
來源于：InVision
https://medium.com/@InVisionApp/7-tips-for-designing-awesome-animated-gifs-d51af4bae8b7#.9omr3wxzh
