Back in 2015, I had attempted to explain coordinate transforms in terms of matrices. In 2016, I started over, trying to focus on coordinate transforms without matrices. That didn't work the way I wanted either, and I wrote a blog post about that, saying that I was going to focus on game cameras. I started that, but lost motivation. The last line of that blog post is: Well, I failed. I lost motivation to work on this so I've put it on hold … again. I think I may take a long break from tutorials.

I did take a long break. I joined a game company as a consultant, mentored people making interactive articles, improved my existing pages, and also worked on lots of other things (2017, 2018). I'm reasonably happy with how things went. I've continued doing these things, but my attempts at making new tutorials have failed. Several times I tried to make a tutorial about differential heuristics for A*, but lost motivation. I tried to make a tutorial about common heuristics for A*, but lost motivation. In both those cases, I realized that it's hard to write a tutorial when I don't really understand the topic nearly as well as I thought I did. I also run into scope creep: I start with an idea but keep adding more topics to the page faster than I can actually write them.

I don't know where that leaves me. Will I ever write a comprehensive tutorial again? I don't know.

For the past few weeks I've been revisiting coordinate transforms. What am I doing differently this time? I'm keeping the scope small. Instead of all topics related to coordinate transforms, I've picked a style of game and limiting myself to the transforms that make sense for that style of game. All other topics I can tackle later.

Here's the rough outline:

  1. Show a side scrolling game with some cool camera effects.
  2. Introduce world coordinates vs screen coordinates.
  3. Solve the problem of scrolling: subtract an offset.
  4. Introduce transforms. (may need to be later)
  5. Introduce inverse transforms, for mouse clicks. (may need to be later)
  6. Introduce cameras. More complicated than offsets, but can do more.
  7. Show some cool effects with cameras. (may need to be earlier)
  8. Introduce chaining transforms.
  9. Show some cool effects with chaining.
  10. Demo showing all concepts together.

In parallel with implementing the interactive diagrams, I'm working on the narrative structure. The standard textbook style is to start with definitions and then give examples. I think that can be unmotivating. But it's also hard to talk about an example without knowing what the concept is. I'm still trying to figure out how to best arrange these sections. This part is often harder than implementing the diagrams.

If this page works, I can then add another style of game to introduce vertical scrolling, and then another style of game to introduce rotation or zooming. With enough examples, I think I'll understand the topic well enough to be able to write a reference that covers translate, scale, rotate, skew, etc. But even if I don't get that far, the first page can be useful on its own.

The "first page can be useful on its own" also served me well for the A* page and the hexagon page. The A* page was originally intended to be one part of a much longer series about pathfinding. The hexagon page was originally intended to be one part of a set of pages that covers all grid types. Those pages became useful on their own, and I haven't written the rest.


jan wrote at September 16, 2019 9:31 AM

Hi Amit,

I've only recently become aware of your blog and I think your work is amazing. Your work on hexagonal grids is by far the most detailed and polished I've seen.

I hopefully wanted to address your frustration in writing a new tutorial. Why not spread it out into small bites? For example, you talked about cameras and it can be quite complicated, so why not start with the basics first and grow it organically into something like a complete game. I know I would have benefited from it and I'm sure many of your other readers will too.

I did write a game in JavaScript when I was learning how to code (freecodecamp), please do take a look if you get a second (it took me ages to figure out a lot of things!)

I want to try and make a turn based strategy game (and game builder) using your haxagons as a base along with some kind of camera setup for panning and zooming the grid. I'll need to learn about graphics to canvas, animating (really struggle with that), storing data, a kind of points/bonuses setup for game characters and terrain and the biggest problem by far that I had, resetting a game after finishing. that's just an overview, but ideal start would be a grid on the canvas, a camera and a character that can move with mouse or key commands.

I probably won't get far, but I'm willing to bet you could.

anyways, great blog. I'll be an avid reader.

Amit wrote at September 19, 2019 6:34 PM

Thanks Jan! I think I am coming to the same conclusion — I should start with small bites and then later work on a bigger page. I've been experimenting with some of the coordinate transform ideas on this page. However I got distracted by another topic (coordinates on a sphere) so I am pursuing that right now
:-) After I work on that I can get back to coordinates in general, or some other topic. I have soooo many things I want to write about:

Your game sounds like you'll get to learn lots of fun stuff. I wish you luck!