UX case study for e-commerce app
UX Research and Visual Design (Solo)
2 months
The problem we're trying to solve is...
How can we solve this...
Skinis is a visionary e-commerce app designed with accessibility and inclusivity in mind. The app aims to provide a more seamless and user-friendly interface for customers by challenging norms and redefining the concept of swimwear.
Working in a team of two, we managed several responsibilities while navigating the challenges of a fast-paced, ten-week course with strict deadlines. In addition, we were juggling additional courses and extracurriculars while designing Spendr.
Traditional e-commerce platforms for swimwear often lack accessible and inclusive design, making it difficult for diverse users to find products that meet their needs and preferences comfortably.
User Research
Competitve Analysis
User Personas
Empathy Map
Brainstorming
User-Flow
Wireframing
Hi-fi Prototype
Usability Testing
Implementing Feedback
In order to delve further into user preferences and requirements, I utilized a survey and conducted face-to-face interviews.
Building empathy and understanding user needs.
.png)
Organizing pain and challenges, user needs, and goals.
.png)
Market research and analysis of strengths and weaknesses.
Simple user flow for e-commerce app.
Quick brainstorm wire-frame for checking out an item.
Design system encompassing Skinis' brand values.
I presented my hi-fi prototype to each person separately, and I asked the users to note down any feedback on design, functionality, and prototype.
Functionality Feedback:
Data Feedback:
Prototype Feedback:
Include filters for reviews.
Include measurements and dimensions of products.
Include more filters.
Clean and appealing UI.
Could use some more color.
Some areas can use more contrast.
Hard to navigate from some screens.
Hamburger menu does not work on all screens.
Cannot exit out of shopping cart, shipping, and payment.
Implementing changes using data and feedback from user testing.
For the products (Tops/Bottoms) page, I added a “Body” filter option in the filter section.
For the product detail page, I added a measurements area to include measurement specifics for the item.
In the Reviews page, I added a filter section that allows the user to view specific reviews, as well as the option to filter from lowest to highest or highest to lowest reviews.
In the Shipping, Payment, Order Summary, and Track My Order Page, I changed the color of certain words from grey to a darker grey. This increased contrast and improved readability.
I enjoyed learning about UX fundamental principles through this project. As someone with prior experience using Adobe products, I found it easiest to use Adobe XD before learning other tools such as Figma. This project helped me discover my love for fashion branding and designing e-commerce digital products. Something I would do differently next time is that I would use advanced tools and place a greater emphasis on maintaining consistent spacing.
