← All projects
InteractiveFull-Stack

Chalksnap

A drag-and-drop football play designer with frame-by-frame animation.

Live site →
Chalksnap screenshot

The problem

Coaches need a fast, visual way to design plays, show exactly how each player moves after the snap, and share them with the team from anywhere.

The approach

A canvas-based designer: drag players into position, start from formation presets, build multi-frame animations, watch color-coded routes animate from snap to completion, then save to the cloud and share.

Highlights

  • ▹Canvas drag-and-drop play design (Konva)
  • ▹Frame-by-frame post-snap animation
  • ▹Formation presets (I-Form, Shotgun, Spread, Pistol, Single Back)
  • ▹Color-coded route visualization by position group
  • ▹Cloud accounts and sync via Supabase; shareable links and a read-only player mode