A five-screen mobile appointment-booking experience for a premium wellness studio, designed and prototyped in Figma. It covers the full journey from browsing services to booking confirmation, with reusable components and a booking state that stays consistent from start to finish.

Independent portfolio concept.

Link: Try the prototype

Tap the featured service to start. Best viewed on a phone or at phone size.

Caption: Two complete bookings, one at 10:00 AM and one at 11:30 AM. The selected time carries through Review and Confirmation, and a new booking starts from the default.

Booking a massage should feel as calm as the massage. Booking tools often put dense listings, crowded calendars and generic styling between the person and the appointment.

STUDIO explores the opposite: one decision per screen, a restrained editorial look, and a booking state that stays correct from the first tap to the confirmation.

Explore, Service Details, Select Appointment, Review Booking, Booking Confirmation, and back to Explore. Back works at every step and keeps the selection. Starting a new booking resets it.

Explore. A featured service and what is coming next. Unavailable services look inactive, so nothing appears tappable that isn't.

Service Details. One photo, a short description, duration, price, three benefits, and a single primary action.

Select Appointment. A fixed date and three time slots with clear available, selected and unavailable states.

Booking Confirmation. The selected time repeated back, with a plain note that it is a prototype and no real appointment is created.

The system is deliberately small: nine components built on color, spacing and radius variables and six text styles (Fraunces and DM Sans). Every screen is assembled from instances.

The time slot is the one piece of real logic. Figma resets a component's state when you navigate away and back, so the selection can't live in the component. Two prototype variables, selectedTime and isLaterSlot, are set together on every tap. The slot highlight and the time on Review and Confirmation both read from them. That is why Back keeps the choice and why starting a new booking resets it to 10:00 AM.

One service is bookable and the date is fixed. There is no backend, account system or payment. The aim was a complete, correct booking journey rather than a long feature list.