GlassesOn

UX/UI Design
ROLE
Product Designer
User Research, Prototyping & Testing
overview
GlassesOn is a mobile application designed to help users find the perfect pair of glasses. The app is designed with a user-friendly interface and advanced search features that make it easy to discover new styles and compare options.
GlassesOn is a fictitious mobile application designed and created as part of a UX/UI course.
View Prototype

Introduction

As someone who's been wearing glasses since I was 11 years old, I know firsthand how frustrating it can be to find a pair that you really love. For years, I settled for glasses that were just "okay" because I didn't have the time or energy to try on dozens of pairs at various eyewear stores. I also noticed that many other people were in the same boat – they'd settle for glasses that they didn't love, simply because they couldn't find the right pair.That's why I created GlassesOn – an app that makes it easy to find the perfect pair of glasses without ever leaving your home. With GlassesOn, you can browse a wide selection of styles and brands, customize your glasses to match your preferences, and try them on virtually to see how they look on your face. The app is designed to be user-friendly and easy to navigate, so you can quickly find the glasses that match your unique style and needs.I built GlassesOn entirely on my own, and I'm excited to share it with others who are looking for a better way to shop for glasses. My goal is to make the process as seamless and stress-free as possible, so that you can find a pair of glasses that you truly love and feel confident wearing every day.

The Problem

Finding the right pair of glasses can be a frustrating and time-consuming process for many people. With so many styles and options available, it can take forever to find a design that truly matches your personal style. This often leads to a lot of frustration and wasted time.

The Solution

GlassesOn simplifies the glasses-buying process with a variety of styles and brands to choose from, virtual try-on, and easy navigation. Users can find glasses that match their style, save time with virtual try-on, and avoid frustration with the app's efficient design. Overall, GlassesOn offers a streamlined and enjoyable glasses-buying experience.

User Research

I conducted in-depth user interviews with people aged 16-60 who wear glasses and have digital literacy to understand their problem-solving strategies, pain points, goals, and expectations related to the product.

Q: "What is your main difficulty in buying glasses?"

Market Research

To develop an effective UX/UI design for my app, I conducted market research focused on analyzing the key features of 8 existing apps. My research included examining the conceptual model, navigation and orientation system, structural and behavioral consistency, learning curve, visual design of the interface, and efficiency of work processes. Through this research, I gained a solid understanding of the design elements critical to the success of my app and can apply these insights to create an effective UX/UI design that meets the needs of my users.

Usability Testing

I conducted a comprehensive evaluation of the platform, which involved testing its usability, usefulness, and user satisfaction. To gather feedback, I allowed users to test the high-fidelity wireframes I created.
After conducting user research and analyzing the feedback, I made improvements to the wireframes to address the issues that were identified

Before

Frame selection process

  • Testers struggled with identifying icons and understanding their usage, but were excited about the simulation feature.
  • They had difficulty understanding headings and linking frame shapes to their names.

After

Frame selection process

  • Removing the 360 icon and arrows
  • Replacing the preview icon with a "Try me" button
  • Reorganizing the hierarchy of the headings
  • Changing the display mode of the frames

Before

Lens selection process

  • Participants did not distinguish between the types as there was no text or representative image.
    Only after clicking and displaying the prescription type name, participants understood.
  • Participants thought that the lower lens leads to opening the camera.
  • Participants had difficulty understanding the differences between prescription types and did not notice the "question mark" button.

After

Lens selection process

  • Changing the prescription type and lens selection display
  • Adding information buttons
  • Adding explanatory visual images
  • Separating the prescription type and lens selection stage from the frame and temple selection stage

Before

Prescription process

  • Testers struggled with the purpose of the repeating question mark icon.
  • Testers were able to fill in prescription details, but some noted that the display did not resemble an actual prescription.
  • Testers successfully used a photo of the prescription and were excited about this possibility.

After

Prescription process

  • Information retrieval was only available in 2 areas.
  • Changes were made to the prescription filling structure and adherence to a real prescription.

Wireframes

The Final Product

Home Page
The home page displays various options, including the ability to start designing glasses based on frame shape or popular trends, or to directly navigate to the design page through the bottom bar.
Design
Clicking on the 'Design' button in the bottom bar takes you to the beginning of the glasses design process. You start by selecting a frame shape, followed by choosing the frame itself
Filter
On the design page, you can filter the available frame options by color, brand, material, and more
Design
The next step is to choose the temples that will fit the frame.

At any stage of the design process, you can click on the 'Try me on' button to preview the glasses you've designed in 3D                                                      
Presciption & Lens
After completing the design, you move on to selecting a prescription and filling it out, followed by choosing a suitable lens                                      
Shopping Cart
The shopping cart screen displays all the items that were used to create the final product. Prices are displayed for each item and it is possible to edit any of them, which returns you to the same editing stage.
Profile
contains information about my orders, account security, account details, and payment details.
My Orders
displays active and closed orders and shows where each order is located while updating the buyer.
Order Tracking
provides detailed information about an order, including when it was placed, its current location, estimated shipping time, and more. It allows customers to easily monitor and track their orders throughout the entire shipping process, providing a better sense of control and understanding of their purchases.
Order Details
provide information about the order itself, including the items purchased, estimated shipping time, buyer information, and more. It is a summary of the specific order placed, detailing the products or services bought, the cost of each item, the total price, and any additional fees or taxes. This information can be useful for tracking orders and resolving any issues that may arise with the purchase.
Review
After receiving the shipment, it is possible to leave a review on each item, and attach photos if desired. Afterwards, the reviews will be displayed in the information section of each item.
Back Home
Next Project
Made with ♡ and passion - Yael Mordehai
LINKEDINRESUME