Colourful intermediate results

While killing time in the train, we worked with Anne on a small maze generation algorithm. But what started to be a way to visualise the results, turned into a result in itself (run it yourself here, be patient):

Screen Shot 2014-03-16 at 22.56.59
It all started with a way to visualise the distance of each square in a maze. From start to end, it uses the entire color hue.
Decreasing the wall size was very pleasant visually.
Screen Shot 2014-03-17 at 00.01.09
Visualising the progress of the construction is also very nice, like a growing organism.
Screen Shot 2014-03-17 at 00.29.25
Forgetting about the initial goal, here is a very nice colourful render.
Playing with colours, adding depth
Playing with a colour palette, adding depth by changing the color luminosity

Technically, the rendering is done using HTML canvas. I will detail the maze generation algorithm itself in a future post.

This led me to notice that using the HSL notation when drawing on a canvas was 3 times slower than using other color notation. (I created this JSperf). I filled a bug report on the Chromium bug tracker, let’s hope it will be addressed in the future.

The colourful visualisation is published online, you can run it here.