Project goal
The goal is to suggest improvements for the product card of Coco & Eve’s eCommerce site, aiming to bring a more satisfying experience to its users and, at the same time, increase conversions for the business.
Design thinking:
the Double Diamond
The way I approached this project was by following the Double Diamond design process.
I started by gathering as much information as possible on product card design across the beauty industry (eCommerce best-practices, benchmarking & gathering user feedback) to discover new opportunities and detect problems and areas for improvement.
After, I priotitized those problems according to the user feedback received to narrow the scope and have a focus for the ideation phase.
Finally, I explored different design solutions and put them together in a prototype (one for mobile and one for desktop).
I would strongly recommend doing A/B testing with existing clients of the brand to keep iterating & improving the product card design. However, due to this being an independent project and not having access to the existing customer base and platform, I included this step as a recommendation.
UX research:
ECommerce best-practices (analizing As-Is)
I started by having a look at the As-Is product cards onsite to detect improvement opportunities based on my years of experience working in eCommerce and common best practices. I also relied on Baymard institute’s research for industry specific best-practices and recommendations.
UX research:
Benchmarking
I looked for product card features across other beauty brands to find inspiration and detect common patterns. Those are some examples of the features found.
UX research:
User feedback
Given that I couldn’t find any reviews online directed to the purchase experience onsite and I didn’t have access to the brands’ customer base, I decided to run a test of the product listing page with a group of friends (female, 20-30 years old – which is the brands’ average user) to gather feedback and find input that could help me improve the product card’s design. Here’s some of the feedback received:
Design: Improvements & New Features - Mobile
Design: Improvements & New Features - Desktop
Design: Prototypes
Design: How to measure success?
