What is basketball-404?

Basketball 404 turns a website's error page into a tiny basketball game instead of a plain apology message. When a visitor lands on a page that does not exist, small balls fall onto the screen using hand built physics, and each ball is labeled with a link to a real page on the site. The visitor can drag or flick a ball through a hoop, and only after that deliberate throw does the site actually navigate to the linked page. The project explicitly builds its own two dimensional physics for gravity, collisions, bouncing, and detecting when a ball crosses the rim, without relying on any external physics library. Accessibility was a stated goal alongside the playful interaction. Visitors using a keyboard, or those who have reduced motion settings turned on, are given simple clickable balls instead of the physics animation, so the page still works for people who cannot or do not want the physics-based interaction. The layout is also responsive, adjusting for both desktop and mobile screens, and there is a small safeguard so that balls falling in during the initial animation cannot accidentally trigger navigation. The repository itself is a standalone demo built with React and Vite, and running it locally only takes an npm install and a dev command. Customizing it means editing a small destinations file for the ball labels and links, adjusting the heading text, changing colors, and optionally swapping the image assets. The README notes that in the creator's own production website, the same idea is implemented as a Next.js component that only loads on the 404 route, so it does not slow down the rest of the site, and it explains how to adapt the demo for a Next.js project. It also includes a written prompt file meant to be handed to an AI coding assistant to help integrate the experience into a different framework. The project is released under the MIT license, and a credit or link back is appreciated but not required.