Jurassic PT
A conversion-focused service website for a Cannington fitness studio — covering memberships, classes, timetable, personal training, remedial massage, and direct booking.
The only thing I regret is not hiring Caleb sooner. After struggling with a useless website that was doing nothing for our business, we bit the bullet and reached out for help, not quite knowing what to expect. Well, we couldn't have been happier with the result! We are so happy with our new website and truly thank you for making this such a stress-free experience. The timeline was clear, and we knew exactly what we were getting: ideas, design, inclusions, additions and changes. This was all accomplished with prompt communication that was friendly and professional, especially when dealing with someone who is admittedly not technologically inclined, and we didn't go live until we were 100% happy. We never felt pressured, pushed or worried the entire time. Outstanding service at a reasonable cost. We would recommend you to everyone without hesitation. Thank you so much for helping us put the vision online!
Shelley
Jurassic PT
Overview
Jurassic PT is a service website for a small group personal training studio in Cannington, WA offering coached classes, personal training, and remedial massage. The site is structured around practical customer actions — comparing memberships, checking the weekly timetable, booking sessions through PT Mate, or sending service-specific enquiries. Each service line has its own dedicated route with pricing, policies, and contextual calls-to-action that route into either direct booking flows or prefilled contact enquiries depending on availability. The implementation pairs a dark lime-accent visual system with reusable booking components, responsive layouts, and a lightweight trust layer built from real client testimonials.
Screenshots
What I Delivered
- Logo design — badge-style brand mark with dinosaur claw motif, gold trim, and dark background treatment
- Multi-route marketing site with dedicated pages for classes, timetable, memberships, personal training, remedial massage, and contact
- PT Mate booking integration for memberships, intro offers, casual classes, and selected remedial massage services
- Fallback enquiry routing for services without direct booking links
- Contact form with client-side validation, loading states, and service-specific prefills via query parameters
- Membership comparison page with tiered plans, casual option, 10-class pack, FAQ, and policy detail
- Responsive timetable with both image-based schedule and structured weekly summary
- Custom testimonial system with scrolling ticker, expandable grid cards, and modal detail view
- Responsive navigation with desktop dropdown, mobile slide-in menu, and persistent membership CTA
- Route-level page titles and meta descriptions within the SPA shell
- Vercel deployment with SPA routing, CSP headers, HSTS, and cache configuration
Key Features
- Seven-route SPA with service-specific pages, CTAs, and booking flows
- PT Mate integration with centralised booking URL management and contextual fallback to contact enquiry
- Contact form with FormSubmit delivery, validation, consent capture, and query-parameter prefills from service pages
- Membership comparison with tiered pricing cards, highlighted plan, FAQ, and transparent cancellation policy
- Dual timetable display — image schedule and structured weekly summary with responsive card layout on mobile
- Testimonial ticker with continuous scroll, reduced-motion fallback, and expanded modal view
- IntersectionObserver-driven reveal animations with prefers-reduced-motion handling
- Centralised business configuration for booking URLs, contact details, and enquiry routing logic
- Sticky frosted-glass navigation with scroll-aware state and mobile hamburger menu
- Custom 404 page and scroll-to-top behaviour on route changes
Stack & Tooling
- React 18 (Vite SPA)
- JavaScript (JSX)
- React Router DOM
- Tailwind CSS with custom design tokens
- Lucide React
- FormSubmit (contact form)
- PT Mate (booking integration)
- Vercel (hosting)
Integrations & Backend
- PT Mate — direct purchase links for memberships, intro offers, casual passes, and massage sessions
- FormSubmit — AJAX form submission for contact enquiries with success and error handling
- Google Maps — external directions link to the studio location
- Instagram and Facebook — social profile links for community engagement
Performance / SEO / Accessibility
- Lightweight production bundle via Vite with no heavy animation dependencies
- Lazy-loaded timetable image asset
- Skip-to-content link, ARIA labels, expanded states, and focus-visible styles
- Reduced-motion handling on all scroll-triggered animations
- Route-specific title and description updates for search engines
- Security headers including CSP, HSTS, and frame-ancestor restrictions
- Robots and sitemap configuration for deployment
Challenges & Constraints
- Designing a clean booking architecture around mixed booking rules — some services route to PT Mate, others intentionally fall back to direct enquiry
- Building a content-heavy service site without a CMS while keeping pricing, policies, links, and contact pathways consistent across multiple pages
- Making the timetable useful on both desktop and mobile with a graceful switch from image schedule to structured card layout
- Adding social proof and motion without making the site feel noisy — including a continuously scrolling testimonial ticker with reduced-motion handling
- Creating clear route-by-route service discovery with page-specific CTAs and prefilled enquiry flows from each service page
What I'd Improve Next
- Add a headless CMS so the client can update schedules, pricing, and testimonials independently
- Replace the image-based timetable with a fully data-driven schedule component
- Implement persistent rate limiting on form submissions
- Add privacy-respecting analytics to track page views and booking conversions