Redesigning Walgreens’ Online Shopping Experience
As UX Manager, I led a project to improve the mobile shopping experience on critical touch points in the shopping flow, particularly two under-performing pages: Search Results and Product Details. My team set out to create a mobile-first interface that prioritized clarity, efficiency, and conversion.
Challenge
The Search Results and Product Details pages are the two most important pages in the shopping flow. They are also the highest trafficked pages on the retail shopping section of the website and app. Their design was not optimal, especially for mobile shoppers, which represent a growing majority of customers. The poor designs created friction for customers, resulting in slow and inefficient navigation, missed promotions, lack of product discovery. The impact of these issues was a low conversion rate, lower than desired basket size, and average order values compared to industry competitors.
The Design Process
As UX Design Manager, I co-led a cross-functional design strategy utilizing the Google Design Sprint methodology. We first aligned all critical stakeholders (including Merchandising, Engineering, Pricing, Operations, and SEO) and conducted a rapid competitive analysis to benchmark industry best practices. This culminated in a week-long ideation and brainstorming intensive to debate concepts and establish a clear design direction. The resulting concepts were rapidly transitioned into high-fidelity, clickable prototypes for validation. Collaborating closely with the User Research team, we led multiple rounds of rapid iterative user testing (both in-person and online) to ensure the final solution met real-world customer needs."
Key Insights
Customer research revealed that Walgreens shoppers expect a highly convenient, efficient online experience that supports repeat purchases, highlights savings opportunities, and leverages personalization—mirroring their in-store expectations.
The previous Search Results and Product Details pages—the two most critical and highly trafficked retail areas—failed to meet these core expectations due to critical design flaws:
Search Results (SRP) Deficiencies: The mobile interface displayed only one product per screen, demanding excessive scrolling. Key features like filters and money-saving offers (deals, coupons) were buried, slowing product discovery and leading to missed savings. Furthermore, oversized 'Add-to-Cart' buttons and small product images created visual clutter and required extra clicks.
Product Details (PDP) Deficiencies: Critical conversion elements (price, savings, fulfillment options) were positioned below the fold, dominated by an unnecessarily large image viewer. This poor hierarchy concealed benefit programs, hindered quick Add-to-Cart actions, and prevented effective cross-sell or Walgreens-brand equivalent promotion, resulting in lost basket-building opportunities.