Tween (10-13) Products & Booking Website Template

Quick summary

Rally is a single-page booking template designed for youth multi-sport programs. It targets parents searching at night for active, confidence-building activities for their 10-to-13-year-olds. The layout walks visitors through four clear steps, from sport selection to scheduling, before asking for any information. The visual tone is energetic yet trustworthy.

Who this template is for

This template is built for organizers and coaches running structured youth sports programs. It works especially well when the program serves tweens across multiple sports and needs to convert cautious parents into enrolled families.

• Youth sports program directors launching a new seasonal enrollment
• Independent coaches offering multi-sport sessions for tweens aged 10 to 13
• Community recreation centers promoting structured athletic programming for kids

What problem this template solves

Parents searching for tween activities face a real trust gap. They need to understand the program, see the coaches, and know the schedule before they feel comfortable handing over their child's time. Most program pages ask for commitment too early.

• Parents get confused by unclear scheduling and opaque pricing structures
• Generic sign-up forms feel premature before trust has been established
• Programs struggle to appeal to both cautious parents and image-conscious tweens at once

What you get with this template

Rally delivers a complete single-page enrollment flow. Every section is built to reduce hesitation and move parents from curious visitor to confirmed booking.

• An interactive hero section with animated sport icons and a bold headline
• A four-step how-it-works card flow covering sport selection, scheduling, coaches, and pricing
• A mid-page free trial card, three pricing tier cards, and a sticky mobile booking bar

Feature list

The Rally template combines visual energy with a practical booking structure. Each feature below is directly built into the page layout and interaction design.

Interactive Sport Icon Hero

The header displays a grid of illustrated sport icons covering basketball, soccer, track, volleyball, and flag football. Each icon bounces and wobbles on hover or tap. Tapping reveals a short looping animation of tweens in action, like a layup or relay handoff. The headline "Find Their Thing" anchors the section above the subline "6 sports. 12 weeks. Zero bench-warming."

Step-by-Step Card Flow

A four-step scroll sequence walks parents through the full program. Step 1 shows illustrated sport cards that flip to reveal session details. Step 2 displays a color-coded visual calendar grid. Step 3 introduces coaches with photo cards, fun facts, and certification badges. Step 4 presents the three pricing tiers in modular cards. Each step number sits inside a geometric shape that grows as you scroll.

Booking Modal with Visual Schedule

The primary call to action, "Reserve Their Spot," opens a focused three-field flow. Parents enter the child's first name and age, select sports using icon-driven checkboxes, and choose a preferred day and time from a visual weekly grid. This keeps the commitment feel low while capturing exactly what the program needs.

Free Trial Path for Hesitant Parents

A highlighted mid-page card offers a "Try a Free Session" option. It asks only for a name and phone number. This secondary path appears after the schedule and coach section, so trust is already established before the ask is made.

Modular Pricing Tier Cards

Three distinct pricing cards cover single sport, multi-sport, and unlimited enrollment. Each card uses a mint check-mark list to display what is included. A "Reserve Their Spot" button appears on every card, keeping the conversion path consistent and clear.

Scroll-Triggered Geometric Animations

Translucent geometric shapes, including triangles, hexagons, and quarter-circles, float behind cards and section breaks. They rotate subtly as the visitor scrolls, built with CSS animations and GSAP for scroll-linked motion. This adds visual momentum without overwhelming the content.

Page sections overview

Design & branding system

The visual identity follows a Playful Geometric theme using the Lavender Dream color system. The palette is gentle enough to earn parent trust and energetic enough that a twelve-year-old does not roll their eyes.

• Colors: soft violet (#9B8EC4) as the primary tone, bright mint (#5EEDC1) for buttons and badges, cloud lilac (#D5CCE6) for supporting surfaces, and chalk-white (#FAF8FF) for backgrounds
• Typography: Plus Jakarta Sans for headlines in a chunky rounded style, paired with DM Sans for body text
• Shapes: translucent triangles, hexagons, and quarter-circles used as floating background elements throughout the layout

Mobile & speed optimization

Rally is designed mobile-first. Parents are most likely browsing on their phones late at night, so the layout prioritizes thumb-friendly tap targets, a sticky booking bar, and a clean vertical scroll rhythm.

• The sticky bottom bar keeps "Reserve Their Spot" always visible on mobile without interrupting the scroll experience
• CSS animations handle most motion effects, with GSAP used selectively for scroll-linked shape rotations
• Card grids reflow naturally into single-column layouts on smaller screens

How this template helps you convert

Rally earns the booking click by sequencing trust before commitment. The page shows everything parents need to know before presenting a single form field.

1. The full schedule and coach credentials appear before any enrollment form, removing the anxiety of committing to an unknown program
2. The "Reserve Their Spot" button appears on every pricing card and as a persistent sticky bar on mobile, making it easy to act the moment a parent decides
3. The free trial card gives hesitant parents a nearly zero-friction path into the program, reducing drop-off from visitors who are not yet ready to fully commit

Other information about this template

Rally is part of the Kids and Family template category, sitting within the Tween (10-13) Products and Services subcategory. It is specifically designed for the tween sports program niche and is matched for B2C local enrollment use cases.

• The template is localized for English-language audiences using United States dollar pricing and US date formats
• Animation intensity is high by design, using bounce and wobble effects on sport icons alongside scroll-triggered card flips and step-number growth sequences
• The layout follows a Card Grid (Modular) structure, making it straightforward to swap sport types, adjust pricing tiers, or update coach cards for a new season

Show more