Mobile Checkout
Streamlined the mobile checkout experience for a grocery delivery app to address a 73% cart abandonment rate at payment.
QuickCommerce approached me after identifying their mobile checkout as the primary conversion bottleneck. Through session replay analysis and user testing with 31 customers, I discovered that the checkout process felt untrustworthy due to unexpected delivery fees appearing late in the flow, and the multi-page form format caused cognitive overload on mobile screens.
My approach centered on transparency and reducing cognitive load. I redesigned the checkout as a single-page experience with progressive disclosure, where users could see their complete cost breakdown from the start. Delivery fees, service charges, and estimated taxes were visible before the user began entering payment information.
I introduced autofill optimization, smart address validation, and Apple Pay/Google Pay integration to minimize typing on mobile keyboards. For the delivery time selection, I replaced the previous dropdown menu with an interactive time-slot selector with visual availability indicators, making it immediately clear which windows were available.
A/B testing showed the new design reduced checkout time from an average of 4 minutes 12 seconds to 1 minute 43 seconds. The accessibility improvements—including better color contrast, larger touch targets, and screen reader optimization—also resulted in positive feedback from users with disabilities. The design system components I created during this project were later adopted across other parts of the app.
QuickCommerce approached me after identifying their mobile checkout as the primary conversion bottleneck. Through session replay analysis and user testing with 31 customers, I discovered that the checkout process felt untrustworthy due to unexpected delivery fees appearing late in the flow, and the multi-page form format caused cognitive overload on mobile screens.
My approach centered on transparency and reducing cognitive load. I redesigned the checkout as a single-page experience with progressive disclosure, where users could see their complete cost breakdown from the start. Delivery fees, service charges, and estimated taxes were visible before the user began entering payment information.
I introduced autofill optimization, smart address validation, and Apple Pay/Google Pay integration to minimize typing on mobile keyboards. For the delivery time selection, I replaced the previous dropdown menu with an interactive time-slot selector with visual availability indicators, making it immediately clear which windows were available.
A/B testing showed the new design reduced checkout time from an average of 4 minutes 12 seconds to 1 minute 43 seconds. The accessibility improvements—including better color contrast, larger touch targets, and screen reader optimization—also resulted in positive feedback from users with disabilities. The design system components I created during this project were later adopted across other parts of the app.