Open, Edit and Export Lottie Animations in Keyshape

The Keyshape animation tool has a new plugin to import and export Lottie animations.

Lottie is a Web, iOS, Android and React Native animation library created by Hernan Torrisi and the Airbnb design team. The library makes using animations in apps easier than before. It reads and renders JSON files, which contain animated vector data. Usually, the JSON files have been created in After Effects.

The new plugin for Keyshape can read Lottie JSON files so that they can be edited in Keyshape. The plugin can also export JSON files, which can be played back by the Lottie library. This means that Lottie animations can be created without After Effects.

The plugin is available on GitHub. Since the Lottie JSON file format may change in the future, the plugin has been made open source. That way changes and fixes to the plugin can be made without updating the Keyshape app.

Lottie logo with a bouncing ball

LottieFiles is an online community where Lottie animations can be shared. It has hundreds of animations with downloadable JSON files. Inspecting them in Keyshape is a great way to learn how they have been created.

Lottie Web, iOS and Android libraries have slightly different capabilities so its a good idea to test animations in them. LottieFiles has a previewer exactly for that. It includes an app for iOS and Android to preview animations on mobile devices.

The Keyshape Lottie plugin has some limitations. For instance, path trimming (line animations), masks, clipping and play range times are not supported. They will be added in the next Keyshape version. Check the GitHub page for details about other limitations. Some of them cause animations downloaded from LottieFiles look a bit broken.

Get the new plugin from GitHub and check LottieFiles for examples. Create animations in Keyshape and share them on LottieFiles.

The Lottie logo is reproduced or modified from work created and shared by Airbnb / LottieFiles and used according to terms described in the Creative Commons 4.0 Attribution License.