Epidemic Model
Move the sliders and watch the curve flatten, or not.
IntermediateWeb appEducation12–24hAI-buildable 4/5no setup
An SIR compartment model with adjustable transmission and recovery rates, plotted live, alongside an agent-based view showing individuals moving and infecting each other. Seeing the aggregate curve and the individual behaviour side by side is what makes it land.
UI
Logic
Useful
Hosting · Free forever
Deploys free on GitHub Pages, Cloudflare Pages or Vercel Hobby.
Deploy it and share a link.
Core features · 7
- Adjustable transmission rate, recovery rate and population size
- The compartment curves plot and update live
- An agent view shows individuals moving and changing state
- Peak infection and total affected are reported
- Interventions can be applied partway through the run
- The simulation can be paused, stepped and reset
- Both views are driven by the same underlying parameters
The interesting part
- Numerically integrating the model stably at large step sizes
- Keeping the agent view and the aggregate curve consistent
- Presenting a serious subject without sensationalising the visuals
Once it works
- Add spatial structure with separate connected populations
- Add an exposed compartment for an incubation period
- Add parameter sweeps showing outcome sensitivity
Suggested stack
reacttypescripttailwindrechartscanvas-api