Product page
Overview
What
Skins Cosmetics, a luxury beauty retailer, asked me to redesign their Product Detail Page (PDP). The goal was to improve usability while reinforcing the brand’s premium experience.
The PDP plays a critical role in the e-commerce funnel, bridging product discovery and purchase decision. The primary business goal was to increase conversion rate and reduce drop-offs on the product page.
A preview workshop with stakeholders highlighted the need for a PDP that felt both inspiring and conversion-friendly, while staying consistent with the brand identity.
Why
The existing PDP didn’t fully support user needs or brand positioning:
Visual hierarchy issues made it hard for users to navigate product imagery and details, increasing cognitive load and slowing decision-making.
Key decision factors like stock status, pricing, and USPs were not prominent enough, leading to friction in the purchase journey and likely contributing to hesitation and abandoned purchases.
The design lacked brand emphasis in moments where Skins Cosmetics could differentiate itself from competitors, reducing trust and perceived value.
The redesign aimed to:
Provide clarity and ease of use to streamline product evaluation and purchase and reduce friction in the path to purchase.
Strengthen the premium brand perception through refined structure and visuals, supporting higher perceived product value.
Highlight USPs (previously underrepresented) to drive purchase decisions, build trust, and increase conversion.
How
I took a mobile-first approach, reflecting how most customers browse and shop, ensuring an optimized mobile commerce (m-commerce) experience.
Workshop synthesis – Extracted key insights and priorities from stakeholder discussions.
Exploration with examples – Applied the redesign process to two different products to test consistency and flexibility.
Design iterations – Built initial versions using existing graphic elements, refining layout for clarity and brand alignment. I utilized Figma’s components, variants, and auto-layout features to create a flexible design system that could adapt across products.
Focus areas – Optimized the PDP around:
Product imagery hierarchy for better engagement.
Brand emphasis to reinforce identity.
Stock status & pricing made clear and easy to scan, following e-commerce best practices by prioritizing key decision-making information above the fold.
Navigation improvements for smoother interaction.
USPs visibility to support purchase confidence and reduce uncertainty during decision-making.
Result
The result was a structured, functional, and visually refined PDP that simplifies the buying process while amplifying the brand experience.
By improving visual hierarchy, prioritizing key decision-making information, and reinforcing trust elements, the design reduces friction and supports fast, confident decision-making.
From an e-commerce perspective, this approach is expected to increase conversion rate, improve add-to-cart interactions, and reduce drop-offs along the purchase journey.
Success would be measured through metrics such as conversion rate, add-to-cart rate, and user interaction with key elements like CTAs and product imagery.
Categories
UX
Role
UX/UI Designer
Product page
Overview
What
Skins Cosmetics, a luxury beauty retailer, asked me to redesign their Product Detail Page (PDP). The goal was to improve usability while reinforcing the brand’s premium experience.
The PDP plays a critical role in the e-commerce funnel, bridging product discovery and purchase decision. The primary business goal was to increase conversion rate and reduce drop-offs on the product page.
A preview workshop with stakeholders highlighted the need for a PDP that felt both inspiring and conversion-friendly, while staying consistent with the brand identity.
Why
The existing PDP didn’t fully support user needs or brand positioning:
Visual hierarchy issues made it hard for users to navigate product imagery and details, increasing cognitive load and slowing decision-making.
Key decision factors like stock status, pricing, and USPs were not prominent enough, leading to friction in the purchase journey and likely contributing to hesitation and abandoned purchases.
The design lacked brand emphasis in moments where Skins Cosmetics could differentiate itself from competitors, reducing trust and perceived value.
The redesign aimed to:
Provide clarity and ease of use to streamline product evaluation and purchase and reduce friction in the path to purchase.
Strengthen the premium brand perception through refined structure and visuals, supporting higher perceived product value.
Highlight USPs (previously underrepresented) to drive purchase decisions, build trust, and increase conversion.
How
I took a mobile-first approach, reflecting how most customers browse and shop, ensuring an optimized mobile commerce (m-commerce) experience.
Workshop synthesis – Extracted key insights and priorities from stakeholder discussions.
Exploration with examples – Applied the redesign process to two different products to test consistency and flexibility.
Design iterations – Built initial versions using existing graphic elements, refining layout for clarity and brand alignment. I utilized Figma’s components, variants, and auto-layout features to create a flexible design system that could adapt across products.
Focus areas – Optimized the PDP around:
Product imagery hierarchy for better engagement.
Brand emphasis to reinforce identity.
Stock status & pricing made clear and easy to scan, following e-commerce best practices by prioritizing key decision-making information above the fold.
Navigation improvements for smoother interaction.
USPs visibility to support purchase confidence and reduce uncertainty during decision-making.
Result
The result was a structured, functional, and visually refined PDP that simplifies the buying process while amplifying the brand experience.
By improving visual hierarchy, prioritizing key decision-making information, and reinforcing trust elements, the design reduces friction and supports fast, confident decision-making.
From an e-commerce perspective, this approach is expected to increase conversion rate, improve add-to-cart interactions, and reduce drop-offs along the purchase journey.
Success would be measured through metrics such as conversion rate, add-to-cart rate, and user interaction with key elements like CTAs and product imagery.
Categories
UX
Role
UX/UI Designer