Soles is a footwear store that started as a small, exclusive store for fashionistas and collectors. After researching the market, Soles decided to switch their ideals as they saw an opportunity to grow and expand. They wanted to offer a different type of experience for everyone in their current website, they also wish to have a more modern and fresh look to appeal a bigger age range of audience.
How might we design an innovate feature for Soles to offer a different type of experience to their customers?
The feature that was created is the "Virtual Matching Room", a place that allows people to find the perfect shoes to match with clothing they already own. All they would need to do is upload or take a photo of their clothing, then the shoes that matches the best would show up.
UX/UI Designer, solo project
160 hours (2021)
Figma, Maze, Zoom, Docs, whiteboard, paper & pen, sticky notes
User research, information architecture, interaction design, wireframing, branding, prototyping, testing
*Educational project as part of DesignLab’s UX Academy, this is a conceptual project, the company "Soles" is not real.
I started by analyzing three competitors and three indirect competitors that offered different experiences to their consumers. This could help me understand not only about the market, the features other competitors offered, but also the reason why people chose them and what could make them choose us instead.
⟶ People want to combine shoes with their current and new clothing.
⟶ They want to have a customized experience.
⟶ Comfort and quality triumphs price.
⟶ Reviews can validate or destroy a product.
At this point I knew one big important discovery was the fact that people seemed to like to match their clothing with their footwear, this is something that Nike encourage by offering clothing and ideas on how to match them with their footwear.
To learn more about consumers, especially their needs and frustrations, I conducted an interview asking questions related to their shopping habits, what motivates them to purchase new shoes, what is the process they go through when choosing their shoes, and if they were interested in combining their shoes and clothing.
⟶ I recruited 6 participants from ages 22-65.
⟶ Interview was conducted via Zoom.
⟶ 6 out of 6 participants were interested in matching their shoes and clothing for different reasons.
⟶ People feel empowered and it makes them feel clean and confident having a good outfit that matches.
In this project, I took the "Jobs-to-be-done" ↗︎ framework into account, which is why my main goal was to find insights about experiences and previously "hired jobs" from people that bought shoes. I created a Job Persona to be my guide on who I was designing for, understanding their needs, goals, frustrations and motivations.
This job persona, also known as "the Shoe Geek", is a student from Florida who loves to collect shoes and thinks the right pair of shoes can make him feel more elevated confident, empowered and cool. The job that he wanted to hire was something that would allow him to find the perfect clothing for his shoes.
I created a sitemap with the help of an open cardsorting with 15 participants, who organized words related to shoes into categories they thought were the most logical in their perspective.
To make sure it was possible for my job persona to find their matches of shoes, I had developed a task flow to help me see the main steps and pages that would be needed to navigate, and the user flow to understand the different paths and scenarios that could happen.
The first wireframes showed different ways to interact with the clothing the user uploaded to the interface, allowing them to match the clothes with existing shoes from the website. I tested these wireframes to understand two things: frustrations and problems, and what people were expecting to find.
I conducted the first usability testing with 6 participants through Maze, to be able to iterate early on the design process. From the test I gathered important insights that would help with the next step:
⟶ People like to have more than one result available of shoes.
⟶ People want to personalize their results with the use of filters and sorting.
⟶ In the proposals, the first step was to fill out a questionnaire before getting the matches, resulting in people wanting to leave the process as it took more clicks to arrive to the actual feature.
⟶ It was not as fun to interact with as I expected and didn’t seem to be a special feature, just a fancy way to display a shoe grid.
Taking into account these conclusion, plus what I observed on the tests, I decided to improve on proposal #3 as that one allowed to interact with the shoes and options while also focusing on the clothing, avoiding the need to use the questionnaire.
Before the prototype was ready, I did the branding of the website, which was a logo inspired on the albino peacock. The peacock is a confident and proud bird, ready to show their attributes and best colors, which aligned with Soles' idea to help people feel their best. The UI Kit was also complete, with a more modern and fresh look.
Now it was the right moment to test the latest prototype, including the branding and the style guide, to identify the customers reactions and expectations.
⟶ The mid-fidelity prototype was tested with 6 participants using Zoom ages 25-35.
⟶ "Thinking aloud" was the method used to get a better understanding of what people were thinking about and why they decided to do certain actions instead of others.
⟶ The test had 1 long task based on the new feature to understand how participants would interact with it.
⟶ Overall, participants understood the process and seemed to be interested in finding more about the feature.
⟶ Test completion was 100%.
⟶ Thinking about the user starts with being able to empathize with them. During the entire process, I not only had the purpose and goal of the project in mind, I also had the user in my mind the entire time.
⟶ When in doubt, take a break to do Crazy 8’s. While the purpose of this project was to do a website, the crazy 8’s let us expand our imagination and find ideas that we might not have thought of if we constrained ourselves to digital design.
⟶ In the interviews, build more rapport with interviewees than follow the script exactly as it was laid out.