The Problem
Shoppers often hesitate to purchase football kits online because sizing varies drastically across brands (Nike vs Adidas vs Puma), and they want to see how their name and favourite player numbers look before paying.
What I Built
Engineered an interactive kit customizer that previews player names and numbers in official league typography in real time, alongside an AI virtual try-on tool that previews the jersey on different athlete body shapes.
Interactive User Flow
- Step 01: Club & League Navigation
Customer browses by league (Premier League, La Liga, Serie A, Champions League) with live ticker showing recent match results. - Step 02: Kit Selection & Customizer
Customer chooses Home/Away/Third kit and uses the live preview tool to type their name and number with official badge patches. - Step 03: AI Virtual Try-On
Shopper selects height, weight, and fit preference to view a realistic 3D render of the jersey fit before checkout. - Step 04: Direct Card Payment
Paystack checkout confirms order, generates print-queue vector specifications, and triggers courier logistics dispatch.
Site Map & Architecture
Storefront & Leagues
/ (Featured releases & match ticker)/leagues/premier-league/leagues/champions-league/retro-classics (Historical kits)
Customization Engine
/customizer (Name & number generator)/try-on (AI virtual fit simulator)/size-guide (Measurement tables)
Cart & Fulfillment
/cart (Slide-over drawer)/checkout (Paystack payment gateway)/order-status (Tracking code status)
Workshop Admin
/admin/printing-queue (Vector exports for vinyl heat-press)/admin/inventory (Blank shirts stock)
Measurable Business Impact
Reduced jersey return and size-exchange requests by 78% while boosting custom-printed jersey average order value by 34%.
Visit the project ↗
Explore all case studies →