Role: UX Designer​​​​​​​
PROJECT OVERVIEW
Hello Molly's mobile site users were growing rapidly each year. Recent data showed 40% of traffic was coming from mobile devices, and out of the 40%, more than 15% of conversions are from new/guest users. That's a number that can't be ignored. After analyzing  the data, the product team made it a priority to optimize and update the checkout experience to ensure that new and returning users have a quick and seamless flow from beginning to end.
OBJECTIVE
Optimize the checkout experience
Gather user interaction data on touch points in the conversion funnel (Product Detail, Shopping Bag, Checkout pages) and identify any friction in the process. Provide UX recommendation based off data and user testing. Run A/B tests on design and functionality improvements to measure impact on conversion, bounce rate, and cart abandonment. Working with the Product Manager and Developers to implement any permanent features.
KEY INSIGHTS
For guest users, it took 5 page loads after the shopping bag page to get through the checkout flow. With 63% of mobile users checking out as guests rather than creating accounts, it was clear to me that the goal for users was to checkout efficiently. My job as the designer was to limit the time and effort needed from our customers to do so. I took some time to map out a solution that would consolidate pages and reduce the checkout effort.
COMPETITOR ANALYSIS
The competitors below had some great examples of quick and efficient checkout processes. Using our checkout funnel data and the competitor checkout flows, I took the best features that these competitors had and implemented them into a mock.
DESIGN PRINCIPLES
EXPLORATION
During my research I found some great resources that gave insights on the e-commerce industry's mobile site conversions, which helped me do a thorough audit on our mobile site checkout. Google has a great article on "Principles of Mobile Site Design" and Internet Retailer has a great article on industry standards for mobile conversions. These resources helped me make design decisions that were appropriate in HelloMolly's context.​​​​​​​
Task Flow
Wireframes
SUGGESTED FLOW
1. Combine delivery and shipping options
2. Combine payment and review to cut taps
FINAL MOCKS
Old Mobile

Optimized Mobile

Optimized Desktop

Back to Top