Nothus Training Lab

Context and Idea

Nothus Training Lab is a personal training studio founded by Alfonso Massaro. The goal was to build a digital presence that reflected the seriousness of the methodology, and to give clients an autonomous way to book sessions — without going through messages or phone calls.

Challenges

• Communicate the founder's identity and training philosophy through design
• Build a self-hosted booking system that works without external platforms
• Create a consistent dark brand identity across both editorial and functional pages

The Solution

The site has two clear roles: tell the story of the studio and let people book a session. About Us introduces Alfonso and the training philosophy through animated typography, an interactive founder card, and an embedded map. Booking is a guided 4-step flow (service, date, time, confirmation) that replaces the back-and-forth on WhatsApp with a self-service experience.

About Us Page

The About Us page is where the brand introduces itself. It opens with an animated logo and unfolds into three moments: the meaning behind the name Nothus Lab, an interactive card presenting the founder, and a closing section with the studio location. Each scroll reveals one piece of the identity, building the trust a visitor needs before deciding to book.

Founder Card

An interactive card introduces the founder with a subtle hover animation — the photo reveals on interaction, turning a static element into a small moment of curiosity that makes the page feel alive.

Booking System

The booking system replaces the usual WhatsApp back-and-forth with a clear 4-step flow: service, date, time, confirmation. The progress bar at the top always shows where the user is. The calendar surfaces only available dates, and each time slot displays the remaining spots — so the choice is made in seconds, in autonomy.

Development and Technologies

Built with Nuxt 3 and Vue 3, styled with Tailwind CSS on a dark design system with red as the only accent color. The booking system is fully integrated into the site — no third-party platforms. The calendar shows real-time availability, and each time slot displays the remaining spots. Login is handled mid-flow without losing progress: if the user isn't authenticated, the booking state is preserved through the redirect and restored after sign-in.

Results

• Fully self-service booking — clients book without calling or messaging
• Auth-aware flow with state persistence across login redirect
• Brand identity coherent from homepage to confirmation screen

Conclusion

A project where design and development work toward the same goal: turning a personal brand into a tool that lets clients act on their own — from discovery to confirmed booking.