Tag Archives: HTML5 Canvas

Building a video game in the wild west of HTML5 programming is no easy task. I’ve had many difficult problems with my HTML5 game A Dragon Named Coal through Clever Crow Games. How do you build a game CMS, distribute to several systems quickly, and find the resources you need to keep moving forward. Being involved in San Francisco’s Meetup.com scene I’ve met several other HTML5 game developers struggling with the same issues. To try and help unite these developers to create better games, I’ve started the San Francisco HTML5 Game Developers Meetup group.

One of the major components missing from my open source game engine has been a lightweight JavaScript easing library. If you aren’t familiar with easing, its used to create unique animation movement that feels lifelike and less robotic. There are general use libraries such as jQuery and completely dedicated JavaScript easing libraries that have the words Tweening in the title. While these tools are great, I found them to be too robust, slow, or undocumented. Because of this I’ve created a new lightweight open source library called Simple Tween JS.

Simple Tween JS is a lightweight open source JavaScript easing library at less than 200 lines of code. Complete documentation and the latest version can be found at the GitHub repo.

Creating 3D games with WebGL and HTML5 APIs isn’t an easy task. It requires matrix manipulation, communicating with graphics hardware, and a good understanding of OpenGL ES (mobile version of OpenGL). To try and make these concepts easy to understand, I created a game tutorial in my new book for HTML5 In Action called Geometry Destroyer. By clicking on the image below, you can play it right now.

Geometry Destroyer is a classic space shooter style game, written with JavaScript, HTML5 APIs, and WebGL

I’ve decided to post an HTML5 game called Canvas Ricochet for my upcoming book. The game includes a score counter, progressive leveling, restart capabilities, collision detecting, and more. Click the image below to play now!