Eco-Stylist is a men's clothing discovery platform that recommends sustainable and ethical clothing brands.
"Just launched with the goal of connecting people to ethical, stylish clothing options, Eco-Stylist is looking to bring personalization to their marketplace and find ways to add value to their customers’ experience."
01. Problem
The users needed the following issues addressed:
As a stylist, I can add recommendations so that I can help showcase featured products.
As a customer, I want to share my preferences and style so that I can receive personalized style and product recommendations.
As a customer, I want to look through curated content so that I can discover new products.
As a customer, I want numerous ways to sort through a catalogue so that I can find a specific item.
02. Research
I researched the current state of the Eco-Stylist website and came to the conclusion that Eco-Stylist is a men's clothing discovery platform that recommends sustainable and ethical clothing brands.
I also needed to hear directly from the users to gather information about how they discover new brands and their current experience using Eco-Stylist.
Screener Survey
/Research
Potential interviewees were screened with a survey to make sure they fit the target user:
Men who enjoy shopping from ethical and sustainable brands
Interviews
/Research
Interviews were conducted to find answers to the following questions:
How do you find new clothing brands?
What resources do you use for shopping research?
How does social media affect your brand research and processes?
What makes you want to shop more ethically, sustainably, and environmentally friendly?
What do you think is the main function of Eco-Stylist?
Affinity Map Key Insights
/Research
Users assumed Eco-Stylist was an e-commerce platform
Users mainly discover brands through social media and recommendations from friends and family
Users are worried about loosing their individuality when working with a stylist
Proto-persona
/Research
This placeholder persona was created through talking to the users to help my team stay aligned on exactly whose problems we were solving.
03. Initial Design
Original Homepage
/Initial Design
Users were generally confused about Eco-Stylist's purpose. They assumed that is was an e-commerce site, rather than a discovery platform.
I decided to focus on redesigning the homepage and here is why:
Homepage redesign: The homepage is integral to demonstrating the purpose of Eco-Stylist. If users do not understand that purpose from the start, then Eco-Stylist is relying on the user to discover the value of the product.
Here are other solutions I considered and why they were not pursued:
Instagram ads: They can be great to incrementally educate users, but paired with a mismatched homepage, they could also unintentionally cause mistrust between the user and the company.
Welcome pop-up modal: One well constructed pop-up cannot solve the confusion of a poorly designed site. It only acts as a momentary band-aid.
Paper Sketching
/Initial Design
04. Build
Initial Wireframes
/Build
05. Test
User Testing Round 1
/Test
Using Usertesting.com, I asked 3 users to complete the following tasks:
Explore the homepage
Discover how Eco-Stylist adds new brands to their site
Find out how you would get stylist recommendations
Insights
/Test
Here is what I learned from the user tests:
Users were still generally confused about Eco-Stylist's purpose, they expected the site to be an e-commerce platform.
Users were confused by the site's information architecture and were unable to find information about how Eco-Stylist add brands to their site.
Users were able to find the stylist information, but still struggled to see the value of working with a stylist.
06. Pivot
The prototype needed to leave no question on the user’s mind as to what they were supposed to do the moment they arrived on the landing page.
Solution
/Pivot
Tinder for fashion. There are two apps with a similar idea: Mada and The Yes. Both apps provide features to curate clothes, but neither feature men’s clothing or eco-conscious brands.
Here is how the new solution addresses the problems identified in the fist user tests:
The familiarity of a swiping feature would immediately engage users. The mood board and bookmarks that come from engaging with the swiping features demonstrates the purpose is to give recommendations, not sell directly on the site.
Simplifying the site's information architecture to create clear hierarchy will make the site's navigation more intuitive.
Introducing users to the idea of receiving clothing recommendations through the swiping feature would introduce them the value of hiring a stylist.
07. Design
Final Sketches
/Design
08. Build
A/B Testing
/Build
Information Architecture
/Build
The information architecture of the site was reduced from about 24 to 11 main pages. (See Appendix)
09. Test
User Testing Round 2
/Test
In this round of testing, I asked the users to:
Interact with the swiping feature on the homepage
Discover how Eco-Stylist adds new brands to their site
Explore how you would work with a stylist
Insights
/Test
Here is what I learned from the user tests:
Users were no longer confused about the purpose of Eco-Stylist. They recognized that Eco-Stylist's purpose was to provide recommendations because items could be bookmarked. A design affordance that represents saving, not buying.
Users found Eco-Stylist's resources quicker with the new navigation.
Users were more interested in exploring the rest of Eco-Stylist's services because of the immediate engagement they experience with the swiping feature.
Most importantly, the adoption of the swiping feature from a different industry meant users did not have to learn a new skill or system to get the most out of Eco-Stylist.