Facebook today open-sourced Pop, the engine behind Paper’s smooth animations and transitions, over on GitHub. Pop uses dynamic instead of traditional static animations to control the scrolling, bouncing, and unfolding effects in the social news app.
Facebook software engineer Kimon Tsinteris, who co-founded Push Pop Press before joining the social networking company in August 2011, notes that iOS has always excelled at supporting static animations. “The Apple-provided Core Animation framework makes linear, ease-in, ease-out, and ease-in-ease-out animations simple to leverage,” he explains.
F**k it, we'll do it live!
Our biggest ever edition of TNW Conference is fast approaching! Join 10,000 tech leaders this May in Amsterdam.
Tsinteris adds, however, that his animation engine goes a level higher: “With Pop, we are able to keep the familiar and powerful programming model of Core Animation while also capturing a gesture’s velocity and better reflecting user intent.” He argues that touch interfaces have led to a new wave of software design, with direct manipulation of on-screen elements raising user expectations of the screen as a medium, and if objects respond to our touches, responding to the velocity of our flick is the next logical step.
Pop was designed with three goals in mind:
- Commonly needed animations are “extremely convenient.” In addition to the four established static animations, Pop introduces three new primitive animation types: spring, decay, and custom. Spring is responsible for Paper elements’ attractive bounce while Decay brings movement to an eventual slow halt. Both take velocity as an input and realistically respond to user gestures.
- It’s an extensible framework, meaning custom animation allows iOS developers to plug-in their own animation code, making it easier to create unique effects. By decoupling animation from display, the framework is of wide scope, allowing it to animate any property of any Objective-C object.
- It’s a developer-friendly, yet powerful, programming model. Developers who know how to use Core Animation explicit animations will know how to use Pop.
The only way to see how well the above has been achieved is to give Pop a shot. Since it’s freely available, this one is a no-brainer.
➤ Pop (GitHub)
Top Image Credit: Justin Sullivan/Getty Images