Rebuilding the product details experience from the ground up

The product details page is a critical touchpoint where 12 million customers evaluate products, check nutritional information, compare prices, and decide whether to purchase.

This project addressed significant technical debt and experience gaps across app and web, with the goal of improving customer confidence, conversion, and legal compliance while modernising the underlying infrastructure.

Challenges

Woolworths' product pages had become a critical bottleneck. The web experience was failing Google's Core Web Vitals assessment with a mobile performance score of 15 out of 100. Pages took 4.4 seconds to load (LCP), causing bounce rates of 55% on web and 33% on app — directly increasing Google advertising costs and killing conversion. Add-to-cart rates sat at 9.6% on app and 7.0% on web.

Beyond performance, the experience had fundamental structural problems. Years of piecemeal additions created fragmented layouts that failed to showcase products effectively. Legal compliance gaps left required product information missing. Product recommendations drove minimal engagement — Marketplace recommendation carousels had a 47% view rate but only 1.1% interaction rate, suggesting irrelevant suggestions.

Customers struggled with basic tasks:

"I can never find the ingredients list—I have allergies so this is critical." — Research participant, March 2024

"The page is so slow I give up and just go to Coles." — VoC feedback, pre-launch

"I want to see if they have other sizes but can't find it anywhere." — Research participant, quantitative study

For Woolworths, this wasn't just UX polish—poor performance leaked revenue through wasted ad spend, failed compliance audits, and customers bouncing to competitors.

My Role

I led the redesign as Senior Product Designer, initially collaborating with UX designer Ananda Vasudevan from January to May 2024. When Ananda departed mid-project, I took over sole design leadership while maintaining delivery momentum.

My responsibilities: research synthesis, strategic planning, comprehensive design documentation, stakeholder management across 87 identified features, and delivery oversight through to launch. I delivered WCAG 2.1 AA-compliant documentation in F24, then coordinated build delivery with engineering and QA through F25.

Research & Discovery

Consolidated research from three UserZoom studies (1,373 quantitative responses, 15 qualitative sessions) alongside Voice of Customer data, competitor analysis, and best practice research. Key findings shaped our approach:

Customer behaviour patterns:

• PDPs primarily visited for unfamiliar products or allergen checks
• Customers rely on product images to scan packaging for information
• Desktop users expect more detail than mobile users
• Customers with dietary requirements use PDPs regularly to check ingredients

"Most customers use PDP only when they are shopping new or unfamiliar products and need to look up more product information (product labelling, ingredients, images, sizing, country of origin)." — Research insight, March 2024

Feature prioritisation:

• Product variation control (86% net positive) and Country of Origin labels (83%) rated highest in quantitative study
• Smart recommendations valued for price comparison without returning to search
• A+ visual content critical for non-grocery Marketplace items to build trust

"[Desktop - camera] A+ content: It's cool, because when you're buying products like camera/tv/electronics in general, you'd like to see how the product works, the content is more attractive…" — Research participant, March 2024

Collaborated with stakeholders to map 87 features: 58 approved for inclusion, 18 separated to different projects, 11 deferred.

Design Solution

Enhanced Gallery & Pricing

Increased image size with full responsiveness. Repositioned roundels (Health Star Rating, promotional badges) to avoid obscuring images while allowing multiple key details to display simultaneously. Added thumbnails on app and mobile web for easier browsing.

Reformatted pricing with clear hierarchy and screen reader optimisation, ensuring accessibility and compliance across platforms.

"I like that the information is presented in a clear and organised way…" — Research participant, April 2024

Information Architecture

Restructured page to surface core information while reducing scroll length. Key decision: collapsed product information panels with progressive disclosure allow customers to scan quickly while maintaining access to complete details. Health warnings remain visible by default for compliance.

Sticky pricing and add-to-cart actions (web) keep primary actions visible throughout scroll, reducing friction.

Product Recommendations

Redesigned recommendation system with better algorithm integration and prominent placement. Similar Items enables price/product comparison without returning to search, consistently rated as most useful feature in research. Frequently Bought Together uses AI bundling and basket affinity data.

"[Mobile — camera] similar products; it's good, you might have gone into the first one you found, you can just go down and not have to search again. it's more convenient and user friendly…" — Research participant, March 2024

Ratings & Reviews

Launched on app for first time, completely redesigned web experience. Research showed these are critical for high-value or unfamiliar products where customers need social proof before purchasing.

Stock & Availability (Web)

Combined Google Hosted Merchant Storefront banner with "check stock in store" to surface accurate availability. Addresses clumsy large banner from Google Shopping traffic (significant PDP traffic driver) while providing utility for both eCommerce and Reserve & Collect customers.

Backlog Features

Product variants

This feature will streamline the selection process for products with multiple options, creating a more intuitive and efficient experience.

Brand Link

This feature will enhance brand visibility and provide customers with direct access to brand-specific product collections and information. While supporting Woolworths' marketplace strategy by highlighting brand partnerships and exclusive offerings.

Breadcrumbs (web)

Introduces a clear, hierarchical navigation trail at the top of the page, helping customers understand their location within the site and easily return to previous categories. Improving orientation and reducing navigation friction.

Comparison (old-new)

Implementation & Obstacles

Phase 1 (Jan–May 2024): Discovery & Design

Consolidated research and mapped features. Critical challenge: Ananda's departure in May meant taking over sole design leadership mid-stream while maintaining timeline.

Phase 2 (Jun–Nov 2024): Documentation & Build

Delivered comprehensive WCAG 2.1 AA documentation. Major obstacle: Web engineers resistant to sharing work early, claiming confidence in understanding requirements. Despite repeatedly requesting early builds and escalating to EM/BA/PM, acceptance criteria were missed requiring significant rework. Should have pushed harder for visibility earlier.

Phase 3 (Dec 2024–Jun 2025): Launch & Iteration

App launched December 16, 2024. Discovered critical issue: AEM backend limitations engineers hadn't identified impacted front-end build and user experience. Web launch delayed to March 6, 2025.

Key learning: Should have participated in backend architecture discussions despite 90% of content being outside design domain. Critical technical constraints were missed that impacted the final experience. Even when technical discussions seem irrelevant, designer presence can catch issues engineers overlook.

Results

Measured November 2024 baseline vs June 2025 (6 months post-launch).

App Performance

• Add-to-cart: 9.6% → 12.1% (+25.6%, measured across 2.1M sessions)
• Time on page: 30 seconds → 42 seconds (+40.7%)
• Bounce rate: 33% → 29% (−9.76%)
• Add-to-list rate: 2.0% → 2.4% (+18.8%)
• Incremental items per basket: 2.20 → 2.26 (+2.35%)

Web Performance

• Add-to-cart: 7.0% → 7.7% (+10.6%, equaling 50,000 additional weekly cart additions)
• Time on page: 53 seconds → 57 seconds (+7.1%)
• Bounce rate: 55% → 54% (−2.44%)
• Views per visit: 1.72 → 1.76 (+2.29%)
• Mobile performance score: 15 → 68 (Core Web Vitals)

Customer Response

"Finally! The nutrition info is where I expect it and I can actually read it." — VoC feedback, post-launch

"Images are so much bigger, I can actually see what I'm buying now." — Customer feedback, March 2025

"The page loads fast now, I'm not waiting forever." — VoC data, June 2025

Recognition

Ian Jankelowitz (Head of Everyday Market) — Post-launch, March 2025:

"Just a quick email to say a massive, massive congrats on how great the new PDP looks especially on app! The design feels like a renovation (vs. a total overhaul) and makes value so much clearer, the images bigger and more interesting and relevant info easy to see."

Tim Hornbrook (Head of Product & Design) — Performance review, January 2025:

"The work on Product Details Pages and now into Product Tiles has been commended directly by your tribal partners and dependent stakeholders, and as the sole designer within the squad you have highlighted the full scope of abilities beyond 'just UI'."