Case Study 2026

Luma Clinic Dashboard

A daily workspace for clinic front desk staff to track appointments, delays, and doctor and room availability.

Role
Product / UI/UX Designer
Scope
Product Framing, IA, UX Design,
UI System
Platform
Desktop Web App
Industry
Healthcare
Format
Product Design Challenge
Luma Clinic dashboard showing appointments, availability, statuses, and actions
01

The challenge

Appointments, doctors, and rooms affect one another throughout the day. These connections needed to be clear at a glance.

The key questions

  1. 01

    What information matters most

  2. 02

    How appointments, doctors, and rooms connect

  3. 03

    How statuses and delays work

  4. 04

    Which actions are available at each stage

  5. 05

    How to highlight situations that need attention

02

Product framing

These three levels shaped the screen structure, information order, and visual hierarchy.

01

What is happening now?

Which consultations are in progress, which patients have checked in, and which doctors and rooms are available.

02

What needs attention?

Where a delay started, who it affects, and which patients have not checked in on time.

03

What happens next?

The action available for each appointment: check in the patient, start the consultation,
or complete it.

03

System logic

Each status leads to a next action

The status shows where an appointment is in the flow and what front desk staff can do next. Each active appointment has one primary action.

Scheduled Check in
Checked in Start consultation
In consultation Complete
Completed No primary action
Cancelled No primary action

Status and delay are separate

A delay shows how far an appointment is behind schedule, what caused it, and which appointments it affects. The status still reflects the current stage.

Checked in
15 min delayed ↳ Waiting for James Miller

The status shows the current stage. The delay explains what is affecting the appointment.

04

Key operational scenario

James Miller’s consultation is running over. Ava Johnson is waiting for it to end,
while Emma Taylor has not checked in on time.

Connected delay
10:45–11:15 30 min planned
James Miller Chest discomfort
Dr. Maya Patel Room 201
In consultation
15 min over Ava Johnson
Complete
Cause

James Miller’s consultation is running longer than planned.

11:15–11:45 30 min planned
Ava Johnson Follow-up
Dr. Maya Patel Room 201
Checked in
15 min delayed James Miller
Start
Impact

Ava Johnson is checked in and waiting
for the previous consultation to end.

Action needed
11:20–11:50 30 min planned
Emma Taylor Skin consultation
Dr. Olivia Chen Room 202
Scheduled
Not checked in 10 min past time
Check in
Action needed

Confirm whether Emma has arrived
and update the appointment.

05

Workspace architecture

The daily appointment list takes up the main part of the screen. Doctor and room availability stays visible alongside it, making it easy to track the schedule, resources, and issues that need attention.

Hover to see each area in context

Luma Clinic dashboard with daily appointments and doctor and room availability Daily appointments Doctors and rooms Current status Next action Secondary actions
06

Scope boundaries

Some features need their own flows and more space. Keeping them off the main screen preserves a clear hierarchy and quick access to daily tasks.

01

Analytics and additional KPIs

These belong in a reporting section built for date ranges, comparisons, and trends.

02

Calendar, search, and filters

These help users move between dates and browse
a larger appointment list. They fit better within
the Appointments section.

03

Notification center

This would need its own rules for priority,
read states, and notification history.

04

Detailed resource schedules

Doctor shifts and room bookings belong in the Doctors and Rooms sections.

09

From components to final interface

Reusable patterns keep statuses, actions, and resource availability consistent across the dashboard.

Variables, variants, and Auto Layout keep recurring states consistent across the screen.

Final interface
Final Luma Clinic Dashboard interface
Final interface
100%
Final Luma Clinic Dashboard interface enlarged
10

A strong operational interface shortens the path from problem
to action.

The brief defined the core entities: appointments, patients, doctors, and rooms. The next step was to connect them: how a status determines the available action, how a delay affects the next appointment, and what context front desk staff need throughout the day.

These rules shaped the screen. The table keeps appointments together, the availability panel shows the current state of resources, and issues appear exactly where staff can act on them.

Primary Insight A status becomes useful when
its cause, impact,
and next action
are visible.
Core Decision One primary action for each active appointment.
Design Principle The action priority shapes the screen hierarchy.
Next Project

Idea School

Website redesign for a private school that helps parents figure out if it's the right fit for their child.

View Case Study
Idea School case study preview