Overview
Dr. Squatch was launching a new category which required a new PDP user interface. It was the Buy Box area that specifically need to be revamped so that there was the ability to select options of scents, colors, and more for bundles and products.
Before this PDPs had an average 62% CVR, which was low considering that users were funneled down to one scent per one product for the PDP pages.
PDP pages had different information architecture/different templates for different product categories, which was not ideal for users or for the engineering team. I was tasked with also revamping a PDP to work for every product versus having 4 different versions with different hierarchies/user interactions.
-
Lead Product Designer
-
2 Product Managers
1 Engineer
-
1 month deadline
01 Past PDP / Buy Box
The past customer journey for PDPs (Product description Pages) had users choosing one item from a category landing page and then going directly into the product description page.
This page then “traps” consumers into purchasing that product or bundle, without exploring other possible scent selections.
This was a frustration that came up again and again in user testing.
These PDPs also do not have a growth mindset, allowing for optionality with future products/categories.
Product Category Landing Page
Ex. Bar Soap
Consumer Frustrations Within Buy Box Area
-
Lack of Optionality
Consumers are “trapped” into one product page, and are not able to select a different scent or view other scents. Below is an example of the updated PDP optionality.
-
Quality Selection
Quality selection is limited to 1, 2, or 3, which limits the consumer’s choices. It also doesn’t benefit users in terms of pricing to select one of the limited options.
-
Subscription Benefits
Consumers did not understand why they should choose the subscription option over the one time selection.
02 Research & Discovery
Competitors & Inspiration
-
Native
Native was a north star in great user experience. They allow users to select scents on the PDP page, their subscription process is simplified, and they allow users to select their own quantity.
-
Ollipop
Ollipop has amazing and colorful branding, that helps users identify the scent. Ollipop makes every single flavor stand out.
-
Javy Coffee
Javy Coffee had a great user experience when it came to subscriptions, explaining all the benefits.
03 Ideation
Scent Selection Exploration
-
All Scents Shown
We explored having all scents visible within the PDP. For bar soaps the max amount for Core Scents was 16.
We quickly realized this would be far too many scents in one space.
-
Tabs
We realized a solution could be to use tabs to switch between the scents. This would divide up the 16 core scents and the 10+ special edition scents.
This solution required a lot of selections on the consumer’s part & also didn’t clearly display what the scents were - just the colors.
-
Dropdown
It quickly became apparent that the dropdown was a great solution. Having the scent color and description side by side made the selection clear. Also going into the dropdown allows a user to easily select another scent.
Scent Selection Solution: Dropdown
Selection of the dropdown had to work in multiple ways, specifically to select only one scent for one product, or to select multiple scents/colors/flavors for bundles.
Purchasing Section Exploration
-
Subscription Benefits
Highlight the subscription benefits for the consumer.
Testing showed that easily explaining the subscription and it’s value to consumers made consumers 2x more likely to select subscription.
-
Bulk Order
Many consumers loved to buy massive amounts of products (bar soap especially) at once. With a deep discount this also seemed to be an attractive offer.
While an interesting concept, this option could confuse consumers even more, something that had been coming up in our feedback of the site.
-
No Subscription
Another option we looked at was removing the subscription all together. This would force users to select our subscription model through the navigation menu.
While a valid option, due to the financial implications of not having subscriptions available through the site, it was quickly eliminated.
Purchasing Selection Solution: Subscription Benefits
Having clear benefits to the selection of subscription showed to clearly influence consumers into selecting subscription.
04 UX
Modules for Buy Box / PDP
Due to multiple needs for different product marketing for different products, bundles and categories, it soon became clear that we would need a flexible PDP.
By creating different modules, which could be used for multiple use cases, this PDP template could be used over and over.
These modules can be used for over 7 categories and 50 products, as well as multi-selector bundles.
PDP Templates for Merchandising Use Cases (Covers all use cases)
05 High Fidelity Mocks - Solution
High Fidelity Templates Types:
1. Marketing Partnerships
2. Core Products
Created templates for the whole team to use, and accounted for marketing partnerships and core products, and the three main breakpoints mobile, tablet, and desktop.
Male Hygiene - Category Launch
The first test to see if the templates worked was the Male Hygiene Launch.
Male Hygiene - Category Launch - Mobile High Fidelity Mocks
Body Wash - Product Launch
The second test to see if the templates worked was the Body Wash Launch.
06 Results
Conversion rate for PDPs improved with each of the launches!
Launch KPIs for Male Hygiene Launch
07 Learnings & Reflections
Learnings & Reflections
Timelines
For this project, because the launch was in two months, the timeline was expedited. This left less time for research which really helped support findings/helped make decisions, which we had to circle back and test. Having a little extra time for testing/research would’ve helped speed up the process even though it seems counter-intuitive.
Balancing Immediate Needs vs. Future Needs
At a start-up things change and move so quickly that you need to balance the current needs vs. building long-term solutions. In this instance I wish that we pushed more for longer term needs, as we had to rebuild some of the assets a month later, vs. going all in on a solution that would’ve worked longer term.