Movement studio website
KINEO
Movement studio website with programme filters, interactive class matching and four-step booking.
- Task
- Help visitors understand the programs and book a suitable session.
- What I built
- Built a page with programs, answers to common questions and a booking form that protects entered data when closing.
- Result
- Visitors can choose a program and follow the booking flow, including on a phone.
My role
Interface, responsive development, filters, interactive programme matching, and four-step booking.
- Scope
- Service landing / Booking / Frontend
- Period
- 2024
- Status
- completed
Stack
- Vue
- Vite
- Tailwind CSS
- JavaScript
The opening screen introduces the movement studio and directs visitors towards choosing a programme.
A path from the problem to the right programme
The landing page explains the approach, services, and specialists in a clear sequence.
The full page presents programmes, the studio approach, specialists and answers to questions before booking.
Booking is designed for a phone
Fields, cards, and step navigation remain large and easy to understand.
Programmes and information sections form a sequential mobile introduction to the studio.
The mobile opening screen keeps the sports photograph and a clear path to the programmes.
The full-screen menu provides access to the main sections and booking without small link targets.
States of a complex dialog
Booking retains choices between steps and warns before closing.
Booking is split into sequential steps, preserving the chosen service as the visitor moves through the form.
Closing an unfinished booking prompts for confirmation to help prevent accidental loss of entered information.
Mobile booking keeps the same steps, with large choices and accessible actions.
The phone version also confirms closing, offering a return to the form or an exit.
Technical details
The Vue interface retains selections between booking steps. It also includes programme filters, a mobile menu and confirmation before closing a filled form.
Let’s discuss your project
Tell me what you need: a website, store, service or workflow automation.