TailorApp UX/UI design

TailorApp - Mobile app for a fancy tailor

Role: UX researcher, UX/UI designer and interaction designer

Duration: April 2022 (3 weeks)

Project: The product is a specialized app for a fancy tailor and it’s made for women of 18-65 age living in metropolitan/sub-urban areas.

The Problem:

Going to tailor is a time consuming process and some users don’t have time while they manage other aspects of their lives.
Getting personalised clothes made of your choice takes a lot of interaction and communication with tailor. And some users have problem with the process.

Project Vision:

Creating a fast and easy process from choosing your outfit designs/materials to getting clothes made by the tailor at comfort of your home. And to reduce the time of overall process of tailoring clothes. And lastly to create a unique mobile app and increase sales of the “TailorApp” tailor.

Pain points:

Time Consuming

Going to tailor is a time consuming process and some users don’t have time while they manage other aspects of their lives.

Inconvenience

Most of the time users just want to alter/make changes to their existing clothes and going to tailor shop for small adjustments is inconvenient.

Platform for references

Most users also collect reference images of outfit from the internet and wants the same outfit made. But they lack a platform where they can upload images and get those outfits made.

Ease of use

There are very few mobile apps for tailors and they are confusing and not easy to use.

User Personas:

Google UX Design Certificate - Tailored Personas (1).png

Google UX Design Certificate - Tailored Personas.png

Competitors analysis:

We looked at several potential competing companies, and although none compete directly with Tailorapp, they can still infringe on the business' revenue & popularity. Tailorapp has the opportunity to capitalize on this by bringing products from each company to create a one-stop shop without oversaturating the user's selection.

The majority of the features between competitiors were very similar, however the main differences that we noticed were:

Easily Accessible vs Hardly Accessible
Too Many Screens vs Simplified Interaction
Bright / Distracting Interface vs Minimalistic Interface
Specialized customization of Products

Checkout full competitive audit report below:

Competitor audit

Ideation and Initial testing

UX - Tailorapp Lo-fi Usability Study_2023-04-10_06-39-28.png

Considering the users which are mostly less familiar with technology, I wanted the information architecture to be simple and hierarchical. And all the information and content is divided into steps, so users are always presented with as less information in each step as possible. Which makes the whole process easy and streamlined.

I wanted to keep the home screen very simple, clear and with minimal options. And as mentioned from the research before, first thing a user decides is one out of two options; make clothes or alter clothes. So that was my basis for paper wireframes.

Out of my five paper wireframe layouts, I chose this one as it is the most easy to understand layout. From that I built a digital wireframe. I created 2 main options to select from and placed images and text for better understanding the available options. The navigation bar is placed at bottom to easily switch between options and a ‘Call’ button to easily get in touch with the tailor.

UX - Tailorapp Lo-fi Usability Study_2023-04-10_07-24-08.png

I conducted two rounds of usability study to find out pain points of users from the low-fidelity prototypes. The study included 5 participants. Here are some of the findings:

Round 1 findings:

Users needed simple interface with less options
Users wanted customization options
Users wanted option to submit user-made designs

Round 2 findings:

Option to edit body measurement
Option to add/edit body profiles
Option to return and replace

High Fidelity Prototype

At first, I used bright color scheme and added top and bottom navigation including sidebar on homepage. But after usability study, I found that users wanted less complex and less confusing homepage. So I reduced the options/paths that users could take from homepage. And thus, focused on the two main options/paths. Users also found the color contrast hard to read.

After usability study of my first design, I found that the userflow of making/altering clothes was very long and complicated. And booking appointment and ordering clothes had separate user-flows which created confusion. So I reduced the number of the steps and simplified the overall process. Checkout the hi-fi prototype:

Hi-fi Prototype

Accessibility Considerations

High Contrast

Color and contrast as per WebAIM : WCAG AAA passed

High Contrast Mode is provided for better visual accessibility

Language options

As the primary users of the app are located in India, local language options are provided

Bigger touch areas

Buttons and content areas are made bigger. And all the radio options are large and with illustrations for better clarity.

Learnings and Takeaways

Throughout this project, I learned how to empathise with users and understand the core problems. And through that designing an efficient and simple system/process to eliminate those problems. I also learned to convert the feedback of the users to a better overall product.

This app removes all the tedious and frustrating parts of the process of getting clothes tailored. And allows users to focus on getting their outfits made according to their requirements.

Next Steps

Firstly I would research and add more accessibility features like screen reader, magnification, etc.

Next I would work on adding a preview feature of the outfit according to user’s choices so that they can get a better understanding before ordering.

Lastly I would add a full customisation feature with 3d preview of outfit. So users can create and order unique outfits.