⚽ Stadium Kick-Matrix
Real-time Penalty Shootout Visualizer with Player Photos
Round 0 / 5
0 / 8 kicks
ArgentinavsFrance
2022 World Cup Final - Penalty ShootoutReal-time penalty shootout with dynamic event ticker
Argentina
0
Penalty Shootout
0 – 0
Round 0 / 5
France
0
Round 0 / 5
0 kicks
Live Events
Events will appear here...
Round 0 / 50 kicks taken
Argentina
France
✨ Features
Spatial Matrix Layout: 9-zone goal grid showing exact shot placement
Player Avatars: Initials-based avatars with gradient backgrounds
Ball Trajectory Animation: Smooth animated kicks from penalty spot to goal zone
Real-time Score Tracking: Live score updates as kicks are taken
Visual Feedback: Green checkmarks for goals, red X for saves/misses
Kick Sequence: Side-by-side team lists with player details
🔗 Integration
This visualizer is integrated into the Match Detail Dropdown component. It automatically displays when a match enters penalty shootout phase (status: "PEN" or "AET"). The component receives penalty events from the API and maps them to goal zones based on shot details.