// BEAUTY COLOR
Site and ecommerce for curly, coily and wavy hair care, with a routine quiz, product grid and PDP in the brand's voice.
- UI | UX Design
- Ecommerce
Challenge
Beauty Color speaks to people hunting the right formula for their own hair. The old site stacked a catalog. What was missing was a path: learn your type, understand free-from, reach the product without getting lost.
Solution
We designed home, about, product listing and PDP, a recommendation quiz and FAQ. The violet, magenta and yellow palette carries the brand; the product fold and quiz guide the purchase.
// HOW WE DID IT
Textured hair at the center. The site keeps up.
We started from SoulPower and the Beauty Color line: bold type, graphic waves and a palette that doesn't apologize. Each screen has a job: home sells the brand, products sell the line, the quiz cuts doubt.
// ABOUT
For coily, curly and wavy hair.
Beauty Color stands for care and clean formulas. The site has to feel like the product: color, texture, trust. About holds the story; home already delivers the line.
// HOME
Home sells the brand in folds.
Hero, product carousel, quiz, influencers, free-from, blog and social. Each block has an exit: see the line, take the quiz, follow on Instagram.
// PRODUCTS
The product list is the fold that moves.
Filters, cards and CTAs on a long grid. In the case, the screen arrives and the fold scrolls up. The catalog becomes narrative, not a static grid.
- Product hero in brand tone
- Grid with image, name, price and buy
- Buy banner at the end of the list
- PDP with gallery and free-from
// PRODUCT PAGE
// QUIZ
Quiz: doubt becomes a recommendation.
Three questions, loading and result. The user leaves with a suggested kit and a clear path to the shop.
// FREE FROM
// SYSTEM
Violet, magenta and yellow.
The dark brand ground, magenta CTA and yellow support carry SoulPower. Cream holds product folds and reading.
Bold display, clean UI type.
Wide titles in the brand voice. Readable sans for price, filters and forms.
The right formula starts with understanding the hair.
// TEAM
- Matilha team · UI/UX
