Project Overview
Client: NORDSTROM (unsolicited)
Nordstrom is a global retailer well known for its high-end apparel selection and its impeccable customer service. Adapting to market trends, Nordstrom has also ventured into selling non apparel selections from diapers, electronics to personalized items.
Duration: 80 hours
My Role: End-to-end UX/UI Designer
What's the Problem?
Nordstrom members have to go elsewhere to host their registries and losing out on the opportunity to collect Nordy points for rewards.
Solution?
Creating a registry feature that will be integrated on Nordstrom's website to ensure a seamless experience while providing the same standard of service that Nordstrom offers in addition to a few more perks.
Research Goals:
Uncover market gaps by understanding current market trends for gift registry features
Gain deeper insights by comparing registry features by close competitors and analyzing their pros and cons
Discover users’ habits, needs, thoughts, process, pain points and how they try to solve current challenges
Identify which platform (desktop vs mobile) is being used most for creating, maintaining and buying from registry
Methodologies:
Market research
Competitive analysis
Survey
Individual interviews
What Are Others Doing?
I looked at close competitors whose businesses focus on apparel and secondary competitors who are large retailers selling household products with a percentage in apparel.
I did a comparison on the features each company has for their registry function.
Understanding Users
A large number of respondents is necessary to validate hypotheses quantitatively. Included open ended questions and provided participants with a few multiple-choice answers (and an Other option). Survey was created in Google forms and distributed to the target audience, mostly married women or mothers, Nordstrom membership not specified.
User Interview:
Five parents were interviewed, four women and one man. Three are Nordstrom members while the other two are not. Two interviews were carried out in person and the rest virtually.
Insights:
Identifying Current Problems
Taking into account the entire research findings, I created an affinity map to help focus what was heard, categorizing and coming up with potential solutions.
Insights from interviews were used to develop the persona of Erin
Conclusion from Research Stage
Design a feature that:
Makes it easy for members to add items directly from Nordstrom's website
Lets members leverage Nordy points
Gives plenty of options not only specialized to Nordstrom's items
Time to Prioritize
With the knowledge of what the users expect and what the competitors do, I was able to start to define the website's scope. I started by creating a list of features complete with description, reasons and supporting evidence.
Mapping It Out
I then build a sitemap to understand the interactions required for a user to create a gift registry. It is important as the designer to visualize a more in-depth user's hypothetical journey that includes different choices or difficulties the user might face navigating the website.
Flows
From the sitemap I was able to see how users would flow through the website. Mapping out the flow not only provides more clarity on the functionalities of the registry feature, but also helps me decide if the sitemap is logical and easy to navigate or not.
In this scenario, our persona Erin is trying to create a registry and add an item to the registry.
Sketches
I started the design process with low fidelity wireframes. This is the way I iterate through many design options quickly. The focus were on two main pages, the landing page and the registry homepage.
For this exercise I realized that my ideas tend to deviate too far from Nordstrom's so naturally most of the ideas were crossed off. I spent a long time browsing Nordstrom website and took notes of their design choices in order to make the feature look seamless and in par with the company branding.
Wireframes
I created the first mid fidelity wireframes in Figma and used this version as a prototype for user testing. I decided to create an interface that was consistent with the company branding, taking inspiration from the current account settings page.
The design has to be minimalist, organized and inviting while maintaining a sense of familiarity. It had to establish trust while bring informative. Each element was considered when constructing these rough wireframes. These helped set the standard for the rest of the design process.
Layout Changes
On the product page, I changed the content styling slightly by going with two columns layout for the description text. Current Nordstrom's website design populates only the half left side with text but leaves the other half blank. I believe it is a better use of space since I have more content to show.
Same goes for the customer reviews section. Nordstrom's current website design only has half of the left side of the entire page populated with text and customer images below it. This makes for a long scrolling. I moved the pictures to the right in a carousel style to decrease scrolling.
User Testing
3 participants participated in the testing. 2 were previously interviewed for the research phase while the other one did not although familiar with the project already. Each session ran for about 30 minutes.
Scenario:
You are an expecting parent and a Nordstrom member. You want to register for your baby shower at Nordstrom. Create a baby registry and add a stroller worth $700-800.
Testing Insights
The test went relatively well with everyone completing their scenario without hints. All complimented how clean and accurate representation of Nordstrom the design is. However, some pages need further work as some things are confusing.
Wins
Users had a delightful, streamlined experience
Design successfully recognized as Nordstrom's extension
The information included was informative and thoughtful
Guides were helpful and increased users' confidence
Small Updates
Text sizes and signing in as customer instead of creating new account.
Structural Changes
Reconsider the flow of onboarding steps
Reword and add more explanation to why the sensitive question is necessary
Add guidance or callouts to the "add item" menu
Improving the Design
Based on what was heard during usability study, I made changes to the onboarding process, writing more explanation, and adding guidance to the add registry dashboard page.
Moving On to High Fidelity
I took some images from Nordstrom directly and tried to find similar style photos from other sources. It very hard to find as Nordstrom's photos are unique to them. Given more resources I am confident I would be able to match the photos as closely as possible to Nordstrom's aesthetic.
Test out the final prototype below!
Reflection & Next Steps
Working for a company with an already very established branding is indeed more challenging that I thought it would be. There are certain things that I want to change but decided against for it will decrease familiarity. I believe I managed to choose smartly and work subtly by keeping the improvements to a minimum.
This is one of my passion projects as I love Nordstrom and being able to create solutions that will improve parents' life. Parenting is already hard enough and finding/asking/buying for things you need should not be a daunting task to do.
Given more time, I would like to create more screens for viewing the registry in both user and guest views, in addition to developing the registry app. With more resources I would like to find better photos that are more in line with Nordstrom's style.