Seamless navigation made possible with view transitions.

Technical details of implementation

• View Transitions API allows developers to create smooth and seamless transitions between different views or states of a web page.
• It uses snapshotted views to change the DOM without any overlap between states and provides transition animations for a better user experience.

Business impact

• CyberAgent implemented view transitions to enhance the user experience on their news portal site, Ameba News.
• They used different classes and animations to create smooth transitions between different parts of the page.
• This implementation made their multiple page app appear more like a single page app, improving user engagement.

CyberAgent testimonial

• CyberAgent was excited to use the View Transitions API to create engaging and seamless page transitions.
• They implemented view transitions on their news portal site to enhance the user experience and make it more app-like.

Nykaa implementation

• Nykaa, an online beauty retailer, implemented view transitions to enhance the user experience on their web page.
• They were satisfied with the improved UX and are planning to implement view transitions on additional pages as well.

PolicyBazaar implementation

• PolicyBazaar, an insurance comparison website, implemented view transitions to improve their mobile web experience.
• They wanted to make their web experience as close as possible to their native app experience.
• View transitions allowed them to visually focus users on the most important messages and improve user engagement.

Other developers' use of view transitions

• redBus, an online bus ticket booking platform, rolled out customized animations for page transitions even before the View Transitions API was developed.
• They were excited to use the View Transitions API to create engaging page transitions and provide a unified, app-like web experience.

Sample code and resources

• More sample code on how to use View Transitions with React can be found here.
• Developers can use the View Transitions API to create seamless transitions and enhance the user experience on their web pages.