Motion Engineering at Scale
Article Summary
Airbnb was shipping hundreds of features, but custom animations were getting cut due to complexity. Their solution? A declarative framework that reduced transition code from hundreds of lines to just a few.
Cal Stephens from Airbnb's iOS team breaks down their new declarative transition framework that powers animations across their 2022 releases. The system moves away from imperative UIKit patterns to make fluid animations as easy to build as screen layouts.
Key Takeaways
- Declarative transition definitions replace hundreds of lines of imperative animation code
- Framework automatically diffs view hierarchies and orchestrates shared element animations
- Powers major features in Airbnb's 2022 Summer and Winter releases
- Integrates seamlessly with existing UIViewControllerAnimatedTransitioning APIs
- Roadmap includes SwiftUI interoperability and cross platform expansion
Airbnb's declarative transition framework makes custom animations simple enough that engineers can ship polished motion design on tight timelines without architectural changes.
About This Article
Building custom transitions in Airbnb's UIKit required either putting two screens into one massive view controller or writing hundreds of lines of fragile UIViewControllerAnimatedTransitioning code. Either way, custom transitions took a lot of time and were hard to maintain across teams.
Cal Stephens' team built a declarative framework where engineers tag UI components with identifiers and define animations in a simple TransitionDefinition dictionary. The framework handles view hierarchy diffing and shared element animation automatically.
Engineers can now write complex transitions like search input expansion in just a few lines of code instead of hundreds. More engineers can add rich animations to features without tight timelines becoming a blocker, and there's no need to change existing UIViewControllerAnimatedTransitioning implementations.