Monkey Pong

A tiny teaching experiment in 3d-transformations using matrices. It is heavily inspired by Tsoding's recent video. Linear algebra refreshers can be frontloaded with a lot of theory, I wanted to write this as a way to ease into transformations without getting bogged down by theory. It's currently a work in progress, A diffuse shading pipeline, and pong paddles are in the works.

---

Code Checkpoints

• Part 0 - Initial Commit

  • Canvas 2D Rect
  • Drawing a point
  • Drawing quads

• Part 1 - Perspective

  • Perspective correction
  • Faces and lines

• Part 2 - Shape Rotation

  • Animation
  • Rotation and translation

• Part 3 - Enter the Matrix

  • Rotation matrix
  • Matrix multiplication

• Part 4 - Hello GPU

  • Refactor + WebGPU init
    • Overview
    • canvasWebGPU.ts
    • canvas2d.ts
    • Transform state