Client
Toothlens
Category
Dental Scanner app
Start Date
Jan 2024
End Date
May 2024
Tools
Adobe XD, Figma, Optimizely
Final Prototype
Work

Toothlens,

Overview

Toothlens is a mobile dental health app that empowers users to assess their oral hygiene using their smartphone camera. Powered by advanced computer vision, the app delivers insights on cavity risk, tartar buildup, gum health, and more, eliminating the guesswork and fear around dental visits. This case study illustrates how we transformed a complex and traditionally clinical dental process into an approachable, user-friendly mobile experience. Our goal was to increase user awareness and encourage proactive oral care through intuitive design and smart technology.

Role and Team

As the UX Designer, I led the design from discovery to delivery, contributing to:

  • User research & persona development
  • Heuristic evaluation
  • Low-fidelity wireframes and interaction flows
  • Usability testing
  • Final UI design and developer handoff

I collaborated with different parts of team:

  • 4 Designers – to brainstorm, wireframe, and polish the interface
  • 1 Product Manager – to align business objectives with user needs
  • Backend Engineers – to ensure design feasibility and guide technical implementation
  • Stakeholders- Dental Physicians

Key Challenges

Designing Toothlens presented several UX and usability hurdles, especially in a domain as sensitive and unfamiliar as at-home dental scanning.

  • Unfamiliar Domain for Users: Users had never experienced scanning their own teeth, making clear guidance and visual feedback.
  • Usability in Complex Flows: Steps like scanning, or booking an appointment had to be effortless, or users would drop off.
  • Low Awareness of Preventive Care: Our research showed that many users didn’t regularly think about their dental health until a problem occurred.
  • The UI needed to deliver insights without overwhelming or alarming them.

UX Process & Discovery Phase

We followed a design thinking process to define the core problem, uncover user needs, and rapidly prototype solutions.

Stakeholder Alignment

The project began with a kickoff meeting with stakeholders, including engineers and product leads, to understand the vision, tech capabilities, and business goals.

User Research & Persona Creation

We interviewed target users and developed personas to capture behavioral patterns. One key persona, Sarah Nesbitt, reflected users with a history of dental issues who wanted real-time feedback between dental visits.

"A tooth scanner would give me some relief between visits."
"I barely have time to floss, so I need something quick to check if my dental health is okay."

Sarah Nesbitt

30 yrs old | San Diego, California | Digital Media Manager

Bio

Sarah had a long history of dental issues due to inconsistent preventative care when she was younger. Sarah struggles to closely monitor at home how her past dental problems may be worsening.

Goal

  • Closely monitor dental health changes
  • Diligent oral care habits
  • Will scan after dental procedures

Pain Points

  • Prior dental problems worsening
  • Wants to track changes requiring intervention
  • Alerts on worsening diagnosis prompts diligence

Heuristic Evaluation

I conducted a heuristic evaluation against Nielsen’s 10 usability principles. Major usability issues included:

  • Lack of Feedback: No confirmation when scans were completed or failed.
  • Poor Mapping: Users didn’t know where or how to start scanning.
  • Poor Mapping: Users were provided with overwhelmed options.
  • No Error Guidance: No help if the camera was misaligned or poorly lit.

Wireframes & Interaction Design

We created low-fidelity prototypes focused on three core tasks:

1. Onboarding

Introduced the app’s purpose and features across three simple, visual screens. Users then created profiles to customize results.

2. Dental Scanner

The heart of the app. The homepage included a progress bar and risk-level indicator. We focused on step-by-step instructions to guide users through scanning all tooth regions. The interface displayed results clearly, with red/yellow/green indicators and friendly explanations.

3. Appointment Booking

Users could instantly schedule a follow-up with a dentist if issues were detected. A streamlined booking flow was added with access to calendar, payment, and doctor profiles via a sticky nav bar.

Final designs

The onboarding flow eased users into the experience with friendly, non-technical language. We broke down the value of scanning into digestible bits, reducing apprehension. The scan interface showed a real-time progress bar and step prompts. We added a feedback system with indicators for proper alignment and color-coded results.

Heuristics-Based Improvements

Redesigned flows now:

  • Show scan status in real time
  • Include error-handling guidance
  • Let users retake a scan without restarting
  • Use clear iconography and positive reinforcement throughout.
Intuitive Scanning Experience

The scan interface showed real-step prompts (e.g., "Now scan your lower molars"). We added a feedback system with indicators for proper alignment and color-coded results.

Visual Design system

We followed a design system to maintain consistency across our platforms. The app design emphasized comfort, clarity, and credibility. Soothing blues and mint greens evoked clinical trust and freshness. Clear call-to-actions helped reduce decision fatigue. These decisions ensured that a tech-heavy, health-centric app felt human and intuitive.

Other features: High Fidelity Prototypes

We embedded a smart scheduling flow, where users could book a dentist visit if their report flagged high-risk zones. Filters included insurance, distance, and availability. We also revamped our onboarding flow to ease users into the experience with friendly, non-technical language.

Outcomes and Impact

Even before live deployment, design validation showed strong user traction:

  • 45% increase in engagement after the scanner prototype launched – users scanned more often and explored reports.
  • 10% improvement in usability following heuristic revisions and user testing.
  • Booking flow conversions rose due to intuitive access to dentists and faster decision-making.

These early metrics highlighted the value of clear flows, trust-centered UX, and responsive iteration.

Reflections and learnings

Working on Toothlens offered deep insights into designing for healthcare and unfamiliar tasks. Key takeaways include:

  • Guide users step by step when the action is new (like tooth scanning). Visual cues and confirmations are essential.
  • Heuristic evaluations are powerful: They helped us catch usability issues early and focus on what matters.
  • Users responded better when alerts were softened with encouraging tones.
  • Design must adapt to unknowns: My initial assumptions about user knowledge were off—I learned to ask better questions and test early.