World Cup 2026 just kicked off, so I built a real-time tactical simulator for England vs Croatia. Pick your starting eleven, swap formations, and watch the win probability update live based on every decision you make.
How it works
The win probability engine weighs each player's individual stats against the demands of their slot, a striker judged on shooting & speed, a midfielder on passing & vision, a goalkeeper on defense & technique. Place a player out of position and they take a heavy penalty (a GK in attack plays at 15% of their value). A weak-link factor penalizes the whole team when one slot is badly mismanaged.
On top of that: formation bonuses, a form multiplier, and a sigmoid curve to keep probabilities realistic rather than brutal.
Built with Framer Agents + Claude (Sonnet 4.6)
The CMS (Teams, Players, Matches / 3 collections, 46 players) was populated in one prompt from a JSON dataset generated by Claude. The pitch, drag & drop logic, and probability algorithm were built as a React code component entirely within Framer. Zero external APIs.
Features
Drag & drop players between pitch slots and bench
5 formations per team, independently switchable
Out-of-position warning (orange tokens)
Upcoming matches & past results sections
Live badge on the current match
World Cup 2026 just kicked off, so I built a real-time tactical simulator for England vs Croatia. Pick your starting eleven, swap formations, and watch the win probability update live based on every decision you make.
How it works
The win probability engine weighs each player's individual stats against the demands of their slot, a striker judged on shooting & speed, a midfielder on passing & vision, a goalkeeper on defense & technique. Place a player out of position and they take a heavy penalty (a GK in attack plays at 15% of their value). A weak-link factor penalizes the whole team when one slot is badly mismanaged.
On top of that: formation bonuses, a form multiplier, and a sigmoid curve to keep probabilities realistic rather than brutal.
Built with Framer Agents + Claude (Sonnet 4.6)
The CMS (Teams, Players, Matches / 3 collections, 46 players) was populated in one prompt from a JSON dataset generated by Claude. The pitch, drag & drop logic, and probability algorithm were built as a React code component entirely within Framer. Zero external APIs.
Features
Drag & drop players between pitch slots and bench
5 formations per team, independently switchable
Out-of-position warning (orange tokens)
Upcoming matches & past results sections
Live badge on the current match