“Dress Like You Give a Damn” — An Agile Sprint with Eco-Stylist
Introduction
Paired with two other classmates, my team and I were tasked with re-designing key features on the Eco-Stylist website.
Eco-Stylist, a male-focused online resource, “Dress Like You Give a Damn,” helps shoppers make informed choices when looking for Sustainable and Eco-Friendly clothing. While the website is set up similar to a buy-direct store, Eco-Stylist acts as a third party, connecting shoppers to other brands’ online stores. In addition to the SHOP feature, their main browsing option, Eco-Stylist offers Personal Styling packages where they connect you to one of their volunteers who then assists in building out your closet with sustainable outfits. Overall, the website revolves around connecting people to eco-friendly shopping choices and doing so in the most personable way possible. Users have the option to ‘shop’ by their values (Brand transparency, vegan materials, and sustainable business practices).
Project Overview
Task: Having 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.
Scope: A feature focused, two week redesign of Eco-Stylist, a sustainable clothing marketplace for men.
Team:
Resources: Axure, Miro, Balsamiq, old fashioned pen and paper
The Start
We started by identifying who our target audience was. We realized that while Eco-Stylist initially advertises they are a men-focused site, a lot of the brands they connect their customers to are for men and women. The website also features search options to filter by clothing items “for men” and “for women.”
We then established that our target audience could include not only men, but predominately online shoppers, eco-conscious shoppers, and people who buy for men.
From there, we created a Survey to identify interviewees that would fit into the target audience we established. Once we had successful matches, we moved forward with User Interviews
User Interviews
We focused our questions around general shopping habits, eco-conscious shopping habits, curated content preferences, online shopping preferences, and personalized recommendation preferences.
We then used affinity mapping to group these opinions, observations, behaviors, and preferences of our interviewees and pull out key insights.
Synthesizing
A group of user quotes from our interviews —
“In terms of values and morals, I’m careful where I spend my money and the ways I want to be involved with the economy”
“I try to be conscious of what I eat and buy as a way to control my carbon footprint”
“I appreciate when brands acknowledge how ethical and sustainable they are upfront”
“I’d love to buy more eco-friendly, but it’s really hard to find”
Key insights —
After synthesizing our research we were able to hone in on pain points users had with currently shopping eco-friendly as well as what they liked personally in an online shopping experience. Which brings us to our persona, Adam —
Adam highlights the average user of our re-designed Eco-Stylist. Throughout the design process, we referred back to Adam as the main user and made sure to keep in mind his likes, habits, wants, and needs when making any design decision.
Competitive Analysis
In order to better highlight where Eco-Stylist might be falling short, we conducted competitive analysis to look at similar online brands that focus either on sustainable shopping or personalized shopping.
As illustrated above, we found that Eco-Stylist does not offer a personal account or profile feature for it’s customers. Without this key feature, it makes personalization outside of human stylists impossible for the website.
It was clear to us then, this is a large gap in Eco-Stylist’s website and overall brand. There’s a potential for this to attract a whole new user and it opens the doors for Eco-Stylist to be marketed in a unique way. So, we broke it down even further and identified these characteristics —
- Users can’t create an account, and that limits their interaction with the website.
- Users don’t have the option to save and like their favorite items.
- Users can’t get personalized recommendations, which reduces their engagement.
- Not having personalized content limits the users’ ability to find new items.
Problem Statement
The average eco-conscious online shopper needs a more personalized way to browse sustainable clothing, because finding options online on their own can be overwhelming and difficult to narrow down.
Hypothesis
We believe that by re-designing Eco-Stylist to be a marketplace that focuses on personalized shopping experiences and clearer access to sustainable brands, the moderately eco-conscious customer will be more inclined to buy eco-friendly clothing
With my team and I honing in on Personalization in our re-design, we circled back to our user interviews to break it down further into positive and negative insights.
One positive that really stood out to us — users said recommendations allow them to find new stuff they wouldn’t before and exposed them to brands they have never heard of, that ended up becoming go-to stores for them.
On the other hand, one negative we revisited throughout designing— people think those same recommendation systems can be inaccurate, showing users things they would never buy.
Keeping all this in mind, we began designing user flows and initial sketches.
New Feature Overview
We broke down our feature overhaul into two main processes. First, the Personalization Setup. This is where new site visitors would have the option to, not only create a profile, but complete a short evaluation to identify what values they want to shop buy, what brands they prefer, and what clothing items peak their interest.
The second feature we added: My Closet. This would be located on the user’s personalized profile page and act as a consolidated area for a customer’s liked items and recommended outfits, brands, and additional clothing items.
In the setup process, we kept Values at the forefront in order to highlight how the website still centers around Sustainable and Trustworthy brand exposure.
Once we established how our users would set up their personalized shopping experience, we moved onto how they would actually use a recommendation system.
We started with a design studio, coming up with the initial Personalization ideas and quickly establishing a visual concept for My Closet. This gave users more control on what was being shown to them, giving the site’s recommendations potential to be even more accurate. We revisited the design studio exercise throughout the Ideation process in order to solidify which designs we were moving forward to testing with.
Before we dove into the Personalization Setup and My Closet set up, we wanted to test our Global Navigation. We conducted a Closed Card Sort that allowed us to clean up the navigation bar and simultaneously start designing our prototype in Axure.
Paper Prototype
From wireframing and initial sketches, we then conducted a quick user test of our layout using a paper prototype.
First Digital Designs
After testing the paper prototype quickly, we began designing and building a rough prototype in Axure based on our findings.
Above is our first iteration of the My Closet feature.
- Categories of the closet on top
- Based on the item selected on the thumbnails, they will get a larger image with a detailed description of the item
- On the right side, “Complete the outfit” generates outfit recommendations based on the item selected from the closet.
We also added the option to save the entire outfit in the closet or immediately buy the items making up the outfit. On the bottom, a general recommendation system that focuses on brands, items, and outfits based on the information gathered in the Setup process.
The personalization process starts with setting up an account where the user has the option to sign-up, login, or continue as a guest. After creating an account the users can decide if they want to start the personalization process or do it later.
User Testing Findings
To start, usability tests showed there was too much information on the Pop-Up screens. Users were getting confused between the sign-up and sign-in process and they wanted a way to escape or go back from the pop-up page at any given time.
We decided to add the X on the top right corner, and adjust the contrast of the buttons over the background for both the sign-up and sign-in options making the difference clearer.
The main issues found on the closet screen were closet images being too large and distracting. Additionally, the item preview image wasn’t big enough so these two visual features were competing for the user’s attention.
Below, you can see the second iteration of the users journey through Setup.
After more testing, we realized that the main focus while shopping is to see a closet item’s image. With this, we resized the closet menu and enlarged the item preview image, then reorganized the item information including a better description of the values and materials used, and finally moved the thumbnails underneath.
Finally, after testing and redesigning, we had our “final” prototype.
Click through our Mid-Fi feature re-design of Eco-Stylist with the link below —
https://frn7wf.axshare.com/#id=dkr6bc&p=homepage
The prototype guides users through the Personalization Setup process, brings you to your profile, and allows you to sort through liked items, recommended items, and see real-time creation of outfits for users.
After finishing up our working prototype, ideally we would move forward with more rounds of user testing.
If we were to build out the Personalization features more, some additional ideas include —
- Adding Tool Tips to the My Closet feature
- Creating a way for users to create their own outfits from scratch, using recommendations as suggestions.
- Separating even more My Closet recommendations and general Recommendations, diving into New Brand exposure even more.
- Go back and do more research and interviews, diving into different ways our target users like to visualize Personalized Recommendations.
Fin.
