Founded in 2014, Fragrant Jewels is the leader in a unique market: jewelry, specifically rings, hidden inside bath bombs, candles, and scrubs.
Redesign Fragrant Jewels site to help new users better understand the products, better navigate the site, and better understand the companies’ offer.
Restructure the information architecture, content, and layout.
Timeline: 3 weeks
Team: Jenni Sloane, Ruben Baez, Yanni Xiang
Role: Lead Designer, UX Designer
Tools: Pen & Paper, Whiteboard, Figma, Xd
At the kickoff meeting, the Director of Product Management & Engineering stated she was unhappy with the entire current design. Her goal for the redesign was to double FJ’s conversion rate. She provided our design team with the company’s brand strategy, competitors, customer emails, membership birthdays, and site analytics from luckyorange.com.
Identifying The Problem
After conducting a Heuristic Evaluation, which identified issues with the content, navigation, and layout, our team determined the scope of the project would be to address the information architecture and content.
Understanding The Problem
We had our scope but we needed to more clearly understand the heart of the problem. While writing our initial problem statement the other members of my team agreed the problem was doubling the conversion rate. That didn’t make sense to me, but I had trouble articulating why in that moment. We were getting stuck, so for the sake of time, collaboration, and diplomacy I moved forward with our team’s definition of the problem: how do we double the customer conversion rate?
We ran the problem statement by Ed Perez, UX Strategist and Design Thinking Instructor. He pointed out that our problem statement was not from the user’s perspective. This solidified to me what I was having trouble articulating earlier; doubling the conversion rate is putting the business needs before the user’s needs.
Our team then reworked the problem statement from the user’s perspective. This allowed us to empathize more deeply and help keep the user at the center throughout our design process.
Next, our team created a survey together. When it was done I started preparing the interview guide and another team member sent the survey to the member emails. Before the survey was sent I thought to mention to bcc the email addresses, but I didn’t say it out loud as I was too wrapped up in preparing the interview guide. Unfortunately, the addresses were not bcc’d and some of the users were upset. I contacted our client immediately to make her aware of the situation and apologized for our mistake. She smoothed things out with those customers and assured our team it wasn’t a big deal. I learned from this incident to not get tunnel vision with whatever I’m working on and vocalize any concern no matter how small it may seem.
From the problem statement rewrite and the email incident I noticed our team needed better communication. At my request, Ed provided us with a team building exercise, which made our design team’s individual values and perspectives more apparent to each other. We agreed to check in more thoroughly during SCRUM and to finish our day with a retrospective exercise. This enabled us to improve our communication as a team moving forward.
What Users Had To Say
I then proceeded to interview 4 potential new users, and as a team we interviewed 1 additional user for a total of 5 interviews.
Checking The Numbers
The brand strategy stated FJ’s main demographic was women 40-49yrs old. By analyzing the list of 108k customer birthdays, however, we discovered that the primary age group was actually 20-29yr old women, with 30-39 being the next largest group. This information helped us create a persona that more accurately portrayed the target user.
We conducted a design studio to whiteboard all the potential screens we needed to create. This process allowed us to combine the strongest features, layouts, and content from each team member into a single cohesive design.
We then created paper, mid-fidelity, and hi-fidelity prototypes, and conducted 4 usability tests for each. The screens that required the most iteration were the membership, navigation, and product listing page.
Users were confused by membership signup in the checkout flow
Membership as a separate flow from checkout divided the users
Membership as a separate flow was favored in the hi-fi
Icon placement in global navigation was not intuitive
Users favored scrolling over a hamburger menu
Global, primary, and secondary navigation all tested successfully
Membership and point system were confusing to users
Users still had confusion over the point system
Hierarchy of membership and points was clear to users
Moving forward I’d like to A/B test the new membership user flows, apply the mobile site redesign artifacts to the desktop site, and test the branding for a more competitive edge.