CanyonRunner HTML5 Game


Building CanyonRunner was my favorite development experience in recent memory. Making my first game means coming full circle to when I first started playing video games at age 3.

My intent with CanyonRunner was to build a simple, solid HTML5 game that works on desktop and mobile, features a story and all the basic game systems you'd expect such as a progress saving system, top scores, different game dynamics on each level and two different endings.

Including the time spent learning the new framework, building CanyonRunner took me exactly 76 days of a few spare working hours here and there each day.

Android app on Google Play


Key Features

Technical Details & Takeaways

CanyonRunner is built with the excellent HTML5 gaming engine Phaser, which I cannot recommend highly enough. It was fun learning about the basic physics patterns behind 2D side-scrollers.

Ultimately, I learned the most about compressing and packaging assets correctly for fast delivery to mobile devices. I used a single spritesheet and a single audiosprite to drastically reduce the number of http requests required to load the game on a mobile device.

We all know it's annoying to be in the middle of a game and lose your progress because something comes up. I was able to take advantage of localStorage to create player-specific objects that are written to at various points throughout the game.

This system also allows for the final determination of which ending a player will receive. When the final level is successfully completed, the game inspects the player object and determines how long it took the player to complete the game. Depending upon this total time calculation, they are shown one of two possible "Game States".

Regardless of which ending they get, the player has a chance to share their gaming experience on Twitter - via a built-in button that autopopulates a Tweet for them and includes a link back to the hosting site - helping to drive more social traffic for myself and my sponsors.

CanyonRunner is available for non-exclusive licensing, so please feel free to get in touch with me via the contact link above if you're interested. In the meantime, I had so much fun building this game that I'm onto building out my next concept - one that will include much more complex gameplay mechanics.