The Curl Code

The Challenge

Beauty consumers are increasingly self-aware about the products they use. However, learning about your natural hair and nurturing is no easy adventure, especially for folks with curly hair. So, where does one begin?

The Curl Code is a Rotterdam-based hair care shop looking to launch their online store. They specialise in selling hair products that are clean, cruelty-free, and curl-friendly. Their brand stands to embrace natural beauty and promote self-love as customers embark on their hair journey.

Team

Nabila Hisbaron: UX designer; researcher

Sepiedeh Orafa: The Curl Code founder

Kara Thorndike: Mentor

Responsibilities

Duration

3 weeks; January - February 2021

The Solution

More than just another online store, The Curl Code is a guided webshop that shares hair tips and guidance. It’s designed to empower customers to use the best products and methods to celebrate one’s own natural beauty.

Listening in

After a kick-off meeting with the client, I embarked on a one-week research phase with the goals to 1) explore trends in the Benelux hair care market and 2) empathise with our customers.

Conducting market research illuminated market trends as well as getting to know our regional competitors which included hair care web shops, salons and beauty webs shops. This resulted in a competitive analysis. Findings showed that:

The rise of the natural hair movement across social media resulted in a growth of 'novice naturals' who depend on hair tutorials and recommendations
Staying indoors has given way for people to bring intensive hair care routines in-house, focusing on multi-tasking scalp care
Benelux hair care web shops are mainly focused on selling hair products, occasionally complimented with a blog.

User interviews

Six Dutch/Dutch-speaking participants shared their experiences going through their natural hair journeys as well as their online shopping preferences for grooming/hair care products.

Surprising insights included:

Goals: They buy hair products in order to feel and look attractive, as well as to maintain healthy hair. They purchase online to find the best deals.
Pain points: they’re feeling confused, overwhelmed, or demotivated when researching about about hair care and hair health.
Needs: they want guidance in the form of product recommendations, learning about their hair types, tutorials, and social proof of other people’s hair journeys.

Card sorting for information architecture

Ten Dutch-speaking customers completed a card sorting activity to reveal their mental models when dealing with hair care information. They organised the information available on The Curl Code that is intuitive for them, revealing three main categories:

What they can buy
What they can learn
About the store

What a curl wants

Meet Noura

Resulting from the user research, a persona humanised the design process and focus in on a targeted solution. Meet Noura - a 23 year-old Dutch woman who wants to improve her hair health and needs guidance on where to start!

To address Noura’s needs, we ask ourselves…

How might we assist Noura to find suitable hair products in order to help her feel less overwhelmed about starting her hair journey?

Noura’s user journey map

As a guided web shop, The Curl Code can offer positive feelings of reassurance, empowerment, and optimism throughout the customer journey.

A curly storyboard

Using a storyboard, informed by Noura’s persona and user journey map, we are able to visualise a task flow of how Noura could approach and interact with The Curl Code website. It also allows us to start ideating solutions to her problems.

Building a sitemap

The three main categories found from the card sorting activity is reflected in the sitemap. There is the hair guide, the shop, and the shop information.

However, we sought to better connect the guide and the shop. How can we make sure that there is guidance when browsing products? And how can we offer products when offering hair tips and knowledge? This is further explored in the ideation phase.

Guiding your hair journey

To address Noura’s needs of finding suitable hair products and feeling less overwhelmed, there needs to be a balance of content between webshop and hair guide. This consideration helped to guide when designing the wireframes.

Homepage

The Curl Code is a content-driven business and wants to offer their customers a free service to strengthen their brand. Thus, the hair quiz appears as the hero banner on the homepage.

The bestsellers follows after this, showing popular products based on most purchases. This acts as a form of social proofing, showing customers what is currently popular in the natural hair community.
The homepage offers samples of available hair guides that customers can explore, based on hair goals. Clicking on these circle tiles takes them to their respective webpages.

Product page

Each product includes ‘hair tags’ to show for which hair type or goals that this product is recommended for. This gives guidance and reassurance to customers when they’re exploring products for their personal hair type/goal. It also allows customers to access hair information through products - and vice versa.

The dropdown menu reveals more product information. Customers value knowing the ingredients of the product and knowing how to use it.
Lastly, the product recommendations at the bottom enables customers to explore more products that may align with their hair type/goals.

Designing the flow

In this phase, the wireframes were elevated by implemented visual design elements.The colors used throughout the website is derived from the colors of the logo, which the client requested I keep to.

The monochromatic look and feel aims to be sleek and give it a clean look. The illustrations help to show the kinds of hair styles and give the website a fun and friendly vibe.

Combing through the prototype

Two rounds of usability tests helped to validate the design solutions. The first round to test the solutions on the prototype, and the second to validate the revisions made to the prototype.

For each usability test, participants were given two tasks to test the navigation and content structure of the website:

Take the hair quiz in order to buy all the products recommended for your hair type. Complete the checkout journey.
Use the filters in order to buy a new shampoo that is budget-friendly and has no coconut oil. Place item into bag.

A total of six participants tested the prototype, three participants for each round of usability testing. They are web savvy, frequent online shoppers, and deem hair as an important part of their beauty/ grooming routine. They also understood Dutch/ Dutch-speaking.

Round 1: testing solutions

High-impact opportunities:

Customers wanted to keep their hair quiz results without creating an account
Filtering out ingredients was not straight-forward (customers had to uncheck ingredients they did not want)

Round 2: validating revisions

The second usability test included the new revisions:

Notify customers that their hair quiz results can be found in “Mijn Curl Code” page, using a pop up that appears after completing the quiz
Customers instead uncheck the ingredients they do not want.

What’s next

Customers look to reviews and ratings for reassurance in the product and store. How might we offer social proof to hair care customers given that they value reassurance?

Find a balance of photos and illustrations. Customers view illustrations as professional and delightful. However, photos are helpful as a reference point for hair styles. Create a photography style guide and ensure consistent illustration style throughout The Curl Code.

Reflections

As a content-driven business, it became clear to me how important it was to collaborate with the experts in hair care. After presenting the research findings, Sepiedeh and I worked closely during the ideation phase to build a content-strategy. This collaboration ensured that 1) her content is grounded in the user research and that 2) the navigation is empathic of users’ hair journeys.

Working with a real client was an incredible experience. I sharpened my project management skills which included planning and conducting research, determining resource/technical scopes, facilitating brainstorms, and presenting design solutions.
Most valuably, I learned how to work with the client through the design process. We identified areas that would require collaboration (e.g. content strategy, branding) and other areas where I would take control as designer (e.g. research, prototyping). This ultimately made great use of our time and optimized our individual expertise.