WebsiteDelivered
A first visit to the studio, starting on mobile
A landing page for a Hot Mat Pilates studio in Canning, with classes, linked schedules and direct contact, based on CONTRAST3's brand identity.
- Client
- MAT Pilates
- Year
- 2026
- Role
- Web design, Development, Content organisation
- Deliverables
- Studio landing page, Class catalogue, Weekly schedule, Location and contact

The context
MAT Pilates is a studio in Canning offering mat-based classes and movement in a warm environment. For someone arriving from Instagram, the website needed to answer the questions that come before a first visit: what the studio offers, which classes are available, when they take place and how to get in touch.
The landing page has supported the business since its opening. We organised the public presentation around the studio's confirmed information and a path from initial interest to direct contact.
The scope
We developed a landing page introducing the Hot Mat method, a class catalogue, weekly schedules, a studio gallery, location details and WhatsApp links. VNT designed and developed the complete website. The studio supplied its brandbook, developed by CONTRAST3, as the identity reference.
Turning the identity into an interface
The palette, logos and Neue Montreal typography form the visual system's foundation. We defined their use across headings, body text, buttons and backgrounds, with adjustments for desktop and mobile.
Photography shows the studio and its equipment, while expandable sections let visitors explore information without displaying every detail at once. Motion supports those interactions and respects the device's reduced-motion preference.
Connecting classes and schedules
The catalogue brings together four classes, each with a description, intensity and environment. Each class includes its days and times. Visitors can move from a class to the weekly schedule and from the schedule back to the class details.
The same schedule data supplies both views. Desktop uses a weekly table; mobile uses expandable days. Changing a time does not require updating multiple independent copies of the information.


Keeping classes and schedules connected
Classes and schedules have a structured representation on the website. Descriptions and links from the timetable use consistent class names so visitors can connect each class with its times and review its details. That shared structure also supports updates when the schedule changes.
Ending the journey with a conversation
Each class's call to action opens WhatsApp with the selected class name. The gallery, address and directions link complete the journey before visitors make an enquiry.
Arranging the first class continues directly with the studio through that channel. The landing page brings the public information together; bookings and payments are coordinated through the business's own channels.
The result
The first website stage is complete and has been in use since the studio opened. It brings together the public information and lets visitors explore the offer across screen sizes. The management platform considered during discovery was not developed.
The next follow-up will look at enquiries from the landing page and which classes visitors ask about. There are no measured results yet that would allow us to attribute bookings or studio growth to the website.
Technology
Next.js, React, TypeScript, Tailwind CSS, Motion
What does your project need to solve?
Tell us how your business works and what you would like to improve. We can start with a conversation.
Let's talk