Create a HTML canvas animation with 140 characters. I love this.
The “game loop” is a name given to a technique used to render animations and games with changing state over time. At its heart is a function that runs as many times as possible, taking user input, updating the state for the elapsed time, and then drawing the frame.
In this short article you’ll learn how this fundamental technique works and you’ll be able to start making your own browser based games and animations.
A while back, I had a lot of fun creating some basic HTML5 canvas particle emitters. I don’t know why, but I love hacking on these things. They’re not particularly useful, but they are kind of mesmerising. Below is the first one I created — view full screen here.
CCapture.js is a library to help capturing animations created with HTML5 canvas at a fixed framerate.
Tonight, I made an attempt at creating a HTML5 Canvas sprite animation. The process is actually quite simple, if not a little fiddly. I figure that I’ll need to get good at this, if I want to finish my game. Anyhow, an example of one of the sprites I created can be seen below. The sprite loops through 4 states, using a spritemap to show a different alien for each state. I’m thinking of using this one as part of my game’s intro.
An introduction to HTML5 Canvas using the Legend of Zelda. Recorded at Fluent 2016 in San Francisco. Presented by Rich McLaughlin.
A good introduction to game development, the slides are here. I’ve not done any work with the canvas element for a few months, but after watching this, I think I’ll get back into it. I’ve got some partially finished games and it would be good to get them finished.
The thought of having to choose a colour for something does not sit comfortably with me. I have read all about colour theory, like a million times, but I still feel mentally paralysed when faced with having to pluck a colour from the rainbow. It’s a sickness, I tell you.
So, anyhow, I currently find myself in said position. Normally, my first line of defence is to revert to good old black ‘n’ white, however, this time I’ve made a mental promise to myself to go wild and choose some actual colours. To be clear, I’m not planning on using the colours below. I think they’re a little too wild, but I do the like the combination. The colours are those featured on the Beastie Boys album art for Hot Sauce Committee Part Two.
Or maybe I should?
Yesterday was Valentine’s Day and CodePen featured some pretty nice “love” inspired pens. This one was my favourite, I could watch it for hours.