A. Cerqua
#04

Personal Trainer Landing

Role Solo designer and developer Period 2026 Sector Personal training and kinesiology Live chinesiologa.alessiaalfano.workers.dev ↗

Brief

A digital presence for a personal trainer and kinesiologist in the Susa valley. Visitors arrive primarily via Instagram on mobile. The goal was to establish professional credibility around posture and recovery, avoid generic fitness clichés, and drive qualified inquiries to the contact form within sixty seconds of landing.

Constraints

  • Mobile-first traffic arriving from in-app social browsers with limited attention spans.
  • Hyper-local focus on the Susa valley, stripping an early bilingual experiment to keep the interface fast, lean, and directly targeted.
  • Zero ongoing hosting cost on Cloudflare serverless edge.
  • Strict accessibility compliance (WCAG 2.2 AA) suitable for users with mobility or visual sensitivity issues.
  • Direct lead notifications on mobile without depending on custom domain email infrastructure.

Architecture

VISITORINSTAGRAM / WEBCLOUDFLARE EDGEOPEN-NEXT WORKERSSR + ASSETSCONTENTNEXT-INTL SSRLOCAL SEOJSON-LD SUSA / TOINSTANT LEAD DISPATCHTELEGRAM BOT APIDIRECT MOBILE PUSH
Fig. 1 / Edge delivery and instant Telegram lead dispatch, in red

Interface

MOBILE / INSTAGRAM TRAFFIC · 390PX
Personal trainer landing page mobile viewport
DESKTOP / EDITORIAL HERO · 1440PX
Personal trainer landing page desktop editorial hero
Fig. 2 / Interface: mobile-first Instagram landing flow (left) and editorial desktop hero (right)

How it works

  • The site runs on Next.js App Router deployed to Cloudflare Workers via Open-Next, keeping compute at the edge and serving static assets directly from Cloudflare storage.
  • Initially built with bilingual routing, then deliberately stripped to Italian-only after aligning with the local audience. Removing the language switch freed horizontal space in the desktop dock, reduced vertical clutter in the mobile drawer, and eliminated unused translation overhead.
  • The design system uses a dark editorial direction with deep ink, warm paper surfaces, saturated purple accents and rare gold hairlines, eliminating decorative animations in favor of immediate readability.
  • Form submissions dispatch directly from the edge worker to a dedicated Telegram bot, giving the trainer immediate push alerts on mobile so inquiries can be answered in minutes.
  • All text and interactive elements satisfy WCAG AA contrast thresholds, with reduced-motion defaults for all transitions.

My part

  • End-to-end design and art direction: visual identity, typography system, responsive layouts, and copy structure.
  • Full-stack edge implementation: Open-Next configuration, Cloudflare Workers deployment, architecture simplification, and the contact handler pipeline.
  • Structured data and local search optimization for regional discoverability in Susa.

Outcome

A fast, accessible presence running entirely on edge infrastructure with zero recurring server costs. Inquiries are pushed instantly to Telegram, enabling direct follow-ups within minutes of submission without email client friction.

Stack

Next.js / ReactApp router, server-rendered components
Cloudflare Workers / Open-NextEdge deployment with serverless compute
Tailwind CSSDesign token implementation and responsive layout
next-intlType-safe Italian message catalog and server-rendered content
Telegram Bot APIInstant mobile push notifications for inbound leads