12款卓越工具幫你利用HTML5創建動畫效果
隨著互聯網的不斷發展，特別是Web開發工作的比重日漸加大，HTML 5正以一往無前之勢邁出自己的普及步伐。HTML 5目前已經成為Web設計師與開發者們最為青睞的語言之一。它為我們帶來了豐富的功能組合，包括跨瀏覽器兼容能力、擁有出色定義的標簽、易用性、極具視覺 沖擊力的元素、支持JavaScript等腳本語言以加強功能、層疊樣式表（即CSS）集成以重新定義顯示效果等等。而就在HTML 5興起的同時，動畫、視頻與音頻作為表現手段也開始大量加入進來。如今的瀏覽器不再需要依賴插件即可顯示交互動畫。將JavaScript、HTML 5與CSS 3相結合能夠創建出令人過目難忘的精彩動畫效果。這些動畫不僅能夠讓我們的網站從同類站點當中脫穎而出，同時也將帶來更多潛在客戶。
目前市面上可供選擇的動畫工具非常豐富，而我們則從其中整理出了十二款最為卓越的工具選項。在這些工具的幫助下，大家不僅能夠擁有更為輕松的動畫創 建流程，同時也能獲得更多收益——一旦開始使用，它們將為各位的網站帶來前所未有的深度。這些工具一部分能夠在線使用（需要互聯網連接），一部分則可以下 載并作為支持該軟件的系統平臺上的獨立應用來運行。
下面讓我們首先來看各在線HTML 5動畫制作工具。
1) Animatron: 動畫巨頭工具
顧名思義，這款工具能夠創建出優秀的HTML 5動畫。其出色的易用性讓新手與專家之間的邊界變得非常模糊。此外，它也允許我們將項目保存在云端并隨時加以訪問。有了這款強大的編輯工具，我們可以創建出各類適合不同平臺的動畫內容——從臺式電腦到移動設備皆可輕松應對。
2) HTML5 Maker: 您的廣告生成器
這款工具當中收錄了大量模板，大家可以選擇合適的項目建立自己的網站。各位只需要替換模板當中的文字與圖像，即可輕松完成創建。這款工具主要面向廣告公司等用戶，其中包含豐富的動畫資源，可用于設計出各類出色的banner。
3) GSAP:下一代動畫工具
GSAP是一款現代瀏覽器，允許設計師將任何顯示元素創建為動畫，而又無需預先定義作為選項儲備的屬性列表。即使某些功能沒有被直接提供，大家也可 以通過創建插件的方式加以實現。它能夠將加載時間控制在最低水平，從而帶來出色的性能表現，這是因為它的起效并不基于任何第三方工具。除此之外，它還擁有 一整套活躍的支持社區，能夠瞬間為我們帶來良好的問題解決辦法。
4) Mugeda: 基于云的動畫設計工具
Mugeda能夠幫助設計師將自己的想象與構思真正轉化為堪稱視覺奇跡的元素、迷你游戲、banner以及填充效果。Mugeda Cloud Studio與Mugeda Java Script API提供了一套獨特的平臺，在這里開發人員與設計師能夠協同工作，從而大大降低構建所需的時間與成本。它還提供基于云的專業IDE，其中包含有操作、時 間軸與符號等。
好了，接下來我們一起來看看那些能夠作為獨立應用程序自主運行的各類工具。
5) Google Web Designer:一款令人贊嘆的動畫工具
創意工廠谷歌公司此次拿出的方案同樣值得我們大加贊揚。這款工具能夠使用大部分美觀且極具感染力的HTML 5內容，從而打造出符合想象的視覺效果。它為我們帶來多種最先進的動畫功能，包括以任意軸為參考操縱3D對象并旋轉2D設計對象。除了設計工作之外，它還 能夠與Google Drive、DoubleClick Studio以及Ad Words等解決方案相整合。
6) Edge Animate CC:來自Adobe的動畫工具
隨著Adobe Edge Animate的出現，如今動畫制作工作已經變得更為輕松。它能夠更好地與各類桌面及移動瀏覽器協作并為其提供支持。它創建出的動畫可承載豐富的媒體元 素、數字化出版物、廣告、Web乃至其它重要內容。在最新版本中，這款工具還能夠實現音頻、腳本載入以及響應度調整等功能。
7) Radi: 最佳矢量圖形處理工具
Radi是一款用于在Mac OS X系統平臺上創建動畫、視頻以及實時圖形的工具。在Radi的幫助下，大家用不著再費心將網絡頁面渲染成視頻文件，而只需要創建一個〈video〉元素并 將其拖拽到頁面層中即可。它還擁有一項獨特的功能，允許大家直接在應用程序當中創建矢量圖形。
8) Hippo studios: 強大的動力車間
Hippo studios提供一系列豐富的功能選項，能夠切實幫助我們完成動畫設計。它允許用戶使用矢量圖形對對象尺寸進行完美雕琢。大家可以將油Tube、 MP4、Ogg以及WebM等格式的視頻資源添加進入并利用HTML 5進行播放。除此之外，它還允許我們向其中添加幻燈片及圖像網格。
9) Node Fire:理想的響應式動畫創建工具
Node Fire是一款響應式動畫創建工具，能夠被用于開發Web應用程序以及獨立應用程序。它能夠自動處理鼠標及點觸操作事件并提供延遲計時器支持機制，從而實 現各類復雜的操作方式。在這款工具的幫助下，設計師們能夠創建出任意CSS樣式動畫并在設計模式下追蹤動畫的變化情況。值得一提的是，它還將場景窗口概念 的支持能力提升到了新的高度。這一概念允許大家創建多個窗口，添加或者刪除其中某個窗口。我們也可以在某個事件被觸發時播放以及暫停這些窗口的視覺效果。
10) Tumult Hype 3:讓內容更加豐富
Tumult Hype的關鍵幀動畫能夠讓顯示內容變得更加豐富。這款工具會幫助用戶創建出電子卡片、教育電子書（通過在現有電子書基礎上添加更多動畫化教育內容）乃至 信息圖表（用于實現數據點的可視化與展示工作）等等。它還集成了一套JavaScript編輯器，能夠幫助大家根據實際需要編寫出自定義功能。
11) Motion Composer:一套高度自動化解決方案
Motion Composer能夠針對每一種內容狀態創建出幻燈片，而不必另行為其選定動畫樣式，這就大大降低了用戶的工作負擔。此外，它還能夠自動創建出動畫路徑而 無需對動畫內容進行逐幀操作，這又進一步簡化了相關流程。我們所創建出的動畫成果能夠在各類平臺上正確顯示——包括臺式機、智能手機以及平板設備等。
12) Purple Animator: 你的應用程序開發工具
Purple Animator能夠被用于移動平臺以及臺式機設備。這款工具從本質上講專門面向數字化出版物，從而使整個生產過程變得輕松且快捷。它能協助大家開發出自己的游戲、雜志、網站以及應用程序。它還允許我們利用時間軸編輯器設計出各種美輪美奐的動畫效果。
在今天的文章中，我們列舉了十二款出色的HTML 5動畫創建工具。其中一部分能夠以在線方式直接使用，另外一些則支持下載并以獨立應用程序方式自主運行。本文的主要目的在于整理出一套實用工具列表，其中 的每款工具都能夠在至少一個方面獨當一面，包括游戲、動畫、廣告、HTML標簽瀏覽器兼容性測試以及3D動畫等。
也許大家在日常工作中也有著自己的選擇，并認為它們足以同樣名列此份榜單。請在評論欄中分享您的觀點，幫助我們及更多設計與開發人員從您的真知灼見中受益。
原文鏈接：http://codecondo.com/tools-for-creating-animations-with-html5/
原文標題：Top 12 Tools for Creating Animations with HTML5