Posted by Nick Butcher – Product Manager for Jetpack Compose, and Florina Muntenescu – Developer Relations Engineer
adidas CONFIRMED is an app for the brand’s most loyal fans who want the latest curated collections that can’t be found anywhere else. The digital storefront gives streetwear, fashion and style lovers access to adidas’ most exclusive drops and crossovers, so they can shop them as soon as they go live. With a focus on delivering a premium experience for users, the adidas CONFIRMED team is always looking for new ways to improve the app’s UX. Today, developers are better equipped than ever to enhance the in-app experience using Assemble your jetpackAndroid's modern declarative toolkit for building user interfaces.
Improve UX with Jetpack Compose
adidas CONFIRMED designers conduct quarterly consumer surveys to gather user feedback on new app flows and UI improvements. Their surveys showed that 80% of app users prefer moving images because animations encourage them to explore and interact with the app more. adidas CONFIRMED that developers wanted to implement new design elements and animations into the app's interface to increase engagement, but the app's previous View-based system limited their ability to create an engaging UX in a scalable way.
“We decided to build dynamic elements and animations into many of our screens and user journeys,” said Rodrigo Represa, an Android engineer at adidas. “We had an ambitious list of UI updates we wanted to make and started looking for solutions to make them happen.”
By switching to Compose, adidas CONFIRMED developers were able to create features faster than ever before. The improvement in engineering efficiency is noticeable, with The team estimates that Compose allows them to create new features about 30% faster than with Views. Today, over 80% of app UI has been migrated to Compose.
In-app experience innovation
As part of the app’s new interface update, adidas CONFIRMED developers created an exciting, animated experience called Shoes Tournament. This competition pits different brand-collaborator sneakers against each other in a digital tournament where users vote for their favorite shoe. Two developers built this feature from the ground up in just three months using Compose. And users loved it — The number of weekly active users of the app increased by 8%.
Before moving to Compose, it was difficult for the team to customize the adidas CONFIRMED app to incorporate their collaborators’ branding. With Compose, that’s easy. For example, the app’s developers can now create a dynamic design system with CompositionLocals. This functionality helps developers update the look and feel of the app as collaborations launch, creating a more engaging user experience while maintaining a consistent, clean design.
One of the most exciting animations adidas CONFIRMED developers added made use of device sensors. Users can view and interact with the products they are viewing on product view pages by simply moving their devices, just as if they were holding the product in real life. Developers used Compose to create realistic lighting effects for the animation, making the viewing experience more engaging.
An easier way to build a user interface
By using composables, adidas CONFIRMED developers were able to reuse existing components. Because both the adidas flagship app and the adidas CONFIRMED app are part of the same monorepo, engineers were able to reuse composables, such as forms and lists, in both apps, allowing them to quickly and easily implement new features.
“Accelerating development with Compose freed up our team of seven, allowing us to strike a healthy balance between delivering new features and ensuring the long-term health and sustainability of our app,” said Rodrigo.
Compose also helped improve the stability and performance of the app for the team. They noticed a significant reduction in app-related crashes and have seen virtually no UI-related crashes since migrating the app to Compose. The team prides itself on delivering a 99.9% crash-free user experience.
A better app, built with the future in mind
Compose opened the door to implementing new features faster than ever before. With Compose’s clean and concise use of Kotlin, it was easy for developers to create the ambitious and engaging interface that adidas CONFIRMED users wanted. And the team doesn’t plan on stopping there.
The adidas CONFIRMED team wants to dive further into the new codebase and fully embrace Compose. They also want to bring the app to new screens with more of the Compose suite and are currently developing an app widget with Jetpack canThis new experience provides users with a streamlined feed of new product information for an even more efficient user experience.
“I recommend Compose because it simplifies development and is a more intuitive and powerful approach to building user interfaces,” said Rodrigo.
Getting Started
Optimize your UI development with Assemble your jetpack.