Signet Jewelers Ltd - Bridal Configurator Usability Study

One of my favorite projects that I worked on during my time at Signet Jewelers was the work that I did on our brand-new Jewelry Configurator. From April 2019 to April 2020, I had the opportunity to be Signet’s UX Stakeholder on this project, working as a liaison between Signet and Gorilla Group, the agency that was building the configurator for us. What made this such a unique opportunity was that it gave me to work with all the brands under Signet, not just Jared.

While the overall project revolved around building a robust and high-end jewelry configurator that every brand in Signet could utilize, it was also to build a configurator that could deliver two different customization experiences to users. The first experience was a Universal Jewelry Configurator, which would allow users to fully customize and personalize a broad range of jewelry types for any occasion. The second type of experience was the Bridal Configurator, a variant of the base configurator that would exclusively focus on Engagement Rings. The main goal of the Bridal Configurator was to not only deliver a high-end web application that makes building an engagement ring a one-of-a-kind experience but it was also to create a tool that luxury designer brands can customize to match their brand. That’s why Signet partnered up with Neil Lane when beginning this project, in order to make sure that our configurator could be used and customized by any brand right out of the gate.

The work that I would like to highlight on this page is the usability study and hi-fi wireframes/mockups I built with another coworker from Signet. This test was made during the final stages of the design process sprint, right before development was approved. We chose to do it at this time in order to make sure there weren’t any glaring issues in the Bridal Configurator’s usability and overall navigation. We had a total of 4 participants for this test, and each one used both the mobile version and the desktop version of the configurator ( 2 starting with mobile and ending with desktop, and 2 starting with desktop and ending with mobile).

Usability Test Script

Scenario: You are creating a custom Neil Lane engagement ring for your significant other.

1. Task: As you’re going through this test, please state any thoughts you have about the site and overall experience out loud

2. Link: https://uat4.kay.com/configurator-p/V-111111111 

3. Question: Where would you click if you wanted to begin building a custom engagement ring?

4. Task: Select a mounting type and move to the next step

5. Task: Go through the stone step and select a center-stone type, shape, carat weight, clarity, and color. Then, move to the next step.

6. Question: What site are you currently on?

7. Task: Before selecting a center setting, go back and change the stone shape to another type.

8. Task: Go back to the center setting, select a setting, and move to the next step.

9. Task: Select a Metal Color and move to the next step

10. Task: Select a Finishing and move to the next step

11. Question: If you wanted to go back to the very first page you started this test on, how would you get there?

 Internal Presentation/Summary

Key Findings

1. Participants were confused on what step they were on during the configuration process on mobile/participants were annoyed with going back steps on mobile

   • Participants felt it was frustrating to keep tapping the back arrow on mobile to go back a step. This was not an issue on the desktop version, as there was a breadcrumb visual nav that showed where the participants were and allowed them to go back to any step of the process

2. Participants felt that the top left and right buttons in the header on mobile were not clear enough/participants felt the buttons were not consistent between mobile and desktop

   • Specifically, on the desktop version, participants were confused on why the back arrow took them back to the PDP, as it completely contradicted what the back arrow meant on the mobile version. In addition, on step 1, the top left has a “close” label that changes to the back arrow once the participant gets to step 2.

   • Participants were unclear on what the purpose of the top-left icon was, though once they saw it was a way they could review what they had built so far, participants on mobile liked this component of the experience

3. Participants were unsure on whether or not they were still on Kay or not

   • Users didn’t expect to be taken back to Kay when they clicked on “Neil Lane”

Deliverables

Outcome

I presented the usability study findings to both Gorilla Group and Signet Jewelers, accompanied by high-fidelity wireframes and mockups. Our targeted adjustments were designed to enhance usability with minimal design changes, ensuring smooth implementation before the development phase commenced.

Conclusion

This project exemplified my leadership in UX design, showcasing my ability to conduct thorough usability testing and deliver impactful design solutions. The result was an enhanced user experience across multiple brands and platforms, reinforcing Signet Jewelers' commitment to innovation and excellence.