Personal Coach Ratak

Landing Page

My role

Frontend Developer
Web Designer

STACK

HTML
CSS
JavaScript
Responsive Design

TIMELINE

2 weeks

Description

A conversion-focused website for an online fitness coach

OVERVIEW

Designed and built a modern landing page for a personal trainer expanding his business online. Created a simple booking flow with multiple contact options to maximize client conversions.

Challenge

A local personal trainer wanted to expand from in-person training to online coaching but didn't have a professional web presence. He needed a simple, mobile-friendly landing page that would:

  • Showcase his training services clearly
  • Make it easy for potential clients to contact him
  • Reflect his personal brand and style
  • Work well on mobile (where most of his audience browses)

The challenge was creating something professional but personal, that converts visitors into actual clients through WhatsApp, Instagram, or contact form.

Process

1. Discovery & Planning

I talked with coach to understand his target audience, main services, and preferred communication channels. He wanted to focus on three core offers: fat burning, muscle building, and personalized training/nutrition plans.

2. Design & Prototyping

I created a clean, modern design with his brand colors (matching his workout gear for a personal touch). Focused on clear service cards with call-to-action buttons, and added multiple contact methods so visitors could reach him however they prefer.

3. Development & Refinement

Built the site with responsive design as a priority, added smooth animations for better engagement, and created a mobile navigation with quick-access contact buttons (WhatsApp and Instagram). After showing him the first version, I refined the button colors and removed images from service cards to keep focus on the actual offers.

Solution

Clear Service Offerings

Three main packages (fat burning, muscle building, one-time training/nutrition plans) with individual "Call" buttons for instant contact.

Multiple Contact Options

Contact section includes WhatsApp, Instagram, and a traditional form—giving visitors flexibility in how they reach out. Mobile navigation also includes quick WhatsApp and Instagram buttons for easy access.

Mobile-First Design

Since most of his audience browses on phones, the mobile experience was prioritized with quick-access contact buttons and smooth animations.

Personalized Branding

Used color scheme matching his workout style to make the site feel authentic and personal, not generic template-based.