Animation Rendering Engine

1 post · Dec 2013 – Nov 2016

What this trail covers

Meta's animation rendering engine has evolved with the introduction of Pop, an open-source iOS animation engine that provides dynamic animations like spring and decay, building upon Core Animation's capabilities. This builds on previous efforts in delivering high-quality, scalable animations to mobile clients, such as Keyframes for After Effects animations. The Paper app further advanced this by implementing physics-simulating animations for a more intuitive and realistic user experience, going on to open-source Rebound, a physics-based animation library for Android that allows for the creation of spring dynamics animations, enabling more natural and responsive user experiences.

All Meta trails

Nov 2016Keyframes: Delivering scalable, high-quality animations to mobile clientsThis post introduces Keyframes, a new library developed to address the challenges of delivering scalable, high-quality animations to mobile clients. Keyframes allows for the export and playback of After Effects animations by extracting vector-based shape and animation data (keyframes, timing curves) into a compressed JSON format. This format enables real-time rendering at any size on iOS (Core Animation) and Android (graphics library), preserving animation quality and minimizing file size. The library was developed to overcome limitations of existing formats like PNG, GIF, and SVG for the specific requirements of the Reactions feature.
Apr 2014Introducing Pop, the animation engine behind PaperThis post introduces Pop, an open-source iOS animation engine. It adds dynamic animation types (spring, decay, custom) to complement static animations, takes velocity as input for gesture responsiveness, and is extensible to animate any property of any Objective-C object. The API is designed to be familiar to Core Animation developers.
Mar 2014Building PaperThis post introduces the Paper app's engineering approach, emphasizing a mobile-first design and a new level of interactivity driven by physics-simulating animations. It details how the app minimizes chrome, uses gesture-driven interfaces, and integrates physics simulations for natural animations, going beyond traditional Core Animation. The post also announces future technical deep dives into asynchronous UIs, advanced interactions, and GPU optimization, alongside open-sourcing KVOController and Shimmer.
Dec 2013Under the Hood: Building and open-sourcing the Rebound animation library for AndroidThis post introduces and open-sources Rebound, a new physics-based animation library for Android. It details the motivations behind its creation, including the limitations of time-based Android animation frameworks for physics-driven interactions prototyped in Quartz Composer. The post explains the underlying concepts of spring forces and damping, and demonstrates how Rebound simplifies the implementation of physics-based animations by allowing developers to declaratively change target end states and spring configurations, letting the physics engine handle the animation. It also highlights the library's portability to JavaScript and its potential for creating complex UI abstractions.
Advertisement