Scroll down for an abbreviated case study or...
The French Girl Organics website was deceptively pretty. What it had in nice imagery it lacked in consistency and logic.
The challenge, for me, was to create a site that worked well on mobile and desktop and enabled people to find the items they wanted and add them to their cart in the fewest clicks while creating a design system that unified the site and maintained the French Girl Organics fresh, high-end aesthetic.
ZERO% of users successfully completed tasks in time alotted during usability testing.
For testing, I had users attempt to find a lip balm to add to their cart and find a bath product to add to their cart.
Users tested FrenchGirlOrganics.com as well as Lush.com. Uniformly, users failed to complete their tasks in under 2 minutes for FrenchGirlOrganics.com but were able to complete the same tasks in under 30 seconds on Lush.com.
This told me there was a serious information architecture problem in addition to observing UI issues with the main menu on the French Girl Organics site.
THE SKINCARE OBSESSED IT GIRL
"Skincare is self care!"
Alexis has incredibly sensitive skin and she's very particular about what ingredients are in the products she uses and opts for minimal, organic ingredients over synthetic additives.
Alexis needs a better way to find skincare products with specific ingredients on FrenchGirlOrganics.com because she has very sensitive skin.
THE MOST THOUGHTFUL PERSON YOU KNOW
"I love to brighten someone's day with a unique gift!"
Val loves to support women-owned businesses when shopping for gifts. Bonus points when they benefit the environment, too!
Val needs a better way to pair products that go well together on FrenchGirlOrganics.com because she wants to give the perfect gift.
Goal: get as many ideas out as possible on paper before even thinking about touching a computer.
For this design, I looked to common design standards for other popular beauty sites and I noticed they all had a top level navigation in common.
With beauty products posing such a difficult information architecture challenge, I chose to stick closer to the known design patterns rather than creating something completely new.
No color, no pictures. Intended to prove interface usability before spending the time, money, and effort on high-fidelity versions.
Based on feedback, it was important to avoid endless scrolling and to enable users to shop multiple categories straight from the homepage.
The addition of an "Add to Cart" button enabled people to quickly add the items they wanted to their cart and check out or keep shopping.
French Girl Organics has a clean, minimal aesthetic and styles their images with an effortless French flair.
I wanted to stay true to their aesthetic while adding some polish to their site.
Do you geek out over solving problems as much as I do?
Check out the full case study, explore how the project is organized in Notion, and try out the clickable prototype!
But wait...what about the devs?
Click the button below to explore project handoff with Zeplin!