以下內容為原創，歡迎轉載，轉載請注明
來自天天博客：http://www.cnblogs.com/tiantianbyconan/p/6364634.html
Lottie簡介（翻譯）
原文：https://medium.com/airbnb-engineering/introducing-lottie-4ff4a0afac0e#.mfnxbtt06
新的向本地apps的構建動畫的開源工具。
作者：Brandon Withrow, Gabridl Peal, Leland Richardson 和 Salih AbdulKarim
在以前，在Android，iOS和React Native app上面構建復雜的動畫是困難和冗長的過程。你要么不得不為每個尺寸增加大量的圖片文件，要么干脆編寫數千行不可維護的代碼。正因為如此，大多的apps並沒有使用動畫——盡管這是一個交流想法和創建引人注目的用戶體驗的強大的工具。一年前，我們就開始改變。
今天，我們很高興來介紹我們的解決方案。Lottie是一個iOS，Android和React Native庫，可以實時渲染After Effects動畫，並且允許本地app像靜態資源那樣輕松地使用動畫。Lottie使用名為Bodymovin的開源After Effects的擴展程序導出的JSON文件格式的動畫數據。擴展程序與JavaScript player捆綁在一起，可以在web上渲染動畫。自從2015年2月開始，Bodymovin的創建者，Hernan Torrisi通過每月為插件添加和改進功能，打造了堅實的基礎。我們的團隊（Brandon Withrow 在 iOS, Gabriel Peal 在 Android，Leland Richardson 在 React Native，和 我 在體驗設計上）在Torrisi的非凡的工作之上開始我們的旅程。
輕松地構建一個豐富的動畫
Lottie允許工程師構建一個豐富的動畫，而沒有艱苦地重寫它們的開銷。Nick Butcher's的跳躍動畫,Bartek Lipinski的漢堡菜單, 和Miroslaw Stanek 的Twitter愛心, 演示它們是多么困難和耗時，它可以用scratch重建動畫。使用Lottie，挖掘參考框架，猜測持續時間，手動創建貝賽爾曲線，並重新制作只有一個GIF作為參考的動畫將是過去了。現在工程師可以准確地實現設計者的意圖，究竟是怎么做的。為了證明它，我們重創建了它們的動畫，然后在我們的每個例子中提供了After Effects和JSON文件。
我們的目標是盡可能多地支持After Effects的特性，而不只是簡單的圖標動畫。我們創建了一些其他例子來展示庫的靈活性，豐富性和深入的功能集。在例子app中，有用於各種不同種類的動畫的源文件，包括基本線條藝術，基於字符的動畫，以及具有多個角度和切割的動態logo動畫。
我們已經開始在一些界面上使用我們自己的Lottie動畫，包括應用內通知，全幀動畫插圖和在我們的審查流程中。我們計划以一種有趣而有用的方式大大增加我們對動畫的使用。
靈活高效的解決方案
Airbnb是一個全球的公司，它支持數百萬的顧客和主人，所有在多個平台上播放的靈活動畫格式對我們來說是非常重要的。有一些與Lottie類似的庫，如Marcus Eckert的Squall和Facebook的Keyframes,但是我們的目標略有不同。Facebook選擇了一小部分After Effects的特性進行了支持，因為它們主要集中在響應，但是我們想要盡可能多地支持。至於Squall，Airbnb的設計師組合Lottie來使用它，因為它有一個驚艷的After Effects預覽app，這使得它成為我們工作流必要的一部分。然而，它只支持iOS，我們的工程師團隊需要一個跨平台的解決方案。
Lottie還在其API中內置了幾個功能，使它更多樣化和高效。它支持通過網絡加載JSON文件，這在A/B測試是非常有用。它還有一個額外的緩存機制，所以頻繁使用的動畫，比如一個願望清單的愛心，可以每次加載一個緩存的副本。Lottie動畫可以通過使用動畫進度功能的手勢驅動，並且動畫速度可以通過簡單改變值來控制。iOS甚至支持在運行時增加額外的本地UI到一個動畫中，這可以用於復雜的動畫過渡。
除了我們迄今為止的增加所有After Effects特性和API之外，我們還有許多未來的想法。它們包括映射視圖到Lottie動畫中，使用Lottie控制視圖過渡，支持Battle Axe 的 RubberHose，漸變，類型和圖像的支持。最難的部分是下一個特性支持應該選擇哪一個。
構建社區
作為開源發布一些東西，並不只是把它拿出來做為公共使用。它是一個人跟人之間連接和交流的橋梁。隨着我們更接近通過GitHub向設計師和工程師發布Lottie，我們也想確保與動畫人員進行連接。
我們受到了創建的9 Squares，Motion Corpse和Animography的啟發。所有這三個都聚集了來自世界各地的人，在公共動畫項目上合作，他們可能永遠不會一起工作。這些項目花費了幾個月的工作和很多的組織，各自團隊的爭論，但是它們無疑對整個動畫社區提供了巨大的價值。Motion Corpse 和 Animography 公開分享了After Effects的源文件，它們提供了大量人們怎么工作的深刻的見解。
在他們的合作領導下，我們接觸了所有這三個團隊，為我們的示例app貢獻了動畫。我們包括了一個來自 Motion Corpse J.R Canest 創建的動畫，來自9 Squares 項目的 Al Boardman 的square之一，和一個使用Animography的Mobilo動畫字體的鍵盤動畫，其中有二十多個藝術家的工作。我們希望這些動畫社區與強大的工程社區的合並將產生一些特別的東西。
從左到右：Motion Corpse 的 Jr.canest，來自 9 Squares 的 AI Boardman，Animography 的 Mobilo 字體動畫
我們想聽到你怎么去使用Lottie——不論你是一個設計師，動畫師，還是工程師。請隨時直接通過 lottie@airbnb.com 帶着你的想法，反饋，見解與我們聯系。我們很高興看到當他們開始以我們從未想象的方式使用Lottie時，世界各地的社區將會做些什么。
下載 Bodymovin，Lottie iOS，Android 和 React Native
最初發布於 airbnb.design/lottie/