User Research, User Interface, User Experience Design, Figma, Wireframing
Grown Brilliance is an established luxury lab-grown diamond jewelry brand with an e-commerce platform. Established in late 2021, Grown Brilliance entered the market offering lab-grown diamonds at unbeatable prices. Grown Brilliance offers exclusive and modern designs, with the flexibility of customization to meet every customer’s needs.
hello
Sample Product Details Page︎︎︎
HYPOTHESIS
Users are not engaging with product pages as the details are inaccessible.
WHAT DO OUR CUSTOMERS CARE ABOUT
1. Price
2. Design
3. Quality
4. Uniqueness
User experiences on PDPs can be optimized to push for more conversions
THE PROBLEM
Users need to scroll and click many times to get the information they need, creating a high cognitive load for the user. By optimizing the space on the page, users can get the needed information more effortlessly.
THE DATA
How many reach the details section?
1. 99% reach “Add to Cart”, which means it’s not always seen on load
2. 97% reach GB Gifts, vs 70% scroll beyond GB Gifts
3. Out of 70% that scroll beyond GB Gifts, 30% reach details
INSERT IMAGE
INSERT GRAPHS
How can we optimize the product details page to better display information following a logical hierarchy, to improve bounce rate and efficiency of time on site, for the goal of conversions?
HIGH PRIORITY RECOMMENDATIONS
1. Make sure “Add to Cart” button is always seen on initial load by:a. Condensing the product options
1. Remove GB | 365 → no engagement with it
2. Reorganize item details 1-liner under product title → low engagement
INSERT IMAGE
3. Reduce title font size to take up 1 line or change ‘ctw’ color to background → users engage with it unnecessarily
4. Remove or reorganize ‘affirm’ option → low engagement with it and takes user out of the product page
5. Reorganize diamond selection to show all shapes in one row, so users don’t have to click back and forth
INSERT IMAGE
OR
b. Separating product options into two categories:
1. Customize (contains all visual interaction: metal types, diamond shapes, and matching band)
2. Final Touches (contains carat weight, ring size, and engraving)
NOTE: carat options should not reload the entire page
INSERT IMAGE
2. Remove the clickable appeal of GB Gifts, as it takes focus away from the product in question, by:
a. Redesigning the information:
1. Remove the border to differentiate it from the clickable buttons above it
2. Condense the information with additional details as a hidden dropdown
3. Make the image expandable so users have less motive to click on additional details
4. Remove the line separation between the clickable buttons and GB Gifts
INSERT IMAGE
b. Solidifying our brand across all pages and platforms:
1. Change wording to “Grown Brilliance Gifts” → longer but solidifies the brand in the user’s mind
INSERT IMAGE
3. Make the product details more accessible, as users miss details by clicking on “Reviews” under the title, by:
a. Separating ‘Reviews’ section from product details:
1. Create a smaller “Product Details” section as a hidden dropdown, that contains:
- an appealing description of the product, its story and craftsmanship
INSERT IMAGE
- product details redesigned as an “authenticity” card → engagement disproportionate to space taken by section
(users are only viewing first two details)
INSERT IMAGE
2. Place “Product Details” under ‘made to order’ section
INSERT IMAGE
b. Condensing and optimizing the ‘Reviews’ section, to lower time spent on it:
1. Redesign reviews to fit in a box that does not take up full width of screen → harder to read = more time spent
INSERT IMAGE
2. Bold the review titles, so users can easily retain the information
3. Replace pages of reviews with scroll feature that initially displays 3 reviews
INSERT IMAGE
4. Remove “Questions” tab, OR replace with FAQ section
5. Remove “Share” button for each review
INSERT IMAGE
4. Lower the amount of scrolls and clicks, so users can reach prioritized pieces of information more efficiently, by:
a. Reorganizing content with higher engagement:
1. Remove jewelry box section → only 5% reach section but engagement occurring even though low on page
2. Add packaging image to rest of product images
INSERT IMAGE
3. Display “Shipping” and “Returns” content side by side as a table → similar priority of content
INSERT IMAGE
4. Reverse order of “Recently Viewed” and “You May Also Like” → significantly more engagement with latter
INSERT IMAGE
b. Making content retainable from 1-word phrases or symbols:
1. Redesign made-to-order / est. delivery time section to have symbols
INSERT IMAGE
2. Redesign “Why Grown Brilliance” banner to be stacked → harder to digest information when stacked horizontally
3. Place “Recently Viewed” and “Why Grown Brilliance” side by side → giving ‘recently viewed less importance
INSERT IMAGE
c. Getting rid of clutter:
1. Replace “add engraving” button with input box
INSERT IMAGE
2. Remove customizing options for products under “Recently Viewed”
INSERT IMAGE
3. Remove “Wish” and “Drop a Hint” button
4. Replace Pinterest button with a heart as ‘wish’ on the top right corner of the main image
INSERT IMAGE
Live Site︎︎︎