Redesigning the online experience of a South African favourite
Woolworths Online faced challenges in designing a cohesive user experience due to the diverse shopping needs across categories like Food, Fashion, Beauty, and Home, each with unique browsing and purchasing behaviors. This made it difficult to create a seamless journey across different product categories.
Business Goal
Improve the overall shopping experience on Woolworths Online by designing a cohesive and user-friendly interface that seamlessly integrates multiple product categories, driving higher engagement and conversion rates across Food, Fashion, Beauty, and Home departments.
Impact Goal
Provide users with an intuitive, easy-to-navigate shopping journey, ensuring a smooth transition between product categories and enhancing their ability to find and purchase products efficiently, regardless of their shopping focus.
Process
01. Reviewed customer feedback from surveys
Worked closely with the founders to map out key workflows, ensuring alignment on the overall vision and understanding of the product's goals.
02. UX Audit to define key pain points
I conducted a UX Audit to identify pain points on the Desktop and Mobile sites. This helped me to identify areas for improvement.
03. Feature audit of local and global competitors
Woolworths Online store had a unique offering that allowed users to shop Food, Fashion, Beauty and Home items in one sitting. In order to fully understand what other competitors are doing for their target markets, I dug deeper into what features were commonly used on their sites and cross-referenced with what Woolworths did and did not have.
04. Develop guidelines for UI
We developed guidelines for consistent PLP cards across departments, designating areas for key info like labels, discounts, and colors, while staying true to core design principles. Research on competitors revealed that leading brands favored larger grid structures to highlight product photography, which inspired our new grid layouts for the PLP and PDP.
05. High-fidelity wireframes
As our role only focused on the PLP and PDP pages, we had to consider the overall aesthetic which Woolworths already defined with their navigation, footer, homepage and department pages and develop a UI that was not completely foreign to what they have.
06. User Interface Design
We developed a cleaner and modern UI to suit the new Woolworths rebrand and make it more timeless.
Results
Enhanced user experience: improved the user journey across different product categories (Food, Fashion, Beauty, and Home) by addressing unique browsing and purchasing behaviors.
Optimized Product Pages: streamlined the Product Listing Pages (PLP) and Product Description Pages (PDP) to ensure a smoother, more intuitive browsing and shopping experience.
Modernized UI: delivered a fresh, modern, and clean user interface that aligned with Woolworths’ brand, enhancing the overall aesthetic and usability of the site.
Improved navigation: simplified site navigation, making it easier for users to move between different departments and find products based on their specific shopping needs.
Data-driven design decisions: utilized research findings and benchmarking against local and international ecommerce sites to guide design decisions and ensure the site met user expectations and industry standards.
Stronger brand presence: elevated the Woolworths brand online through a refined design that reflects its modern identity while improving overall user satisfaction.
Increased conversion potential: by improving the usability of key pages and the site’s design, the enhancements contributed to a higher likelihood of users completing purchases.
Product description pages
