Work/clairis-beuty-mobile-apps-ui-ux
02 / 02

[02] · UI/UX mockup · 2025

Clairis Beuty Mobile Apps UI/UX

Clairis is an innovative, mobile-first application designed to bridge the gap between advanced dermatological technology and personalized daily skincare. By leveraging AI facial scanning, the app provides users with instant, data-driven insights into their skin health and curates personalized product recommendations, all wrapped in a sleek, accessible user interface.

Clairis Beuty Mobile Apps UI/UX

Client

Clairis Beuty Mobile Apps UI/UX

Role

Lead UI UX Designer

Duration

6 weeks

Year

2025

Category

UI/UX mockup

[A] — Challenge

The problem.

Navigating the modern skincare market is often overwhelming for consumers. The primary challenges include: Lack of Personal Insight: Users struggle to accurately assess their own specific skin conditions (such as moisture levels, pore size, or sensitivity) without regular, costly visits to a dermatologist. The "Trial and Error" Fatigue: Without precise knowledge of their skin's needs, consumers frequently purchase generic or unsuitable products, leading to wasted money, frustration, and sometimes worsened skin conditions. Disconnect Between Diagnosis and Treatment: Even when users know their skin type, finding the exact right products among thousands of options is difficult and time-consuming.

[B] — Solution

What we shipped.

Clairis resolves these pain points by serving as a personalized, AI-driven pocket dermatologist. The design focuses on building user trust through clear data visualization and a seamless journey from diagnosis to treatment. Key Features & Design Solutions: Intuitive AI Face Scanning: The app utilizes a real-time facial mesh scan (highlighted by the interactive "Please, Hold your phone" UI) to map the user's face, making advanced technology feel approachable and easy to use. Comprehensive Skin Health Dashboard: Complex data is translated into easy-to-read, scannable metrics. The dashboard provides specific percentage scores for targeted concerns like Fine Lines, Pore Size, Sensitive Skin, and Skin Moisture, utilizing a clean dark-mode UI to make the vibrant data points pop. Seamless E-Commerce Integration: Directly below the analysis, the app provides targeted "Medicine Treatments." This eliminates the guesswork by instantly connecting the user's unique scan results with tailored, shoppable product recommendations (complete with integrated discount tags). Location-Aware Personalization: The interface includes location tracking to potentially factor in environmental elements (like local weather or humidity) into the user's skincare routine, creating a truly holistic approach to skin health.

[E] — Stack

Tools of the trade.

Figma

[F] — Services

What we delivered.

  • /01UI UX researxh Moodboards

[ Let's build ]

Have a brief like this?

We respond within one business day. Tell us about your product, your audience, and the outcome you need.

UI/UX Revamp Selangkah Medical Apps

← Previous case

UI/UX Revamp Selangkah Medical Apps

UI/UX Design Revamp · 2024

↑ All work