While sustainability is an increasingly important consideration when shopping for clothing, many consumers still purchase fast fashion. Ecology’s goal is to make shopping for sustainable clothing accessible and appealing to everyone.To do this, Ecology is launching an e-commerce site specializing in sustainable fashion.
Create a hassle-free shopping experience that makes sustainability feel accessible and inclusive.
Card Sorting
User Interviews
Testing
UX Research
UX Design
UI Design
Prototyping
Usability Testing
Figma
Adobe Illustrator
120 Hours
Speculative Project
• Identify barriers that customers face when shopping online and remove them from the shopping experience.
• Find out what users prioritize when shopping online.
• Market research of online retailers in the sustainability/vintage space to determine the types of experiences that shoppers are used to having.
• Virtual user interviews to gain insight on the needs and preferences of potential users.
Competitors in the sustainable fashion market were evaluated to gain insight on UI patterns, branding, and existing approaches to eco-friendly online shopping.
Key Takeaways
• The most successful interfaces are simple, with one or two calls to action
• Most had a “like” option to save items for later
• Photography plays a huge role in the feel of the brand
• Too many small photos/links make the site feel cluttered
• All of the sites use a neutral color scheme and allow the photos to create color
The main problem that users reported with shopping online is being able to confidently select an item that will fit well. Related to this, they perceived the process of returning items that do not fit as too much of a hassle.
"I prefer shopping in person because I'm plus size and have a hard time finding clothes that fit. It's good to be able to see and touch and feel."
“Shopping online is more convenient, but I prefer being able to try on clothes at the store before making a decision if possible.”
“I prefer the experience of shopping online, but only if it's a replacement for an item I've already purchased, so I know it will fit."
Based on my user interviews and market research, I developed an empathy map to connect with the potential target user.
Using the frustrations and motivations identified in the user testing and interviews, I developed a fictional persona to embody the needs of the user. This persona was referred to throughout the process to help center the goals of the user when redesigning the site.
Annalina puts a lot of consideration into her decisions. She cares about her impact on the world, and tries to make choices that align with her values. She is willing to invest in items that are high quality and will last a long time. She often discovers brands on websites like Instagram and Pinterest. She takes her time browsing a website before making a purchase, wanting to select pieces that will fit with her existing wardrobe.
Personality
• Thoughtful
• Deliberate
• Skeptical
Frustrations
• Buying an item that doesn't fit
• Companies that use unethical labor
• Returning items is a hassle
Motivation
• Cares about the planet
• Wants to feel confident in her clothes
• Wants to shop online to stay safe from COVID-19
Goals
• Purchase durable, sustainable clothes that fit
• Shop at companies that align with ethical values
• Find the lowest price without sacrificing quality
Annalina, a deliberate consumer, wants to feel confident about buying the right size when shopping online.
Rapid brainstorming was performed to generate potential features that might help solve the user’s problem.
Sketches and responsive wireframes were created to solicit feedback and iterate on the design concept. The core feature designed to solve the user problem was a size calculator, in which users could input their measurements to determine the correct size.
I designed a logo and style tile to establish brand guidelines to be used throughout the site. The branding is intended to be earthy, contemporary, and minimal.
I refined the responsive wireframes, using the brand style guide to develop the look and feel of the site.
I used the expanded branding to generate high fidelity wireframes for desktop, tablet, and mobile.
• User impressions of the brand aligned with what was intended
• All users were able to complete the task of finding a specific item, calculating their size, and adding it to the cart
Two out of five participants did not notice the size calculator and scrolled straight to reviews. One stated, "this was almost so helpful that it wasn't even something that was on my radar. I thought I would have to go hunt and do my own research." The other said, "I missed the [calculate my size] button initially because I assumed it was an 'add to cart' button."
The size calculator is an effective tool to help users gain confidence that they are purchasing the correct size.
To develop this project further, I would complete the checkout flow and introduce more products with functional categories and sorting.
