B2B Product Catalog Experience
PROBLEM
Clove recently opened the door to wholesale retail buyers. Clove has estimated that by 2026, wholesale purchases will account for 40% of the overall revenue. As the business scales, an efficient platform to streamline the purchasing process for retail clients is required.
OUTCOME
The platform has already handled multiple large orders (100+ items) and has received considerable compliments across many sales representatives and retailers who have been in the industry for years.
ROLE
Product designer
TIMELINE
Nov ' 23- May ‘ 24
TEAM
1 Designer (me), 1 PM, 3 Engineers, DO. Operations & DO. Wholesale
Business Goals
What are the business expectations from a wholesale catalog page?
01
Bulk Orders
How can we ensure that our retailers can purchase a large multi product order as time efficiently as possible?
02
Smooth Experience
The retail experience must be smooth and error free allowing for repeat orders with no hesitation.
Design brief for
Product Page
I want to ensure that when the buyers come to Clove, they have an extremely smooth and thorough experience, providing easy to scan and digestible catalog.
01
Efficient Checkout Experience
Significantly reduce the amount of time spent on each order
02
Intuitive
The experience should be intuitive so users can find items they are looking for
03
Scalable
System should be able to handle an increasing number of products as the business scales
Design Strategy &
Collaboration
I had the opportunity to work cross functionally with a large team including the Director of Operations and Wholesale. How can we make this process as efficient as possible?
01
Open Communication
Throughout the process I worked with the Product Manager and developers to ensure that my progress was compatible with limitations via Shopify.
02
Design Sprints
Weekly design sprints helped me streamline my deliverables and get working feedback during the process.
02
Collaborative Ideations
The ideation phase was a collaborative and strategic effort focused on creating an effective and user-friendly product catalogue page
Roadmap
Research &
Interviews
I schedules a few one on one open ended interviews and understood my competitors
01
Internal Interviews
Interviews with the Director of Wholesale provided insights into the needs and pain points from a sales perspective, highlighting integral features that would enhance the customer ordering experience. Other members shared operational challenges and requirements, ensuring backend efficiency and accuracy.
01
External Interviews
Interviews with expert retail buyers provided insights into their general experience with similar platforms and what to avoid. They rely on these platforms to get the latest information of products for budgeting and communication as well.
02
Competitor Analysis
Exploring platforms from other sneaker retailers provided important benchmark industry standards.
Hoka
Fitted Retail
Ideating User Journeys
& Challenges
I created wireframes to help me visualize the user flows, and identified 3 main challenges
01
Product Card Funtion
What does a product card represent in this scenario?
Option 1: Each product color would live on it's own product card, which is a streamlined experience, but would give us 78 product cards
Option 2: User selects colorway option within the product card, and this would make it easier to compare colors per shoe style
03
Shop by gender
Would the user rather segment products by gender, or find the product as the first step?
Option 1: User selects gender from the main navigation leading to a narrower, more streamlined experience for each category
Option 2: User selects gender within the product card, which would reduce the amount of time required to purchase a bulk order
03
Inputting Quantities
What is the best way for the user to input product quantities
Option 1: Both gender selectors opened at once, although this may be faster, it is a cognitive overload
Option 2: User selects quantity in two different experiences allow for less error
Final User Map
and features
After understanding and analyzing the design challenges, I went ahead and identified the user journey that would allow the user to purchase bulk sneakers most efficiently.
01
User Journey
Highlighting the
Key Features
What are the essential features required for a smooth bulk ordering process?
01
Quick Links
A quick link that allows users to reach the desired product in just one click
02
Product Card
All product features are required including pictures, colorways, sizes available, in stock quantities, link to PDP and digital catalog.
03
Pre-Order Option
Users want the ability to pre-order items that are not currently in stock
Wireframe
Using a final annotated wireframe to explain my design process
Final Wholesale
Catalog Design
Here is a snapshot of my experience from a user landing on the product page, to checking out with a bulk order
01
Catalog Experience
02
Scaling across product types
Here is an example of our desktop bundle being used for a GWP
Addressing all
Scenarios
How can we reduce all possible user confusion?
01
How to ensure users Add items before proceeding
If the user clicks out in the middle of the purchase funnel before adding items to cart, and error messages pops up to prompt user to either add items to the cart or clear existing quantities.
02
Cart Confirmation
Once the user has added an item to cart, a pop up appears by the cart confirming that it has been added. Additionally a quantity indicator will appear above the product swatch so the users knows how many items. have been added.
03
Pre-Order Function
If there is no stock for a particular SKU, and is available for pre-order, a button will appear in the place of the quantity selector indicating pre order. Once clicked, a pop up with respective dates and an option to purchase will appear.
Prototype Testing
with Real Users
We conducted user testing with our future retail partners, and gained valuable insight and feedback.
01
Overall feedback
Platform is on par with competitors and has all necessary features required. Retailers praised the usability of the product, saying it's extremely straight forward, and even requires minimal instruction.
02
What's Next
Retailers would prefer a search functionality as the product line continues to grow.
Reads Uniforms
"As your consumer, it's a really clean and easy to use site. It's also really pretty. Pretty is nice, user friendly is also nice, but when they're both together it's even better!"
Reads Uniforms
"I really like the bold preorder button. Typically other platforms have small print hinting at the preorder dates, which is easy to miss"
Manhattan Running
"As long as it’s easy for me to order products and see what’s in stock, that’s the best thing. The platform is great for other employees as seems pretty intuitive - even if you’ve never looked at the site, you’d be able to know what you’re doing"
Key Takeaways
Designing the product catalogue page for our B2B e-commerce platform was all about making bulk ordering easy and hassle-free. I focused on a smooth and intuitive experience, coupled with handy features and a clear layout. The new page not only speeds up the ordering process but is also ready to grow with us. This key platform positions Clove to thrive in the wholesale space, enhancing both customer satisfaction and operational efficiency, and setting the stage for future growth.
