Project Overview

TrackMilesRun is a custom collegiate athlete recruiting profile and brand site built for a competitive track and field athlete. It serves as both a digital resume for college coaches and a personal brand platform — featuring a PR record wall, drill and workout library, video gallery of training sessions, a Stripe-powered merchandise store, an athlete blog, and a contact funnel for coaching inquiries. The design is custom and sport-specific, built to stand out in a recruiting landscape dominated by generic platforms. Demonstrates the ability to build multi-vertical, conversion-focused custom sites outside the tech/SaaS space.

Custom DesignStatic Build (Vite/HTML)Stripe Merch Store Video GalleryPR Record WallAthlete Blog Contact FunnelMobile-FirstSEO Structured Custom Logo & BrandPrintful IntegrationLinux VPS / Nginx

By the Numbers

PR

Record
Showcase

Merch

Stripe
Store

Video

Training
Gallery

Blog

Athlete
Content

Brand

Custom
Identity

Platform Features

Recruiting Profile & PR Wall

Personal record showcase: 100m, 200m, 400m, hurdles, and field events
Season-by-season performance progression display
School, coach, and eligibility information for recruiting staff
Highlight video section with embedded training footage
Drill and workout library showcasing training methodology
Contact form routed to athlete and coach email

Merchandise Store

Stripe-powered e-commerce store for branded athlete merch
Printful print-on-demand integration for inventory-free fulfillment
Product listings: apparel, accessories with multiple colorways
Custom logo marks: TMR_Black, TMR_Lava, TMR_Turq, TMR_Purple variants
Checkout flow with Stripe payment and order confirmation
Order tracking and email receipt automation

Content & Brand

Athlete blog for training updates, meet recaps, and recruiting journey
Photo gallery: action shots, team photos, training imagery
Custom brand identity with multiple logo variations and colorways
Hurdle animation video for visual engagement (hurdle_still.jpg)
Social proof sections for meet results and team affiliations
Mobile-first responsive design optimized for coach browsing

Technical Build

Built with Vite for fast static asset compilation and HMR
Custom CSS animations for sport-specific visual identity
Sitemap.xml and robots.txt for crawlability
Canonical URLs and Open Graph metadata for social sharing
SVG icon system (icons.svg) for scalable UI elements
Nginx static serving with SSL — minimal infrastructure footprint

Technology Stack

Frontend

Vite build tool · HTML5 / CSS3 · Vanilla JS · Custom CSS animations · SVG icon system · Mobile-first responsive layout

E-Commerce

Stripe payment processing · Printful print-on-demand · Product catalog management · Order confirmation + email receipts

Content & Brand

Custom multi-colorway logo system (4 variants) · Photo gallery · Video embeds · Athlete blog · Sitemap + robots.txt

Infrastructure

Linux VPS · Nginx static file serving · SSL / Let’s Encrypt · PM2 (mrms-service) · Sitemap + Open Graph SEO

Key Deliverables

Custom athlete recruiting profile site with PR record wall and season progression
Stripe e-commerce store with Printful print-on-demand merchandise fulfillment
Video training gallery and drill library for coach evaluation
Custom multi-variant brand identity system (4 logo colorways)
Athlete blog for recruiting journey content and meet recaps
Contact funnel for coaching staff inquiries with email routing
Mobile-first responsive design optimized for coach browsing on any device
Vite static build with Nginx serving, sitemap, and Open Graph metadata