The rapid evolution of fashion has caused some brands to sacrifice sustainability. GoodOnYou’s web app reduces the time a user spends presenting the user with various ethical fashion options.
I worked on improving the navigational component of GoodOnYou’s web app to increase user satisfaction.
Overview
About : I redesigned GoodOnYou's web app as part. I noticed with the current rise of ethical and sustainable fashion that consumers are looking for ways in which they can improve their shopping habits. The GoodOnYou web app reduces the time spent looking for ethical fashion options. I wanted to increase the user's satisfaction during their search.
Objective: A responsive web app that guides and facilitates the search for ethical fashion.
Design Thinking
Define
Problem Statement
GoodOnYou offers users various brand options that are ethical and eco-friendly. The menu may not be user-friendly, which affects user engagement. We will know if, after the redesign, we see an increase in user engagement.
GoodOnYou's original design
Empathize
User Persona
GoodOnYou's target audience was identified by looking at their models, affiliated brands, and observing the general fashion audience. I created this persona to analyze the target audience and identify the user's pain points and goals.
Card Sorting
The information architecture of the menu page seemed to have some discrepancies. I conducted a closed card sorting study on OptimalWorkshop with nine users.
User Flow
After conducting user research, I developed a user flow diagram of the redesigned homescreen.
Ideate
I designed the required functions and user interface in the wireframes - ranging from low, medium, and high fidelity.
Low Fidelity
With the user research in mind, I used pen and paper to sketch my ideas for the redesign.
To best adapt my design to tablets, the design offers tablet and desktop users a top article on the homepage. There are arrows for users to view other articles with more information than on the mobile.
With larger breakpoints, the Brand Directory page now has images assigned to each category.
The breakpoints for the desktop version have similar attributes to the tablet. The difference here is more articles are on the home page.
Mid-Fidelity
At this stage, I knew what direction the redesign was going and focused on improving the details.
Design
Moodboard
I wanted to maintain the current aesthetic in the redesign. It is a clean look, with diverse models and calming color.
Style Guide
Iconography
UI Elements
Prototype
High Fidelity
The sequential flow was now part of the design. By keeping the iterations of my design in mind, I applied design theory to evoke feelings of trust and luxury in the brand. To offer a simple and clean design, the brand directory showing the number of brands per section got removed.
Different Breakpoints
What is Next?
Conduct first round of usability testing
Test accessibility of current redesign
Develop an interactive feature to keep users engaged