Dribbble 上流暢優雅的 GIF 是用什麼軟體做的？
或者通常用的什麼軟體？有這類動畫的教程推薦么？
ps:我知道這些應該是用做動畫的軟體做好後導成.gif的，我想了解的是這些GIF可能是哪些動畫軟體做出來或者說能夠做出來的，先謝謝大家了：D
例如這樣的：
We"re On Facebook! {gif}
這樣的：
http://dribbble.com/shots/1054967-Michael-Dolej-s-Free-Colorful-Icons-Animated?list=users
Dribbble 上的動畫一般是用動畫編輯軟體做的，因為 Dribbble 不能發布視頻格式的作品，所以設計師們一般將做好的視頻轉換為 GIF 格式。
製作動畫的軟體有很多，比較簡單的動畫可以直接用 Photoshop 做，大多設計師應該用的是 After Effects，因為界面類似 Photoshop，很好上手。此外也有 Cinema 4D（3D 動畫），Quartz Composer，Flash 以及 Adobe Edge（HTML5 動畫）等等。在 Flash 盛行的年代，或許有人會回答你說這是 Flash 做的。
但現在更多的可能性是 After Effects，而這類動畫也被歸為了 Motion Graphic。
大部分 Motion Graphic 的作者都會選擇 After Effects，可這不是絕對；但你舉的兩個示例都可以輕鬆用 AE 去實現。
一般來講我做完視頻之後想要轉成 GIF 的話：
直接拖到 Photoshop 里，Save for Web（以 Web 格式保存），選 GIF，在這裡你可以控制尺寸、質量、以及這段動畫是否循環。
另外，這是我做的一個小動畫，是 ZEALER 一個節目的片頭（前十秒是廣告）: 「ZEALER 出品」Shawn Talk 第一期 老羅發布會點評
—
對 Motion Graphic 方面我只是一個愛好者以及初學者，老實講大概在去年的這個時候我也什麼都不懂，只是知道這個詞語。
看樣子你應該對這方面很感興趣，希望你可以早日上路，喜歡很簡單，不去上，終究不會是自己的。
—
補充一句：知道了這東西叫什麼了的話，教學，就交給 Google 吧~一般來說的話，簡單的動畫直接用Photoshop就可以做，互動複雜的，用After Effects。（因為我不會別的動畫軟體了...）
題主發的兩個 dribbble 上的案例原作者都是用 After Effect 製作的，原作者已經告訴大家了：「 just AE to Photoshop nothing special」
再來介紹一下這些動畫通常都是由哪些軟體做的
1. After Effect
AE 本身是一個非常優秀的視頻處理軟體，美國大片裡面的很多特效鏡頭都是由它來完成的，由於它可以導入 Photoshop 中的圖層 ，使 AE 可以對多層的合成圖像進行控制，它又是 Adobe 系列的軟體，只要熟練使用 Photoshop，對於它的學習成本就會很低（當然是入門學習），同時它又支持其他 Adobe 系列格式的文件，可以很方便的製作出一些比較酷的動畫，所以很受廣大設計師的青睞。
優點：可以製作很豐富的動態效果或者特效
缺點：不可以對動畫進行操作
2. Flash
這個軟體大家應該都比較熟悉了，它同樣是 Adobe 系列的軟體，不過它是專門做 2 維動畫的，喜洋洋灰太狼這部動畫就是由它搞定的，它也被廣泛用於網頁動畫。
優點：可以做各種交互，如點擊事件，拖動行為，都可以很方便的製作
缺點：處理特效能力很有限
3. Origami
它最近可是設計師們的新寵呀，基於Quartz Composer的免費工具包簡化了設計師使用QC原型製作的流程，提供了設計常用的模塊。採用信號流製作思路，其他大部分軟體都是基於時間軸的思路來製作的，極為優秀的可交互原型設計工具。炫酷的 APP Facebookpaper 動效都是由它來搞定的。
優點：學習成本低，專門為產品設計而生，比較容易實現流暢的動畫和操作邏輯。
缺點：非常有限的學習資料工具可能還有很多，這只是個人覺得比較常見的，其實工具也不是那麼重要，用什麼也看個人的喜好，有的人甚至能用 Powerpoint 製作交互動畫。
希望對題主有幫助，至於教程的話有時間再整理一些發出來。
在這裡為博主分享一些自己做動畫時候的經驗吧，也分享給大家，希望能夠對希望同行的設計師有一些幫助。
我自己是使用motion5來製作動畫和動效的，那關於motion5的教材，其實並沒有AE那麼多，那我自己也在ui中國或一些在線教育產品上試圖搜索，教材都不是很多，那這裡為大家分享一下個人做motion5動效的一些經驗，鏈接如下：馬志凱的設計作品-UI中國
但是由於視頻源是youku，所以視頻清晰度有損失，顧又在麥子學院特意發布了高清的教程，童鞋們可以去觀看，鏈接如下：課程簡介和大綱
這裡可以看到整個課程大綱：
課程章節：1. 課程簡介和大綱2. 動畫簡介3. 熟悉界面4. 導入素材5. 摳像器和濾鏡庫6. 繪製動畫 A7. 繪製動畫 B8. 文本動畫9. 關鍵幀動畫 A10. 關鍵幀動畫 B11. 關鍵幀動畫 C12. 關鍵幀動畫 案例 A13. 關鍵幀動畫 案例 B14. 關鍵幀動畫 案例 C15. 遮罩動畫 a16. 遮罩動畫 b17. 複製器 a18. 複製器 b19. 複製器 c20. 發生器動畫 a21. 發生器動畫 b22. 發生器動畫 c23. 三維動畫 a24. 三維動畫 b25. 三維動畫 c26. 攝影機 a 27. 攝影機 b
那這些章節也希望能夠對希望學習動效的盆友有幫助。
最後再來回復一下主樓的問題吧，關於搜索動效的網站，我也有幾個自己經常去會使用的網站，這裡就列舉幾個吧：
ugif
ugif.cn
http://www.dribbble.com
還有就是http://bechance.com
另外在上樓也有朋友分享的網站，也可以去進行搜索
希望我的經驗對大家有用處吧~
同時再為喜歡做gif動效的設計師提供一下motion5和fincut pro的下載鏈接，並且還有一個製作gif很好用的工具鏈接。
http://www.ui.cn/detail/80169.html （motion5高清視頻教學來啦！）
motion5 安裝包下載-UI中國
final cut pro的安裝包吧~-UI中國
http://pan.baidu.com/s/1mg6KROk （gif工具）
建議你試試gif喵 gif喵-斗圖達人最愛的表情包搜索平台
gif的作者已經說了
just AE to Photoshop nothing special 
謝邀。
對Dribbble不了解，但可以提兩個GIF製作軟體。
菜鳥級：movgear
專家級：adobe imageready
第一，我先講一下做motion graphic我認為比較高效率的導出方式。
第一步：AE做動畫做完導出 格式選擇quicktime
第二步：打開PS，ctrl+shift+alt+s（文件-儲存為Web格式），選擇gif（可以選擇循環可以一次結束，看需求）完成。
這個方式是我用過效果最好的。
你會遇到的問題（其實是我自己遇到的）：
1.gif太大，很容易太大的，所以要注意AE做視頻的時候每秒的幀數 適當調到15 16之類 第二就是控制時長和大小 當然大小在PS里也可以調。
2.gif在色彩和畫面的表現上是會出現問題的，不建議使用像半透明、很多色彩或者複雜漸變的。如你所見追波上面的motiongraphic動畫都是選擇幾個固定的顏色，很少有漸變。
第二，怎麼做motion graphic？
我是有專業背景，所以課上有學，但是我認為最好的學習方式是這樣：
1、學會fanqiang，VPN也好chrome插件也好
2、登陸youtube，搜索「motion graphic tutorial」
1.比較in，東西新，學起來也有意思。
2.人家是一步一步做的，聽不懂英語對著做也學會了。第三，除了追波和本漢塞，別忘了一個網站叫Vimeo。
最近剛在公眾號上發了一篇，沒什麼人看，想著來知乎發一發：【玩相機】Cinemagraph製作指南（上）
不過也許有人不願意打開，我在這裡也發一次吧。
-----------------------------------------------分割線-------------------------------------------------------------
與傳統GIF動畫相比，Cinemagraph畫面更美，並且由於大部分畫面是靜止的，大大壓縮了動畫的信息量，還能讓觀眾的實現集中到某一細節處，在這個讀圖時代大有用處。這是一種新的照片形式，一種更生動的圖片，或者說是更像圖片的視頻。做數字媒體營銷的青年們好像很喜歡這個技術啊，運營汪們學會這個，你的大BOSS不愛死你？？？
好的，我們先從簡單的開始，這一次你只需要一個PS。
然後，拍攝一段固定鏡頭的視頻，最好使用三腳架。
一定要固定鏡頭的視頻，這樣你就不需要做其他處理，直接用PS可以省下很多不必要的精力。
直接把剪輯好的視頻拖進來，我略過視頻製作的步驟。公眾號里有AE部分的內容可以看！！！今晚（7月9日）發布！記得拖進來就按Ctrl+S，勤保存是一個好習慣，尤其處理視頻，電腦不太好的話，哭死你。
拖動時間條，以幀為尺度進行細調，PS只能做簡單的剪輯，所以剪輯工作需要用AE或者PR。在PS里進行每一幀的細調，尋找最適合做靜態圖的一幀。
Cinemagraph的原理就是用一幀靜止的圖像覆蓋在視頻上，用數字技術扣出需要運動的部分。這樣不僅提高作品的趣味，比靜止攝影更有靈性，從工程的角度來說，大部分靜止的畫面還能節省數據量，大大壓縮視頻的大小。
找到最合適做靜止畫面的一幀後，把這個瞬間的圖片固定下來，使用屏幕截屏快捷鍵Ctrl+Alt+Shift+E，這個快捷鍵是用來給所有圖層都有影響的畫面拍照。總之就是截圖，按一次就明白了。記得在截圖之前，在視頻軌這裡選中這段視頻，如圖所示，先選中再截圖。
完了你能得到兩條視頻，上面紫色的是靜止幀，把它與下面的視頻對其，完整的覆蓋在視頻上面。
好了之後，就開始摳圖了。摳圖的細緻程度決定了你圖像的檔次，請認真做，不要著急。為截圖圖層添加蒙版，點擊右下角的蒙版。選擇畫筆工具，記得把畫筆顏色調成黑色。畫筆硬度不要太大，不透明度調低。然後開始對著希望運動的區域畫，一直磨到你覺得完美為止，播放看看。如果有問題，細心畫，這是一個不需要技術，但是很殺耐心的工作。
扣好之後大概是這樣的，點擊播放基本就是最後的效果。如果扣圖的過程有失誤，用白色畫筆把黑色畫筆覆蓋掉就可以了，具體原理，參閱Photoshop的蒙版工作機理。
可是出現了問題，發現最後一幀和最開始一幀的銜接不舒服，畫面會跳一下，感覺不和諧。所以我決定導出視頻拿到AE里做個處理，讓這段視頻正放一次，接著倒放，這樣就能永遠重複這個動作，不會顯得不自然，PR也可以，都一樣，播放 一段正的一段反的，把交叉的一幀刪掉就可以非常完美的銜接兩段視頻了。
PS的導出視頻在這裡。
進行一些必要的導出設置，然後拿到其他軟體里編輯，很簡單的剪輯活，AE和PR都可以做。
視頻處理好基本就可以了，再把做好循環的完整視頻放回PS里。
到了這一步基本已經完成了，已經能夠導出一個有趣的Cinemagraph了。也可以再進行一些簡單的調色，就像對照片調色一樣。
然後最後一步就是導出，快捷鍵是Ctrl+Alt+Shift+S。
這一步只需要注意文件的大小，直接改變右下角的百分比就可以控制文件大小。
某公眾平台只能接受2M以下的GIF圖片。
導出前記得把循環選項改為永久，然後點擊存儲就可以導出你的Cinemagraph啦。
知乎好像不能看最終效果，可以到我的公眾號里看！么么噠~
公眾號：sphinxqiang
或者直接搜索：斯芬克斯強
【二維碼貼上來就被自動識別了......】
軟體的話多數是AE製作的，導出成視頻或者幀序列，然後導入到PS裡面轉成GIF格式上傳到dribbble。
MG動畫的教程可以看看doyoudo家的，很不錯：
【AE製作MBE風格雪糕】01、形狀層勾畫技巧
用AE製作卡通風打網球MG動畫
即刻貓掃地動畫01、在AE里畫出貓的形狀1
01、繪製出可愛的小按鈕
在AE里製作蹦蹦跳跳的皮球MG動畫
在AE里製作卡通倒計時動畫
AE角色動畫技術—路飛走路(1/2)
在After Effects中製作 Material design風格的動畫
在AE里製作書本翻頁的GIF動畫
既然已經知道怎麼弄成GIF，那我僅就動畫製作的問題說一說我的看法。
這種流暢程度極有可能是AE做的，Flash也可以做出，但僅就這種動畫而言，Flash的效率相對AE要低一些。當然，最不可能的就是用PS做，因為PS一般達不到這個流暢程度，要達成這種流暢程度，需要較多的工作量。
教程什麼的網上都有，但請你記住，製作這些東西需要的技術都是基礎活，真的能促使你作出好的動畫的還是看技術之外的東西。如果想要達成某種效果，什麼軟體都可以拿來用，但是他們只是你實現目的的工具，而不是他們把你當成工具。
絕大多數gif都是每秒10幀等速度播放的
但有少部分不是這樣的,幀與幀之間的間隔可以不同(某些幀可以停留的時間長點)
如果只是將圖片合成為gif
可以用imagemagick
convert -delay 20 *.png o.gif
如果你說那種10多秒的動畫的話，我推薦
## Gifgun
http://www.lookae.com/gifgun151/
一鍵到處gif，可設置尺寸，渲染模式。導出的gif很清楚。當然控制大小還需要你自己設置
我很少答題，點個讚唄
嗯……我也想問的是不是有實用的乾貨教程可以參照學習？
我的習慣是，先在ae做齣動畫，導出*.png動畫序列幀，再用Ulead GIF Animator5.0生成gif動畫。
Leo Lee - Dribbble
我的大觸同事，擅長像素畫。
他一幀一幀畫的。
居然還有回答專家級adobe imageready的。
既然知道imageready，那肯定知道同時代的Macromedia Fireworks吧，真·專家級gif動圖製作。
為什麼所有答案沒一個提及Fireworks？
可能是用AE做齣動畫視頻，然後用類似U5的GIF軟體優化轉化出來！一般純色的GIF比較小！
推薦閱讀：
※從哪裡可以找到一些好的dynamic infographic或motin graphic視頻案例 或者推薦一些網站？謝謝