# The Making of UPYRI – JS13k 2023 Post Mortem After Last Years Competition At the end of last year’s competition, I knew there were a handful of things I wanted to do to prepare for the following year. Toolset While I had already come up with a pretty good build process before last years competition, there were a few annoying things about it. The […]

# WebGL Shadow Maps Part 1: As Simple as Possible Shadow maps are surprisingly not too hard to implement in WebGL, at least not much harder than regular texturing, but you wouldn’t know that by looking for tutorials on them. The aim of this post is to fix that and provide a walkthrough from the simplest possible shadow map implementation to a reasonably nice final implementation. […]

# Math for Game Development and WebGL Part 6: Matrix Math Intro What is a matrix? A matrix is a rectangular array of numbers arranged in rows and columns: $$\begin{bmatrix} 1 & 2\\ 3 & 4 \end{bmatrix}$$ You may think, isn’t a vector also a rectangular array of numbers? Yes, you can also think of a vector as a matrix with one row or one column (row vs column […]

# Math for Game Development and WebGL Part 4: Sine, Cosine, and Tangent Now we’re going to talk about math with triangles and certain measurements and properties of triangles. Also known as, trigonometry. It’s not as scary as it sounds. We already know the Pythagorean theorem, we used it to find the magnitude (aka length) of our vector. It turns out that other properties of triangles are very […]

# Math for Game Development and WebGL Part 2: Vector Multiplication In the last post we talked about what a vector was, how to add and subtract vectors, and how to find the magnitude of a vector. We also demonstrated that by adding vectors we could translate (aka, move) a square around in two dimensions. Now we’ll look at scaling vectors using multiplication. Multiply Vector by Scalar […]

# Math for Game Development and WebGL Part 1: Vectors After rekindling my interest in 3D game development, I looked at WebGL. Being a web dev, this made sense. Unfortunately resources for this are mediocre at best. While WebGL2Fundamentals and the Introduction to Computer Graphics book do cover some of what’s needed, they largely skip the actual math and just tell you to do something. […]