The Ordinary

Chatbot Design for a Global Skincare Brand

Designing for conversation: what a system says, how it recovers, how it stays on-brand. A skill that only matters more as AI becomes the interface.

Team

Myself + 1

What I did

Conversational UX Design · Research · Prototyping

Skills

Research · Training Data · Sample Scripting · Bot Personality Design · Prototyping

Tools

VoiceFlow · Figma · Miro · Google Suite

The Ordinary skincare chatbot on a pink background

The Challenge

Skincare can feel overwhelming, especially for beginners.

Buyers who don't understand what they're looking at don't buy. On The Ordinary's site, that means decoding product names, cross-referencing ingredients, and figuring out a routine before adding anything to cart. We wanted to close that gap and turn curious visitors into confident ones.

How might we

Help users confidently navigate The Ordinary's product line and build routines that feel personalized, while staying true to the brand's science-driven voice?

The Solution

The answer was a chatbot that actually knew the products. Three focused flows:

01

Skin Concern Routing

Users describe their skin and the bot routes them to the right products.

02

Routine Building

Step-by-step guidance using The Ordinary's Prep, Treat, Seal method.

03

Ingredient Education

Plain-language explanations of what each ingredient does and why it matters.

Defining the Voice

Does this sound like The Ordinary?

The Ordinary sits at the affordable end of the market with high scientific credibility. That combination has a specific voice, and the bot needed to match it on every message. I defined the personality before writing a single script: informative, knowledgeable, professional, inclusive.

Brand positioning scale

Minimal personification. Helpful, knowledgeable, the Ordinary logo as its only face.

Scoping the Flows

Research shows users often don't know what a bot can do, which leads to abandoned sessions.

The "gulf of envisioning," an HCI concept, describes the cognitive distance between a user's goal and their ability to formulate a prompt that gets them there. Three named entry points are the answer: they make the possible paths visible before users have to ask.

Scoping overview framework

Not every input lands cleanly. Users go off-script, ask questions outside scope, or combine intents the bot wasn't trained to handle. Escape hatches are the design response to that: deliberate exit routes mapped into the flow.

Full conversation flow diagram
The Language Problem

Users don't describe their skin the way dermatologists do.

The training data work surprised me. I expected it to be mechanical: write the intents, list the utterances, done. Instead, it forced a more basic question: how do people actually talk about their skin? Not how they'd phrase it on a form, but how they'd text a friend.

Training Data Table
IntentUtterancesResponse
DarkCircles_ConcernI have dark circles · Dark circles · What do I do about my dark circles? · Darkness around my eyes · Pigmentation around the eyes · Hyperpigmentation around my eyes · Can you help me with dark circles? · Under eye hyperpigmentation · How to fix dark circles around my eyes?Dark circles can be caused by lack of sleep, stress, genetics, or allergies. Try our Most-Loved Set: Niacinamide 10% + Zinc 1%, Hyaluronic Acid 2% + B5, Caffeine Solution 5% + EGCG.
Puffiness_ConcernPuffiness around eyes · Puffy eyes · I have swollen eyes because of allergies · How do I fix my under eye bags? · Need to fix eye bags · What causes puffiness? · I didn't get any sleep! How do I make my under eyes not swollen?Puffy eyes can be caused by aging, hereditary differences, allergies, fluid retention, trauma, or lack of sleep. Try our range of products that target puffiness and signs of aging around the eye.
More_Than_One_ConcernI have dark circles and puffiness under my eyes · I have multiple concerns · My concerns are hyperpigmentation, dark circles, and dull skin · I have many concerns, should I list them all?Sorry! I can only help you with one concern at a time. Please tell me what your skin concern is.
Peptides_InfoAbout peptides · Peptides · What exactly are peptides? · How do peptides help? · Do I need peptides in my skincare routine? · What are the benefits of using peptides?Peptides are short chains of amino acids which form the building blocks of structural proteins. They act as targeted molecules to help improve the look of concerns such as signs of aging and hair density.
More_Than_One_IngredientCan you tell me about peptides and ceramides? · Peptides and ceramides · I want to know about multiple ingredients · Peptides, ceramides, and niacinamideI'm sorry! I can only help you with one ingredient at a time. Let's talk about one ingredient you are curious about.
Proceed_NextSure! · Yes · Yeah, tell me more · Tell me more · I'm interested · Sure why notProceeds to next state.
Exit_OutroBye · No thank you · No thanks · I'm good · Nope · I don't want to know moreGlad to be of help! If you have any more questions or need further assistance, feel free to ask!
Skincare_Experience_Beginner1 · Beginner · I'm a beginner · I don't know much · I'm new to thisHey newbie, let's take it back to basics. The 3 simple steps to building an effective routine are Prep, Treat, and Seal. Let's build your regimen by going through each of these steps.
Moisturizer_Type_LightLight moisturizer · I like moisturizers that are light in texture · Light weight · I don't like it sticky · I hate sticky moisturizerSure! The Natural Moisturizing Factors + Beta Glucan would be perfect for you.

Sample scripting is how a conversational design gets stress-tested before it exists. Every script asked the same three questions: is the voice consistent, does the user have enough guidance to keep moving, and is there a real response for every input, even the ones you didn't anticipate.

Beginner routine intro

Personality

Scripts had to reflect the bot's voice so every message matched the brand users already knew.

Treat step explanation

Turn-taking cues

The bot needed to guide the conversation and signal what comes next, not just respond.

Handling multiple concerns

Responding to needs

If no suitable answer existed, the script needed a redirect rather than a dead end.

Why This Still Matters

What I learned building a rule-based chatbot applies directly to how AI systems are designed today.

When the system can't infer anything, you have to define everything. That discipline transfers directly to designing the guardrails, prompts, and fallbacks that make AI systems work.

Rule-Based Chatbot

AI Equivalent

Intent + utterance training data

Prompt Engineering / Intent Classification

Sample scripting with brand-matched responses

Few-Shot Prompting + System Prompt Design

Escape hatches + redirects for edge cases

Guardrails + Fallback Behaviors

Structured entry points + button options

Retrieval-Augmented Generation (RAG)

The Prototype

Three core flows, prototyped in VoiceFlow.

Skin Concern Routing

Tell it what's bothering you

Routine Builder

Prep, Treat, Seal

Ingredient Education

Understand what you're using

Shaping My Approach

The technology changed. The design problems didn't.

Rule-based logic forces every decision into the open. What I designed around here: multiple intents, vague input, no graceful fallback. All still unsolved in most AI chatbots.

What I took from this: the voice, the pacing, and the recovery paths determine whether a user trusts a conversational system. Not the model underneath. An LLM can handle more intents. It still needs someone to decide what the system should sound like, what it should stay out of, and what happens when it gets it wrong.

If I returned to this project, I'd layer in AI to expand what the bot can understand and pair guided entry points with free-text input. But the personality definition, the scoping decisions, and the fallback logic would stay.