River Island
Andriod/iOS Checkout
UX/UI
Design System
Discovery, design and delivery of historic high-street brand River Island's checkout across iOS and Android.
We transitioned from a underperforming multi-page, webview to a to a one-page, native experience that enabled one-tap payments for the majority returning users.
Year
2023
Sector
Retail
Agency
&us
Client
Role
Product Lead
Emily Haddrell
Challenge
River Island sought to boost conversion rates, enhance user satisfaction, and streamline the payment process across their Android and iOS apps.
The apps had been underperforming compared to web in key metrics. The hypothesis was that their outdated webview checkout was the main culprit. The task was to validate this assumption and design an improved solution.
Approach
The project adopted a human-centered design methodology, emphasising discovery, validation, and iterative refinement to address core problems and uncover hidden opportunities. Through competitor analysis, analytics, and user interviews, two primary pain points were identified during the checkout process, alongside several smaller issues:
- Confusing, nested journeys
Customers often had to navigate unnecessary sub-journeys to access key information, such as delivery times and prices. - Repetitive data entry
The existing multi-page checkout required returning users to repeatedly confirm or re-enter delivery, address, and payment details for every purchase.
To address these issues, the team proposed moving to a native, one-page checkout experience.
Key insights revealed that over 65% of returning customers consistently used the same delivery details and relied on Apple/Google Pay for their purchases.
Collaborating with the engineering team, we discovered that intelligently set defaults could enable a one-tap payment option for most returning customers—achieved without backend changes and at minimal cost.
Prototypes were rapidly developed to test these hypotheses through customer interviews. Feedback confirmed that a streamlined native checkout effectively resolved the most significant pain points. Iterative refinement of the solution ensured a user-friendly experience tailored to customer needs.
Outcome
The redesigned one-page native checkout introduced several impactful features:
- Simplified Layout
All checkout steps—address, delivery, payment, and review—were consolidated into a single, scrollable page. Clear sections and progressive disclosure minimised cognitive load, whilst bottom sheets were introduced to kept users oriented during complex tasks. - Faster Performance
Native components ensured faster load times and smoother interactions, with optimised low-latency responses during payment validation. - Data Driven Defaults
By automatically setting the delivery method to the cheapest option and the most commonly used payment method (Apple/Google pay), the majority of returning customer journeys could be completed in one tap. - Consistent Branding
The new design better aligned with River Island’s web and physical presence and became the basis for a responsive, component-based design system that to be implemented across the app.
Seamless IA
A new 3 step information architecture with clear signposting and progressive disclosure aided first time users in getting to payment quickly.
One click checkout
The single page experience meant that with intelligent default settings, over 65% of returning customers could order their items with one click.
Bottom Sheets
Bottom sheet dialogues were introduced for all complex form and data entry to preserve context for the customer
Bag quick view
A bag quick view for customers was introduced to help customers double check their purchase without having to restart the checkout flow.
Branded buttons
Branded payment buttons increased trust in the customer's payment choice.
