注：這兩天被這個項目碉堡了刷了屏，stormzhangV的這篇文章介紹了Airbnb開源的一個Lottie項目，Lottie實際是一個動畫渲染庫，但是，支持跨平臺，目前支持android、ios、reactNative。
剛好在Medium看到了Airbnb的工程師介紹Lottie的文章，以下為譯文：
Lottie介紹
在過去，在Android、iOS、React Native app中創建復雜動畫是一件較為困難的事情，需要為不同尺寸的手機準備不同的圖片，或者寫很多難以維護的代碼。所以很多app選擇不使用動畫，盡管動畫是一個很棒的提升用戶體驗的交互方式。一年前，我們決定改變這個狀況。
今天，我們非常開心可以介紹我們的解決方案。 Lottie支持Android、iOS、React Native平臺，支持實時渲染After Effects動畫，使得app中使用動畫可以像使用靜態資源一樣簡單。 Lottie使用從Bodymovin(開源的After Effects插件)導出的json數據來作為動畫數據。一個Javascript 播放器安裝Bodymovin插件后就可以播放動畫。從2015年2月開始，在Bodymovin的作者，Hernan Torrisi每月持續更新代碼的良好基礎上，我們團隊（Brandon Withrow負責iOS ，Gabriel Peal負責Android， Leland Richardson負責React Native，還有我負責體驗設計）開始了不同尋常的開發之旅。
輕松創建豐富的動畫
Lottie可以讓工程師創建更豐富的動畫，而不用艱難地重寫它們。Nick Butcher的 jump through 動畫, Bartek Lipinski的hamburger menu, Miroslaw Stanek的 Twitter heart 可以看到重寫動畫是怎樣艱難而耗時的工作。有了Lottie，再也不用管難以使用的api、猜測動畫運行時間、手動創建貝塞爾曲線、使用GIF創建動畫了。現在工程師可以使用Lottie精確地實現設計師的設計了。為了展示效果，我們重新實現了上文提到動畫，并在sample中提供了After Effect 和json文件。
我們的目標是支持更多可能的After Effects特性，從而實現更復雜的動畫。我們創建了很多動畫以展示 Lottie的靈活性、豐富性和支持特性集合。在sample app中，還有一些用于各種不同類型動畫的源文件，包括基本線條動畫、字母動畫和包括多個弧度變化和界面切換的動態logo動畫。
我們已經在應用的不同界面中使用了Lottie動畫，包括應用通知、全屏插圖動畫和我們的review流。而且我們計劃在通過這種方式使用更多的動畫。
靈活高效的方案
Airbnb是一個支撐百萬級房主和房客的國際化應用，所以擁有一個跨平臺、靈活的動畫格式是非常重要的。目前有一些類似Lottie的library，如Marcus Eckert的 Squall and Facebook的 Keyframes，但我們 的目標略有不同。Facebook只支持After Effects一小部分的功能，而我們要支持所有可能的功能。 對于Squall來說，Airbnb的設計師將結合它和Lottie使用，因為Squall的預覽功能非常強大，是我們工作非常必要的一部分。當然，它只支持iOS，而我們需要支持跨平臺。
Lottie還有一些靈活高效的API。它支持通過網絡下載JSON文件，這在A/B test中非常有用。它還有自己的緩存機制，所以頻繁使用的動畫，如wish-list heart，可以每次加載緩存的動畫。Lottie動畫通過 animated progress可以跟隨手勢，而且動畫的速度可以通過一個簡單的值進行設置。iOS甚至支持運行時增加額外的native UI，用于復雜的動畫過度。
除了已經實現的After Effects 特性和接口之外，我們還有很多未來的想法，包括把view映射到Lottie動畫，使用Lottie控制view 過渡，支持 Battle Axe’s RubberHose，漸變、類型和圖像。
建立社區
開源不僅僅是發布代碼讓別人使用，它是建立社區和連接用戶的一個橋梁，我們一旦通過github開源了Lottie給設計者和工程師，我們也想確保和動畫人員建立連接。
我們被9 Squares, Motion Corpse, and Animography這些已經建立的社區所鼓舞。所有這些社區連接了全世界從來沒有合作過的人去合作一些公共的動畫project。這些project耗費了數月時間，多個組織和團隊的爭吵，但是毫無疑問，這為動畫社區提供了巨大的價值。Motion Corpse 和 Animography分享了很多After Effects 的源文件，提供了大量的見解。
在以上的合作引導下，我們接觸到了所有的三個動畫團隊，在sample app中加入了動畫。包括Motion Corpse 中由J.R. Canest創建的動畫，9 Squares中Al Boardman的squares動畫，Animography的字體動畫，我們希望通過合并動畫社區和工程師社區的資源創造一些不同的東西。
我們希望大家喜歡Lottie，不論是設計師、動畫人員、還是工程師。有什么想法、反饋或者洞察，請通過lottie@airbnb.com 隨時聯系我們。
下載Bodymovin, Lottie iOS, Android and React Native.
歡迎關注公眾號wutongke，每天推送移動開發前沿技術文章：
推薦閱讀：
