Role: User Research, Information Architecture, Wireframes, Prototyping, User Testing
Team: Graham Mcfie, Thea Barber, Fahimé Shah
Software: Sketch, Figma, InVision, Keynote, Illustrator, Photoshop
Duration of Project: 3 weeks
“The most intimate thing you can do in your lifetime is to ask someone to marry you. When you can capture the essence of your partner in a piece of jewellery, it’s a very special way to say “I love you” — Nick Coutu, Founder of Engager Rings
Nick Coutu, understood the value of custom engagement rings at an early age, being raised in an engagement ring shop founded by his parents. He saw how his parents worked on ends to provide a fully-customized experience to their customers.
What is Engager Rings?
Coutu founded Engager Rings Corp — a native app and promotional website that connects people to Jewelers who can help them to design a one-of-a-kind custom engagement ring. It is like Airbnb, but for custom Jewelers. Nick’s goal was to bring the unique in-store experience to the digital space while supplementing in-store sales.
Addressing the Problem
Coutu had good intentions, but the native app was not able to secure stable funding (as seen on dragons den) after being launched for 2+ years. Coutu planned to sell this app to Jewelers for a subscription fee, for the promise of 100 users per year. The problem now is that the app does not have enough customer base to attract the custom Jewelers, and vice versa. This, unfortunately, forms a chicken and an egg situation.
Design Objective
Our team’s objective was to find opportunities to improve Engager customer’s user experience on the website and native app. We also wanted to find opportunities to increase conversion, either through app downloads or bringing new customers to the physical jewelry store. To do this, we must apply a user-centered design process.
User-Centered Design Process
1. RESEARCH
Competitive Analysis: Identifying the relationship between design ability and trust
Our team began our research by completing a competitive analysis to understand where Engager fits in the market with its competitors. We looked at companies that offered zero customization like Tiffany & Co., to ones that offered full customization, like Engager. Somewhere in between sits James Allen and Blue Nile, who are online retailers that offer customers the option to mix and match ring components to make their custom ring (Formula=A Stone + B Band+ C Setting = ring).
It was clear to see that a more customized service did not mean a more trusting customer. Tiffany and Co., offered no customization on their rings but are perceived as superior over independent jewelers like Engager, mind you with double the price tag. This showed us that trust is very important to customers in the ring purchase process, more so than the level of customization a shop can offer.
A Look at the Current Website and App: Lost purpose
The purpose of the Engager website is to promote the app, as a tool to connect users to Jewelers who can help them to design a one-of-a-kind custom engagement ring. The customer is able to video chat with their matched jeweler at the time and location that’s most convenient for them.
However, after conducting a content inventory audit, using an online platform called CAT (Content Analysis Tool), we found there were 135+ pages on this ‘promotional website’. There were many external links as well as lengthy copy. This amount of information caused confusion for customers, as well as our team, as to what the main purpose of the website is supposed to be. This was a problem for a start-up that want to establish trust with its customers.
Google Analytics: Analyzing Engager user’s online patterns
Our findings from the content inventory audit were validated through the google analytics of the Engager website. The bounce rate for the homepage seemed a bit higher than average, possibly because users were overwhelmed by the amount of information on one page.
It was also interesting to note that more users accessed the website from their mobile than from a desktop. This got us thinking about the ‘mobile first’ strategy.
User Interviews: Gathering insights about users
We interviewed a variety of different people, at different stages in the custom ring purchase process to gain insight into their motivations and pain points. We interviewed users who have gone through the journey themselves, are currently looking, or are in a relationship and plan to look sometime in the future. With these insights, we moved into the planning phase.
2. PLANNING
User Personas: Defining primary users
From the user interviews, our team landed on 2 user personas: the romantic groom and the excited bride-to-be.
Persona 1: Jason, The Romantic Groom
Jason is a romantic that wants to create a ring as unique as his love story. His main frustration is finding an experienced jeweler that he can trust to guide him through the process, as it can be overwhelming to get through it alone. His main motivation is to be educated on the basics of designing a custom ring, so he can make an informed decision.
Persona 2: Vanessa, The Excited Bride-to-be
Vanessa is so excited to be getting married to her long-term boyfriend. She has been dreaming and planning for this moment for some time. Her main motivation is to have the ring she wants so she can tell a good story to her friends and family. Her main frustration is finding an experienced jeweler whom she can trust, to make that happen.
User Journey Map: Discovering areas of opportunity
Our team then mapped out the user journey of Jason, the romantic groom, as the more traditional route. It was almost identical to Vanessa’s journey with slight modifications in the first and last step. It was important to focus on the high and low points of their experience, to discover areas of opportunity to improve the user experience.
- 😢Low point: The start of the ring purchase journey can be overwhelming and confusing
- 🙂High point: Learning about rings through online research and talking to friends provided inspiration and direction — improved the experience significantly
- 😀Higher point: Finally finding a jeweler that he can trust to guide him through the process
Feature Prioritization Based on Key Insights
Our team summarized our research and planning into 3 key user priorities. These laid the foundations for our design.
Key User Priorities:
- Build Trust — Users want to feel they can trust the jeweler’s experience and expertise
- Learning/Education — Users enjoy learning about an engagement ring as part of the experience
- Story-telling — Users want to tell a good story with the ring
Then Came the Pivot
At this point, it was clear to us that the customers' needs and wants were not met by the current Engager products: promotional website and native app.
This was when we made a critical decision to pivot from our original design objectives by dropping the native app, and re-designing the website as a responsive web application.
This was due to the following reasons:
- Focus on mobile first — a responsive web app would allow users to browse the website from their mobile, a pattern validated by google analytics
- No need to worry about bugs — there is less chance of a web app being affected by bugs than in a native app
- The website is what customers see first—ensuring customers have a pleasant experience on the website can help Engager to establish trust and credibility, to attract more customers
3. DESIGN
Customized Gif
Engager’s unique selling point from their competitors is that they offer a fully customized experience and service. They are able to create a ring completely from scratch or from free-form ideas. I really wanted to show this in a simple and direct way, so I created an animated gif to show what a fully-customized experience truly means. This gif was added to the about page
Wireframe iterations based on testing
Moving into the design phase, our team reminded ourselves of the key user needs from research and planning to design solutions to meet these. We also iterated based on testing results and produced 4 versions of wireframes.
Key user priority #1: Build Trust — Customers want to feel they can trust the jeweler’s experience and expertise
Design Solution:
- Clear and Concise — ‘Who is Engager?’, ‘What do they do?’, ‘How do I get started?’ were all important questions we wanted to address right away on the home page.
- Setting users up for expectation builds trust — show Engager process on homepage.
- Emotional connection — customers are buying an engagement ring, not a handbag, so the copy and images need to appeal to their emotions.
Homepage
About Page
Navigation bar
Key user priority #2: Learning/Education — Users enjoy learning about an engagement ring as part of the experience
Design Solution:
- Basic education about an engagement ring — this is common industry practice, however, most websites have it as a separate section, sometimes hidden away in the footer. We wanted to provide education but also lead customers to the design page while we have their attention.
- Inspirational on-boarding quiz — customers go through a 3-minute on-boarding quiz to formulate their design ideas. At the end of the quiz, there is a prompt for them to make an account to save their results. This is a much more comfortable transition than asking them to sign up right away.
Through testing, we found that some of the questions in the on-boarding quiz were too specific (i.e. what kind of shape of stone?). Since the purpose of the quiz is to get the customer thinking about their design, so they can contact Engager after creating a profile to continue the design process, it was not needed to know the specifics about the ring just yet. We added an intro page before the on-boarding quiz to set the context so customers know what to expect.
Key user priority #3: Story-telling — Users want to tell a good story with the ring
Design Solution:
- Keep ring stories for reference — this was on the original website, and we cleaned up the layout to make the stories more concise. Customers like Jason enjoy reading about other people’s ring stories to get inspiration. It also builds trust to read about other couples’ positive experiences with Engager.
- Appeal to emotions — Show hand-written thank you letters from previous customers.
5. PROTOTYPE
You can view the prototype on Figma here.
Summary
After the 3 weeks design sprint, we were able to deliver a modern and elegant website to our client, Engager Rings. Coutu was very impressed with our work and feels excited to present this new image of Engager to investors.
Our team really enjoyed the challenge of building a meaningful online experience for such an important part of people’s lives. We learned a lot about what converts visitors into customers, and what it takes to bring personal in-store experience into the digital space.
For next steps, we would focus on designing the rest of the screens for mobile, to ensure responsiveness. It is important to make sure the on-boarding quiz will be clear enough to view on mobile, to ensure the user experience is consistent across both desktop and mobile platforms.
Hello, thanks for reading! I hope you enjoyed this case study as much as I enjoyed writing it. I would appreciate any feedback! Say hello to me at sissi.ke2@gmail.com or connect with me on LinkedIn.
