Ruck - Unbreakable Rugby Landing Page Template

Ruck is a hero-dominant rugby landing page template built for colleges and training programmes that recruit serious athletes. It pairs a cinematic dark visual identity with scrolling before/after transformation reveals, a floating trial booking bar, and a programme guide download path. The result is a page that earns trust through visible proof, then converts it into scheduled trial weekends.

by Rocket studio

Quick summary

Ruck is a single-page template designed for rugby academies, college programmes, and pre-season conditioning schemes. It opens with a full-bleed floodlit pitch hero, builds through dramatic player transformation reveals, and closes with a structured trial booking form. Every visual and layout decision pushes one outcome: turning a curious visitor into a confirmed trial attendee.

Who this template is for

This template suits any rugby programme that recruits athletes and needs to communicate intensity, structure, and proven results. It works equally well for a college academy running scholarship trials and a gap-year conditioning scheme.

  • Sixth-form and university rugby programmes running scholarship or trial weekends
  • Gap-year conditioning schemes recruiting athletes from competitive playing backgrounds
  • Pre-season training academies that need to show player transformation to prospective students

What problem this template solves

Most sports programme pages describe what they offer without showing what it does to the athlete. Prospective recruits and their parents arrive unsure whether the programme is worth the commitment. This template solves that trust gap directly.

  • No visual proof of transformation leaves sceptical visitors unconvinced and bouncing
  • Buried booking forms mean motivated visitors lose momentum before they can commit
  • Generic layouts fail to communicate the grit and intensity that sets a serious rugby programme apart

What you get with this template

The template delivers a complete, single-page layout structured around a Hero's Journey narrative arc. Every section is purpose-built to move a visitor from curiosity to conviction before the booking form appears.

  • A cinematic hero section with a floodlit nighttime pitch, animated headline reveal, and edge-glow visual treatment
  • A series of scrollable before/after transformation reveals with a draggable slider, escalating from physical development to GPS performance data
  • A floating booking bar with a trial date picker, position dropdown covering all fifteen positions, and a secondary email-capture path for the programme guide

Feature list

This template is built around six core capabilities drawn directly from its design and functional brief.

Cinematic Hero with Animated Headline

The header fills the full viewport with a nighttime training pitch shot. Floodlight halos create a mist glow, and the headline "Become Unbreakable" types out letter by letter after a two-second delay. Magenta light bleeds along player silhouettes and the crossbar, giving the opening frame immediate dramatic weight.

Scrollable Before/After Transformation Reveals

Each scroll section pairs a "Day One" state against a "Graduation Day" result. A draggable slider sits between the two images or clips, letting the visitor control the reveal. The sequence escalates from physical weigh-ins to helmet-cam match footage to GPS heat maps and body composition scans.

Floating Trial Booking Bar

After the hero, a sticky bar pins to the screen carrying the primary call to action: "Book Your Trial Weekend" in high-visibility yellow. It stays in view throughout the scroll so the booking path is never more than one tap away.

Trial Booking Form with Position Dropdown

The embedded form captures name, current playing position via a dropdown listing all fifteen positions plus an "unsure" option, age bracket, and a preferred trial date from the next three available weekends. It appears immediately after the most dramatic transformation reveal for maximum conversion timing.

Secondary Email Capture for Programme Guide

Visitors who are not yet ready to book can choose "Download the Programme Guide." This path captures an email address and keeps the prospective athlete in the funnel without forcing a premature commitment.

Dopamine Pop Visual Identity

The colour system uses deep pitch-black (#1A1A2E) backgrounds, clean white (#F0F0F0) body text, adrenaline magenta (#E91E63) on interactive highlights, and high-visibility referee yellow (#FFD600) on all primary call-to-action elements and hover states. Every interactive component pulses in either magenta or yellow to demand attention.

Page sections overview

SectionPurpose
Full-Bleed HeroOpens with cinematic floodlit pitch and animated headline reveal
Floating Booking BarPins trial call to action in view after the hero scrolls away
Before/After Reveal 1Contrasts nervous fresher weigh-in with full-tilt tackle bag hit
Before/After Reveal 2Pairs tentative helmet-cam carry with a try-scoring step-inside run
Before/After Reveal 3Dissolves classroom theory sessions into GPS match performance heat maps
Before/After Reveal 4Morphs nutritional intake logs into body composition scan results
Trial Booking FormCaptures name, position, age bracket, and preferred trial date
Programme Guide CaptureSecondary email path for visitors not yet ready to book a trial

Design & branding system

The visual identity follows an Adventure Terrain theme expressed through a Dopamine Pop colour palette. Dark, gritty backgrounds hold the tension while electric accent colours cut through like stadium signage on a wet night.

  • Colour palette: near-black loam (#1A1A2E) base, electric white (#F0F0F0) text, adrenaline magenta (#E91E63) accents, and high-vis yellow (#FFD600) for all primary buttons and hover states
  • Typography: condensed, uppercase display face for headlines, delivering the compressed intensity of a pre-match team talk
  • Interactive elements including buttons, sliders, and progress indicators all pulse in magenta or yellow, reinforcing the high-energy visual language throughout every scroll step

Mobile & speed optimization

The hero-dominant layout is structured to load the most impactful visual content first, keeping the cinematic opening frame intact on smaller screens.

  • The full-bleed hero and animated headline are designed to retain their dramatic impact at mobile viewport widths
  • The draggable before/after sliders are touch-friendly, allowing finger-swipe control on phones and tablets
  • The floating booking bar is scaled for thumb-reach on mobile, keeping the primary call to action accessible throughout the entire page scroll

How this template helps you convert

The page is engineered to build emotional conviction before it asks for anything. The booking form only appears after the visitor has absorbed four escalating transformation reveals.

  1. The cinematic hero creates immediate atmosphere and curiosity, stopping the scroll before a single word of copy is read.
  2. Each before/after reveal adds a layer of proof, moving the visitor from interest to belief by making the programme's outcomes tangible and personal.
  3. The floating booking bar and post-reveal form placement mean the call to action lands exactly when conviction peaks, reducing the distance between "that could be me" and a confirmed trial slot.

Other information about this template

This template sits within the Sports and Recreation category, specifically matched to the Rugby Leagues subcategory and the Rugby Amateur and Club niche. It is built as a Hero-Dominant layout with a 90/10 content-to-navigation ratio, meaning nearly all of the page real estate is devoted to proof and conversion rather than menu structure.

  • The template follows a Hero's Journey creative direction, matching the narrative arc of a raw recruit becoming a finished player
  • The header concept is classified as Dark with a Single Accent, reflecting the nighttime pitch aesthetic with magenta and yellow cuts of light
  • The landing page direction is Direct Sales, meaning the entire page flow is structured to produce a booking action rather than passive brand awareness
  • The Festival Energy theme tag reflects the heightened, charged atmosphere of a floodlit training ground rather than a conventional sports brochure aesthetic
Ruck - Unbreakable Rugby Landing Page Template
Ruck - Unbreakable Rugby Landing Page Template
Ruck - Unbreakable Rugby Landing Page Template
Ruck - Unbreakable Rugby Landing Page Template

Theme

Festival Energy

Creative direction

Hero's Journey

Color system

Dopamine Pop

Style

Hero-Dominant (90/10)

Direction

Direct Sales

Page Sections

Cinematic Full-bleed Hero Section

Draggable Before/after Transformation Reveals

Floating Trial Booking Bar

Structured Trial Booking Form

Secondary Programme Guide Capture

Dopamine Pop Colour and Interaction System

Related questions

Who is this landing page template built for?

Can I customise the trial dates and position dropdown?

What makes the before/after reveal section effective?

Does the template include two separate conversion paths?

Is this template suitable for a gap-year rugby programme?