← All embers

A* Pathfinding Visualization

December 2020

The first algorithm I ever watched think, frame by frame.

  • JavaScript
  • p5.js

An animated visualization of the A* search algorithm: a 50×50 grid where roughly 30% of the cells become random walls, then A* searches from the top-left corner to the bottom-right using a Euclidean heuristic — coloring the open set, closed set, and the current best path as it goes.

Inspired by Coding Train, this sketch animates A* one frame at a time. White cells are open space, black cells are walls, dark blue is the closed set, light blue is the frontier, and the cream cells trace the best path back to the start.

Because the walls are random, some runs simply have no way through — the search exhausts the frontier and gives up, which taught me as much about the algorithm as the successful runs did.

SPECTRE