THE ESSENTIAL
PRODUCT LISTING PAGES
Redesigning the standard product templates to add meaning & storytelling to each product.
PRODUCTS WITH STORIES THAT MATTER
Role
Project Lead
Lead Designer
Year
2022 - 2024
UX/UI
Product Strategy
Visual Direction
Graphic Design
Disciplines
The Essential keeps things fresh by launching products nearly every day which helps drive traffic to the website. Data shows an increase in sales on days when a product is dropped vs on days when there are no drops.
The Essential store’s mission is to add meaning to people’s lives through products they use and love, made by people who know and care, with stories that matter, and means that are honest. This mission is clearly evident through the storytelling on the product pages. Because we launch different products across various categories, the product pages require a custom format.
I was the project lead and in charge of designing the product pages - customizing the default theme template, collaborating with developers, implementing new features, and creating new custom templates for each product launch collaborating with the sourcing team to design specialized pages.
Intro
CHALLENGES
01
How can we design the pages to have higher add to cart rates?
02
How can we design custom templates that doesn’t require a new template for 2,000+ active products?
03
Are there opportunities to add or trigger cross sell on the page without hurting conversion?
04
How can we inject more storytelling and life to these products?
THE DEFAULT LAYOUT
A look into the old product page in both mobile & desktop format
Mobile
old version
Desktop
old version
OLD PRODUCT PAGE METRICS
3.9%
Add to Cart Rate
49%
Bounce Rate
5.2%
Upsell Rate
A MEANINGFUL PRODUCT LAYOUT
Visually rich, customized, and optimized product pages with newly added features to help boost product conversion.
Re-designed the UI to unify the form selector design and worked with developer to require the add to cart CTA to be sticky for mobile.
STICKY ADD TO CART
Created a templated system for different product categories and updated all 2,000+ products with inputing information on the back end which resulted in launching products faster to scale the business.
SHOPIFY METAFIELDS
Optimized web design for mobile collaborating with the developer and standardizing the overall layout to be more compact and flow better for storytelling.
OPTIMIZE & FORMAT FOR MOBILE
Integrated & designed features like back in stock, wishlist, and subscriptions to make the product experience more user friendly with keeping in touch with the interested products.
NEW FEATURES TO INCREASE UPSELL RATE
Collaborated with cross functional stakeholders on a weekly basis to conceptualize each launch story and strategize and design a custom product page that could illustrate the depth of the product.
VISUALLY RICH PRODUCT PAGES WITH STORIES TO TELL
NEW PRODUCT PAGE METRICS
4.7%
Add to Cart Rate
+0.8% Increase
39%
Bounce Rate
+10% Less Bounces
9.2%
Upsell Rate
+4% Increase
As a result of my work on The Essential app helped double app sessions & activity, improve AOV by 15.1% and improved conversion rate by 1.2%.
Additionally, we did some quality‑of‑life improvements: created a unified store-aisle system for the app, transitioned to system fonts, and unified navigation bars.
Please note, the UI and animations in this portfolio have been updated to reflect my current standards.