Reece Kitchen & Bath
Transforming the e-commerce experience for premium plumbing and HVAC products through user-centered design.
Project Background
Embarking on a new chapter at MORSCO Inc in 2020, I found myself amidst a pivotal moment. The acquisition by Reece Group, Australia's industry leader in plumbing, HVAC, and waterworks, presented a landscape of endless possibilities. As I navigated through challenges and embraced opportunities, my skills evolved, and my perspective broadened.
Type
E-commerce
B2C Website & Mobile App
Duration
Five months
2020 - 2021
Tools
Figma, Adobe XD
Methods
User research, Mockup, Rapid prototyping
My Role
As the Senior UX Designer in Reece USA, I worked with a brand new e-commerce team to ship internally built, custom web products. Advocated for accessibility and user centered design.
Coordinated with Marketing team to conduct qualitative user research through surveys, user interviews, and UX workshops to plan new features and delivery schedule.
Collaborated with UX team members, product owners and developers to create and improve site features such as improved checkout flow, improved store finder, and customer and employee registration flows.
.png)
Project Goals
The content goals should effectively drive consumers to engage with the Reece brand in a way that will evoke inspiration, create trust, connect with an advisor, and facilitate product purchase.
Drive Purchase
Drive consumers into an easy product purchase path with user-friendly messaging that encourages exploration.
Build Trust
Build trust and affinity for this "new-to-the-US" Reece B&K brand through engaging content that showcases the reasons why Reece is the best choice for your home renovation project.
Inspire Homeowners
Inspire homeowners with bold visuals and influencer content to dream about and begin their ideal home renovation or build project with Reece.
"Creating and curating high-quality visual media is essential to a successful ecommerce experience."
Design Requirements
Thinking through what a customer would need during the purchase flow is critical. We determined design requirements for the solution to ensure we were holding ourselves accountable to referring back to the data learned in workshop, and to use these requirements as our guiding principles.
User-friendly Navigation
A clear and intuitive navigation structure reduces customer's frustration of searching for products.
Clear Product Information
Ensure that product information, such as product descriptions, images, and specifications, are accurate, clear and complete.
Streamlined Checkout
Make the checkout process as simple as possible, reducing steps required to complete a purchase.
Mobile Optimization
Ensure the e-commerce site is optimized for mobile devices, with a responsive design that adapts to different screen sizes.
PCP Page Design
Improve the customer experience by making it easier for them to compare products and find the right category that best fits their needs. This builds confidence in your e-commerce site.
Enhanced product filtering and sorting options
Visual product comparison capabilities
Clear category hierarchy and breadcrumbs
Category Browsing Experience
The redesigned category page provides customers with an intuitive way to explore products. Clear visual hierarchy guides users through the selection process.
PDP Page Design
The product details page should be clear, concise, and easy to understand. This includes product name, description, price, images, specifications, and customization options.
Desktop View
Mobile - Product Options
Full Product Page
Design Principles
Design product specs section to allow customization, drive consumers to add product to cart through detailed information and easy-to-use purchase functionality.
Unique product icon for "View specs" anchor link for high-impact categories/products
Use multiple images and media types for highest visual impact
Visual option choices where product image changes to reflect the chosen option
Customization Options
I designed the customization options to deliver clear and concise descriptions and images that help customers understand what they are choosing.
Checkout Integration
Ensure that the customization process integrates seamlessly with the checkout process, allowing customers to easily review the product availability and complete their purchase.