Animations: Bringing the Host Passport to Life on iOS
In 2023, Airbnb introduced the Host Passport to enhance guest-host connections through personalized profiles. The passport appears in search results, allowing guests to learn about the host and their living space before booking. To create the animation, Airbnb used UIKit and their declarative transition framework. The passport rotates and unfolds like a book, using transparent views to achieve the page-turning effect. The integration with the animation framework enables a smooth transition from the search results to the modal view. The animation consists of synchronized movements, rotations, and shadows, each with its own timing curve. Airbnb employed spring timings for realistic elasticity but carefully tuned them to align with the modal transition timing. The result is a seamless and visually appealing animation that introduces hosts to guests, enhancing the Airbnb experience.