Hair care app

Creating a solution to help haircare enthusiasts track their hair journey.


Context

After almost completely destroying my hair with excessive bleaching in a short time span, without letting it recover properly, I saw myself tracking my hair care routine on my calendar.
I wanted to have a record of what was helping my hair recover and what wasn't.
As I didn't like including haire care activities in my Google calendar (used mainly for work), I decided to design a specific app for hair care tracking and planning.

My role

UX researcher, UX designer and UI designer

Duration

3 weeks

RESEARCH

Competitor Analysis

The first step in this project was to identify similar apps and how they were addressing similar problems.
I selected and downloaded 6 hair care apps to identify what features each app offered, which I outlined in the feature matrix below. I also checked each app's reviews in the Apple App store and Google Play to understand what users particularly enjoyed about using the platform, and what users found lacking.

The primary takeaways from the competitive analysis were as follows:

Feature analysis

Interviews

The next step was to explore haircare enthusiasts’s pain points. I began by interviewing three women between the ages of 22 to 40, each of whom had used at least one haircare tracking app before. I wanted to understand:

The original concept for the app focused primarily on building a platform for haircare enthusiast's to help them track their haircare. However, during the interviews I realized that haircare enthusiasts had social needs besides haircare tracking.

The main takeaways from the haircare enthusiast's were as follows: ‍

DEFINE

Persona

Although users can have very different hair types, I realised that when it comes to haircare tracking platforms all users had similar goals and frustrations. To represent these goals and frustrations I created the persona below.

Feature analysis

After analysing the persona's frustrations and goals I formulated “How Might We?” questions:

How might we design a flexible haircare tracking platform?

How might we make the process of adding haircare products to the journal easy and fast?

How might we help users plan better their haircare routine and treatments?

How might we connect users with the same or similar hair type?

How might we help users identify if a product is working for them and for how long have they been using it?

IDEATE

Brainstorm

In order to answer the H.M.W. questions that I had formulated, I did a brainstorming session, in which I came up with different app features that would solve my users's needs.

Feature analysis

Feature Prioritisation

As in the brainstorm I came up with a lot of possible features, I decided to do a feature prioritisation, keeping in mind the previous research and the personas, before starting with the wireframes.

Feature analysis

Wireframes

I started by doing the wireframes of the account creation and profile completion.

Done that, I continued wireframing the rest of the app.

TEST

Usability Testing

After designing the wireframes, I compiled them into a low-fidelity prototype to conduct usability testing.
I asked my users to complete 5 tasks. Such as:

Imagine that you've just completed a new hair task. Where would you click to document that hair task?

In the end, I asked them to interact freely with the low-fi prototype and think aloud. I received a lot of valuable insights:

Hairly moodboard

PROTOTYPE

BRANDING

Once I had addressed usability issues in my wireframes, I started a mood board to get inspiration for the app’s branding and visual design.

Hairly moodboard

The name of the app, ‘Hairly’ is simple and easy to remember. I picked this name because I wanted to express that the app has to do with hair. Besides that, according to Urban Dictionary, the word has a very positive connotation and means: "Fantastic hair, hair that goes above and beyond extraordinary, royal hair".

I wanted the logo to be simple, similarly to the rest of the app.

Hairly logo

First iterations

Hairly logo

Second iterations

Hairly logo

Final logo

Visual Design

The new logo was the primary inspiration for the visual design of the app. Hairly moodboard

Next project
UX research tool ›