A Barrel Research Project

We make real purchases and share direct-to-consumer marketing & UX insights. Learn More

All Patterns

OUAI

Website

Luxury and Ease: OUAI’s Navigation Helps Find Your Perfect Hair-Care Routine

What We Bought

OUAI Scalp Serum

$30
Quantity:
Date Purchased:
9/1/22
Coupons Used:
What We Bought

OUAI Fine Hair Shampoo

$30
Quantity:
Date Purchased:
9/1/22
Coupons Used:
None

OUAI is a DTC hair-care company known for its salon-quality products, created for all hair types and concerns. Their products include shampoos, conditioners, hair treatments, body lotions, and perfumes. 

OUAI uses their navigation to quickly connect customers with the right product by featuring pre-filtered product listing pages (PLPs) for hair type, texture and concern. 

OUAI’s Homepage

OUAI's homepage provides a holistic view of the company by featuring collections, products, the company’s mission, blog content, and featured collaborations. The website incorporates fluid animations to transition users throughout the page, creating a seamless and relaxing scrolling experience.

Product Listing Page

Throughout the site, OUAI's product cards include a quick add and a wishlist feature so customers can add the product to their cart immediately or save it to their account for later.

Product Detail Page (Mobile)

For customers looking to discover even more about their products, OUAI's product detail page (PDP) offers a ‘Tell Me More’ pop up with information about how to use, ingredients, recycling instructions, and the details of the product. The PDP uses visual storytelling through animated color changes to connect with the specific scent of each product.

The mini cart clearly indicates when a customer has hit free shipping and reminds them about different payment options through Klarna or Catch. To encourage customers to try new products they also offer free samples, which are also promoted in the promo ticker bar on the site.

Photo Credit:

Thumbnail photo courtesy of theouai.com

Related Patterns