Interactive tutorials for math and algorithms
Visit redblobgames.com → RSS feedOn Hacker News Oct 2014 – Sep 2026
Games & Graphics 6Math & Algorithms 4Design & UX 2Web & Frontend 1Software Engineering 1Life, Learning & Writing 1
Many of my interactive pages have a draggable object . I want the reader to move the object around, and I want the diagram to respond in some way. Here I’ll document the code I use to make this work with both mouse and touch input, using browser features that are widely supported since 2020. Here’s a common case I…
[Note: the actual project is here ; the current page is only an introduction to it, for my blog readers.]
On my Introduction to A* page I cover the basics of the A* graph search algorithm for finding shortest paths. Here’s an example from the town of Denerim in Dragon Age Origins. Try moving the start and goal to see A* in action:
In a Tower Defense game, there are many enemies that are all headed to the same place. In many Tower Defense games, there is a predetermined path, or a small number of paths. In some, such as the classic Desktop Tower Defense [1] , you can place towers anywhere, and they act as obstacles that affect the paths taken by…
You may know me for my interactive tutorials. But before that, I was writing visual but non-interactive tutorials. In particular, there wasn’t a lot of information about A* on the web, so I decided to collect all my notes about pathfinding [1] together in one place in the 1990s. But then in the 2010s I started making…
In 2005 Google showed off Google Maps, which lets you drag the map around instead of reloading the page like MapQuest and others used. That’s the feature that got everyone’s attention. But what got my attention was a feature they added in 2007 where you could drag the start/end points on a route [1] , and it would…
(TL;DR: this is a blog post about the process of writing my guide to SDF fonts .)
(Warning: these notes are rough – the main page is here and these are some notes I wrote for a few colleagues and then I kept adding to it until it became a longer page)