Role
Sole UX/UI Designer
Timeline
6 weeks, 150+ hours
Overview:
Mirror is a successful retail store with over 400 brick and motor stores around the world. To increase more sales and provide a very comfortable service for their customers, Mirror has decided to create an online shopping platform.
The goal was to evaluate user's goals when shopping online and create a user-friendly focus responsive web design. Mirror also wanted to revamp their logo.
Problem:
Mirror wants to expand their user reach by creating an accessible and comfortable online shopping platform with a revamp to their logo.
Research Goal:
• Figure out what shoppers value in their online shopping experience
• Figure out information architecture : how do users link words together
• Make task flow readable: see how users do their task
User Interviews:
Conducting 1-1 interviews with 5 participants, the objective was to reveal online shopping pain points, habits, preferences, and perform user testing on popular ecommerce platforms.
Key Insights:
Motivations:
• Seeks a comfortable online shopping experience
• Appreciates sites that provide a fast shopping experience
• Values time and money
• Appreciates clean and organized UI
​
Needs/Frustrations:
• Desires reliable, free shipping and returns
• Frustrated by having to browse unwanted brands
• Values a professional, trustworthy UI that helps helps achieve a time-efficient shopping experience
Research Goal:
• Figure out what shoppers value in their online shopping experience
• Figure out information architecture : how do users link words together
• Make task flow readable: see how users do their task
Persona:
By developing a detailed persona, I aimed to illustrate a deep understanding of the target audience's needs, preferences, and pain points. This persona serves as a guiding reference throughout the design process, enabling me to create intuitive and tailored experiences that resonate with users, resulting in enhanced engagement and satisfaction.
Project Goals:
This showcases my ability to establish clear objectives and effectively strategize the development of a user-friendly and successful online shopping platform. By outlining the goals, I demonstrate my understanding of aligning design decisions with business objectives, user needs, and market trends, ultimately creating an impactful user experience.
Card Sorting:
Overview:
To identify and understand how participants group certain items into different categories, I gathered multiple participants to conduct a card sorting survey.
The goal of this card sorting is structure the content according to user’s mental model.
Participants:
• Number of Participants: 5 females, 1 male
• Participant Ages: 23-30
• Number of Cards Presented: 20
• Online Tool Used to Conduct Survey: Optimal Sort
✓
✓
Findings:
Tops, Bottoms, Outerwear, and Accessories were the common organized categories
Some participants grouped shoes in its own category and some grouped them together with accessories
Sitemap:
The sitemap demonstrates my meticulous approach in mapping out the hierarchy of pages and content, ensuring a user-friendly browsing experience and easy navigation for visitors. It highlights my understanding of the importance of clear navigation paths and logical grouping of content, ultimately contributing to an enhanced user experience and improved conversion rates on the website.
Wireframes:
By including mid-fidelity wireframes, I aim to illustrate how I translate user needs and business requirements into a tangible design solution, allowing stakeholders to visualize the overall user experience before diving into the detailed visual design phase.
UI Kit:
The UI kit demonstrates my understanding of designing consistent and user-friendly elements that meets the motivations and needs of the user persona. The inclusion of the UI kit in my ecommerce website serves as a valuable resource for streamlining the design and development process. By utilizing the UI kit, I can ensure consistency in visual elements, typography, color schemes, and layout across different pages, resulting in a cohesive and user-friendly interface. This not only enhances the overall user experience but also saves time and effort in creating and maintaining a visually appealing and functional website.
Responsive Frames:
The responsive frames allows me to demonstrate how the website design adapts and optimizes across different devices and screen sizes, ensuring a seamless user experience for customers accessing the site from desktops, tablets, and mobile devices. By showcasing the responsiveness of the wireframes, I can exhibit my understanding of the importance of accessibility and usability across various platforms, ultimately enhancing the overall user experience and maximizing customer engagement.
Affinity Map:
I employed the affinity map technique for my ecommerce website to effectively analyze and organize user research findings. By categorizing user insights and feedback into related themes, the affinity map helped identify patterns, pain points, and opportunities for improvement. This method facilitated a comprehensive understanding of user needs and enabled me to make informed design decisions that aligned with user preferences, resulting in an enhanced user experience on the website.
Improvised Prototype:
Based on valuable user testing feedback, I iterated on my prototype to address areas of improvement and create an enhanced version that addressed identified shortcomings.
Next Steps:
Based on valuable user testing feedback, I iterated on my prototype to address areas of improvement and create an enhanced version that addressed identified shortcomings.
