Superfly - Find your Right Fit of Jeans

Mobile UX & Visual Design

Problem: How can you help customers select the style of jeans that they’re looking for in the right size?

Project Duration: 12 Weeks

Project Overview

Superfly is a jeans shopping app that delivers an exceptional fit and style experience through infographic data-based personalised recommendations, home trial services, and images posted by shoppers.

This project was part of my assignment for the PGC course in UX Design & HCI by IIT Guwahati.

Process & Timeline

Research

In the first phase of the design process, I did a competitive analysis, defined the target users of apparel shopping apps, and conducted a contextual inquiry.

Competitive Analysis

I took a survey to identify 3 most preferred platforms used by frequent shoppers for purchasing jeans online. I conducted a comparative analysis focusing on features that assist in finding the right size of apparels.

Contextual Inquiry

I recruited 8 participants via a screener survey and conducted a contextual inquiry over Google Meet.

During the inquiry, I asked participants to look for jeans to buy online in the right size on their preferred platform while I observed their steps and asked them questions with the following at the focus of inquiry:


  • Why do they prefer their selected shopping platform?

  • What helps shoppers understand the fit of jeans without physically trying them on?

  • What steps do shoppers take to find the right fit of jeans?

  • What motivates shoppers to shop for jeans online instead of stores?

  • What frustrates the shoppers while looking for jeans online in the right size?

Modelling

In this phase, I extracted key insights grounded in user data to find the needs, frustrations, and pain-points in user journeys

Single-case Analysis

I transcribed the data from the contextual inquiry and noted the key takeaways from answers of every participant.

I separately grouped the key takeaways from the 8 participants.

Cross-case Analysis

I identified patterns in the key takeaways of all the participants and grouped them based on common findings using open-card sorting to extract key insights.

Activity Analysis

Using the contextual inquiry data, I inferred the activity flow of finding the right fit of jeans.

Decision Tree Diagram

I focused on the activity diagram of finding the right fit of jeans online and identified crucial decision points.

Key Insights

Requirements

In this phase, I created user personas, defined problem and vision statements, brainstormed solutions, and illustrated scenarios.

User Personas

I developed 2 personas that reflect the user group's goals and frustrations.

Defined Problem Statement

Shoppers prefer to try jeans on before buying them and often return online purchased jeans due to bad fitting. The inconsistency in size charts provided by different brands for the same measurements poses a significant challenge in selecting the right size, making the process tedious and frustrating.

Additionally, the lack of representation of diverse body types on product pages makes it difficult for shoppers to relate to how the jeans would look and fit on their unique body shapes.

Brainstorming

Vision Statement

A world where shoppers effortlessly find their perfect fit of jeans every time, eliminating the hassle of returning ill-fitting purchases. They have a clear understanding of the style, size, and fit of jeans before making a purchase without the extensive task of analysing size-charts for each buy. They get to try multiple sizes of jeans at the comfort of their home without standing in trial store queues.

Superfly simplifies online jeans shopping by prompting shoppers with the correct size corresponding to their measurements, eliminating the manual assessment of size charts. They can also view images of other shoppers with different body types, aiding them in making better judgments about the fit. Moreover, the convenience of booking a home trial allows customers to try on jeans in the comfort of their own homes and pay for the perfect fit at their doorstep. With these features and services, a seamless and satisfying shopping experience is guaranteed.

Scenarios

Keeping the user personas and identified opportunities in mind, I created storyboards to visualize solutions that address the pain points. These scenarios aim to depict the implementation of solutions that effectively eliminate the identified challenges.

Framework

During this phase, I identified functional and data needs and designed the information architecture. I also created the task flows and user flows to effectively visualize and illustrate the process.

Information Architecture

Task Flows & User Flows

GOAL A: FIND THE RIGHT FIT OF JEANS TO BUY USING MEASUREMENT PROFILE

TASK FLOW

USER FLOW

GOAL B: BOOKING HOME TRIAL FOR A PAIR OF JEANS

TASK FLOW

USER FLOW

Detailed Design

I began this phase by sketching preliminary designs and refining them into wireframes.
Following that, I created the visual style and designed high-fidelity user interfaces.

Wireframes

Visual Identity

User Interface

Home Page

The homepage provides an intuitive starting point for shoppers seeking the latest trends, specific brands, or attractive discounts.

The focal point of the homepage is a dynamic hero slider that prominently displays the most significant ongoing sales.

Discovering Jeans

The category page offers a user-friendly interface for discovering women's and men's jeans through meticulous categorization based on style, fit, shade, and top-tier brands. It allows shoppers to effortlessly find and explore jeans of their preference.

The product display page showcases ratings, along with options for wishlisting, sorting, and filtering.

Adding Measurement Profile

The measurement profile feature can be accessed from the user's profile section, or can be added directly from the product page. It enables users to input their measurements using a diagram guide. This helps shoppers in discovering their ideal jeans fit through infographic measurement profile cards displayed on the product page.

Finding the Right Fit

The measurement profile card presents an infographic detail showcasing the most suitable size and fit based on the saved measurements of the selected profile. Users can add more measurement profiles directly from this card.

For a more informed evaluation of size and fit choices, users can also view pictures uploaded by fellow shoppers and filter them based on size.

Booking Home Trial

Users have the option to book a home trial. This personalized service allows users to select up to three sizes of their preferred jeans, arrange for a delivery schedule, and choose a trial window. The added convenience ensures that users can try on the jeans in the comfort of their own space, assessing the fit and style without any rush or pressure. This service would have a nominal fee.

Pick-Up of Unselected Jeans

After the selected pairs of jeans are delivered, trial window will become active and users will be notified. Additionally, users will be notified two hours prior to the closure of the trial window, after which the pick-up personnel will arrive.

Upon completing the trial session, users can make payment for the selected pair and keep the unselected pairs ready for pick-up. They can also opt to make payment directly to the pickup personnel.

Payment Flow

The payment flow is a simple 3 step process designed to align with user’s mental model of the payment process. It starts when shoppers add a product to cart and then navigate to it.

Future Roadmap

Thank You

Zoya Rahman | UX Designer