The Challenge

HairGuru*, a services marketplace that matches clients with hairstylists via a proprietary algorithm based on a variety of lifestyle, hair, and personality data points, came to me with the task of designing their MVP so that clients could find a hairstylist and book an appointment and providers could build their clientele with quality clients.

*fake name

Client Problem

Users are unable to find a high end hairstylist that works well with their unique hair type and meshes with their personality

Provider Problem

Users are unable to find clients in their preferred demographic who are seeking hair services that align with their skills.

Solution

Design client and provider onboarding flow

Design match results page

Design client and provider booking flow

Impact

When implemented, these designs will enable clients to find a hairstylist that they’ll feel a rapport and want to book with over and over again, and enable providers to build their clientele with the type of clients they prefer. Both clients and providers will be able to book and manage appointments within the site.

First Steps

When I came on board, some market research had already been conducted, and a rough framework of the MVP had been mapped out. It was my job to design the responsive web app on a very short timeline in order to launch the product as quickly as possible.

Onboarding

The onboarding process is crucial for both clients and providers. It gathers information that can be used to match clients with providers, and in the case of providers, it also serves as an application to become part of the stylist network, ensuring that providers on the platform are highly qualified. I designed a series of UI templates that could be used for a variety of question types, including single-select, multi-select, fill-in forms, and dropdown menus.

Booking Flow

Since one of the technical constraints of the MVP was not having a full automated scheduling platform, users needed a way to book an appointment with a provider to keep users in the HairGuru ecosystem. Therefore, I designed a flow in which clients would set their appointment specifications and date/time preferences and send a request to their preferred provider. The provider would receive this request and offer a series of potential appointment times based on their schedule. The client would then pick one of those times (if applicable), and proceed to checkout.

I began by sketching out the mobile screens in this flow and tested them with users. My original sketch included a weekly calendar where users could customize their availability on different days, but due to technical constraints, this section was simplified, only allowing clients to choose a general time frame (ASAP, in 2 weeks, etc) and a general time of day that works well for them, but testing confirmed that users wanted to be able to choose specific dates and customize their available window(s) for each, due to their varying personal schedules. Additionally, the way the calendar was displayed was confusing, so I replaced it with a traditional calendar display that followed familiar visual patterns. This helped clear up confusion when choosing dates.

Booking request iterations

Testing the flow with providers also revealed that providers needed a way to more accurately quote prices and schedule enough time, since the price and duration of the appointment depend on the client’s hair thickness and natural color, among other things. Our solution was to include verbiage to communicate that the quoted duration and price were subject to change.

Additionally, providers agreed that we needed more comprehensive client photos to get an accurate sense of their hair type and condition, in order to make providers more comfortable about allowing clients to schedule an appointment without a consultation first. However, this feature, along with the functionality to schedule a video consultation was backlogged due to time and tech constraints.

If you’re interested in hearing more about this project, get in touch!