AVOIDANCE
A mouse-only browser game exploring cursor-based interaction with P5.js.
- graham makes · Seattle, WA
- Title
- AVOIDANCE
- Edited
- January 7, 2026
- Tags
- case-study, p5js, games
- Live site
- avoidance.grahammak.es
- Product
- AVOIDANCE
Overview
AVOIDANCE is a minimalist browser game that started as an experiment in P5.js data visualization and evolved into a full game once I realized the potential of cursor position-based logic.
The Experiment
I’ve had exposure to Processing in the past (upon which P5.js is based), and found the API relatively straightforward. It reminds me of the CreateJS suite, which I’ve used in other games.
The goal was to explore P5.js for interactive visualization - my notebooks are full of half-baked interactive music visualizer ideas. Making this game was a great introduction to the library’s capabilities and quirks.
Design Philosophy
The game is an ode to procrastination by nature of avoiding that which pursues you, and an exercise in meta-procrastination by the fact that I spent days working on this instead of attending to my actual workload.
The mouse-only mechanic was a deliberate constraint that led to creative solutions - including some hidden easter eggs that are tricky to trigger with just cursor movement.
Tech Stack
| Technology | Purpose |
|---|---|
| P5.js | Game engine and rendering |
| JavaScript | Game logic |
| GitHub Pages | Hosting |