Layers is a clothing store with over 400 stores around the world in 32 countries. They are known for their quality products and their affordable pricing for everyone. The consumer has grown to love the store for its unique experience that's not fancy but clean and presented well.
Design and create a functioning prototype of a responsive website for Layer's e-commerce clothing store.
80 Hours with 4 weeks
User Research, Interaction Design, UI, Branding, Prototyping, Usability Testing
Figma, Google Hangout, Zoom, UXtweak, Otter.ai
Before diving into the design we want to create some research goals to help empathize and define the user we are targeting. Then we will do some competitive analysis, market research and 1:1 interviews to discover more information. Below is the summary of the findings.
Before diving into the design we want to create some research goals to help empathize and define the user we are targeting. Then we will do some competitive analysis, market research and 1:1 interviews to discover more information. Below is the summary of the findings.
Slow-loading sites increase the abandonment rate
Required account creation during the checkout process, people will abandon carts immediately.
The product with the highest abandonment rate is clothing
Each interview was conducted in 30 minutes with 10 questions about their recent clothing shopping experience.
From the information collected from the interviews and research we are able to combine the data to create a persona to match our main users.
Meet Esther a hard working visual designer from New York City. She lives a busy lifestyle and has a hard time making time to go to the stores to buy new clothes.
To find out the how users might choose how they categorize different types of products that would be found on an e-commerce website. This information will help us get that data to determine the best categories that users would think of.
We had a total of 30 participants for our card sorting research. 35 items were used to determine the user’s categories.
One of the brief of this project was to help design a new branding to help Layers be modern and neutral. After several iterations of the logo and testing the variations of colors, we created the UI Kit.
Taking our wireframes we began to place the colors, logos, and image to develop the high fidelity wireframe. After step this we will make a responsive prototype so we can test how we did.
We had 5 female participants to test out the responsive prototype. They will be given a scenario to purchase a green dress for a outdoor picnic with some friends. This will help determine how the website work and if there are any pain points.
Most participants chose to sort and filter
2 out of 5 participants was confused when adding the item to cart
3 out of 5 participants used the model option to help them determine the sizing.
One participant thought the page ended at the newsletter signup bar.
100% Completed with no problems
"I like how its familiar but has a fresh feel"View Prototype
© 2022 Tuan Diep
