HTML5 Tools

Games Mechanics Explorer

Posted 20:31PM on April 22 2014 by Pascal Rettig
Game Mechanics Explorer is a brand new collection of concrete examples for various game mechanics, algorithms, and effects. The examples include platformer movement, lighting, ballistics, gravity, and more. They are all implemented in JavaScript using the Phaser game engine, but the concepts and methods are general and can be adapted to any engine. Each section contains several different examples that progress in sequence from a very basic implementation to a more advanced implementation. Every example is interactive and responds to keyboard or mouse input (or touch).
According to creator John Watson, the goal was to provide a helpful resource for other game developers, particularly those who are just getting started. Each example focuses on one concept and includes the source code for the implementation. They are written for clarity so that it is easier to understand the underlying concepts and apply them to your own work in your own engine. The example source code is MIT licensed and the included assets are Creative Commons licensed.
Game Mechanics Explorer

GameMix is a free cross-promotion network for HTML5 games.

Posted 16:27PM on July 21 2013 by Pascal Rettig

GameMix is a free cross-promotion network for HTML5 games. Other games in the network send new users to your games as you send your users to theirs. All automated & done through a small snippet placed in your HTML.

Learn more by checking out the video below and heading over to

Frost Web Toolkit for HTML5 Game Development with Unity

Posted 16:14PM on July 21 2013 by Pascal Rettig's Frost Web Toolkit is a toolkit for Unity game developers to create games for HTML5 using the awesome Unity Editor and scripting environment.

Check out the promotional video below and head over to the features page for more details.

Posted 08:41AM on May 17 2013 by Austin Hallock

Most HTML5 game developers choose a game engine to develope their game with – it makes the process much easier since you don’t have to re-invent the wheel. The problem is, there are dozens and dozens of HTML5 games engines to choose from, many of them no longer maintained. was built in an attempt to consolidate the long list of game engines down to the well-respected and maintained ones. From that smaller list, each engine is tied to important information about it: example games, popularity, user ratings, important links, license information, latest release, and more.

The popularity and sample game information is grabbed from a spider that crawls the web in search of HTML5 games. Once it grabs games, it dissects them and categorizes by the game engine used to build them.

Have a look at the list of HTML5 Game Engines to find the right one for you – and when you do, be sure to rate and review it!

Posted 10:57AM on February 26 2013 by Austin Hallock

Developing games is hard. It's even more difficult if you have to take care of all the tedious features like payment processing, achievements, leaderboards, social integration, etc. That's why takes care of all that for you with an easy-to-use JavaScript API. We asked Co-founder Austin Hallock, to give us the inside scoop on the platform.

At, we think HTML5 is a fantastic environment for developing games –  we are betting on it 100%. Our goal is to help with the tedious aspects of game development: distribution and high-level features, so you can focus on developing the game itself. This post highlights how the tools we’ve created can help you conquer the world with your game development.


It’s a bit humorous that I talk about “Gamification” for games…because, well, they’re already games. The reason I use that word is today gamification is associated with features like achievements, high scores, posting scores to Facebook and Twitter, leveling up, etc… Each of these features is often looked over by developers, but they are pivotal for retaining players.

We’ve developed an HTML5 Game API with a primary goal of  making these features as simple as possible to implement. For example, to post a high score, then show the leaderboard, the code with is:

var leaderboard = new Clay.Leaderboard( { id: 'leaderboard-id' } ); function() {
     // post callback, show the leaderboard;

The above code brings up the leaderboard:

HTML5 Game Analytics

The features we currently offer are:

  • User Accounts
  • In-game payments
  • Persistent Data Storage
  • Leaderboards
  • Achievements
  • Analytics
  • Social Integration
  • Screenshots
  • Multiplayer Rooms
  • Cross-Promotion

We wanted to make it as easy as possible to integrate these features, but we also wanted them to be extremely customizable with clear documentation on how to do so.

Of course, there’s always the option of doing this in-house. For some, that makes sense and is a valid approach, but the task is trickier and more time consuming than it may seem. Various odds and ends exist for each platform: the Chrome Web Store, mobile, Windows App Store, etc… and that work can add up to be quite a bit (trust us, we know that very well) – fortunately with a single service taking care of these issues, you don’t have to, and can focus on the game itself.


There are two approaches you can take for revenue when developing a game: 1) Developing a game to be sponsored, whether it’s exclusive, or licensed out, and 2) Developing a game to generate income itself through advertising and in-game payments. The two can overlap some, but if you’re planning on going with the second option, distribution will be a big deal for you. You make more money as your game is played by more people.

HTML5 is great because there are so many marketplaces you can get your game in: The Chrome Web Store, Windows App Store, Facebook, Mozilla Marketplace, the list goes on. Each of these marketplaces however, has their own quirky needs. For example, Facebook requires your game to be hosted over SSL, the Windows App Store requires your files to be UTF-8 with BOM, many of them require their own version of a manifest file, whether it be in JSON or XML. takes care of all these oddities for you with our HTML5 Game Distribution exporter.

Tracking Distribution

It’s not only important to spread the seed for your game, it’s also important to see which marketplaces are most effective – it’s good to know where to focus your effort moving forward.

HTML5 Game Analytics automatically tracks this information if you are using are the API – you can normalize it by other metrics, meaning you can view the time spent per view on each site, or number of views per purchase, etc..

Our Own Marketplace

In addition to the tools we provide for distributing your games to these other marketplaces, we’ve also developed a marketplace exclusively for HTML5 Games. Each of the other marketplaces are great, but the main thing they lack is the ability to play games on any platform/device. The Chrome Web Store limits you to Chrome on Desktop, as do the Mozilla Marketplace and Windows App Store.


Our main goal is to help HTML5 game developers as much as possible, which means we really care what you have to say on how we can improve our products and service. With that said, please reach out to us with your comments and suggestions at

Odobo: HTML5 Game Development platform for the regulated gambling industry

Posted 10:32AM on November 27 2012 by Pascal Rettig

Odobo has launched an HTML5 powered Game Development Kit combined with a royalty portal to allow you to create HTML5 Games for the Gambling industry. Odobo is targeting the regulated, legal gambling industry - so nothing shady - and provides server side logic that includes verified Random Number Generators. Odobo also provides marketing and takes care of any regulatory hurdles, allowing you to focus on the game itself.

Visit the Odobo developer portal for more details.

Ejecta: A Fast, Open Source JavaScript, Canvas & Audio Implementation for iOS

Posted 09:11AM on September 28 2012 by Pascal Rettig

Ejecta is a open-source native wrapper for iOS that has custom hardware-accelerated Canvas and native audio implementations for porting your HTML5 games into the apple App store.

Released by Dominic Szablewski, creator of Impact.js, and an outgrowth of his work on iOSImpact, Ejecta is a general purpose tool that can be made to work with just about any HTML5 engine.

From the site:

Ejecta is like a Browser without the Browser. It's specially crafted for Games and Animations. It has no DIVs, no Tables, no Forms – only Canvas and Audio elements. This focus makes it fast.

JavaScript code is executed directly by a JavaScript VM (JavaScriptCore), the HTML5 Canvas API is implemented in native code with OpenGL, Audio is implemented with OpenAL. Several other APIs (touch, accelerometer, localStorage) behave like those in a real browser.

Many HTML5 Games run out of the box, or with minimal modifications – with better performance, better sound support, Game Center integration and more.

Check out the video below and check out the site for more details. Code is up on GitHub.

CoffeeScript Source Maps

Posted 16:20PM on September 08 2012 by Pascal Rettig

One of the primary reasons developers give as staying away from CoffeeScript in the browser - the need to debug generated code - is no long a valid reason.

Support for Source Maps has been added to the new "better CoffeeScript Compiler" CoffeeScriptRedux and is available in Google Chrome and allows you to see the original CoffeeScript source your executed JavaScript code came from. You can't yet type CoffeeScript into the console or step debugger, but, it's a great step up from debugging previously.

Read more at 

Painting the DOM to Canvas with Domvas

Posted 08:47AM on September 04 2012 by Pascal Rettig

Domvas is a tool that uses what amounts to a backdoor via SVG to allow you to turn DOM elements into images that can be painted onto a Canvas.

Why would you want to do this? Well, taking advantage of all the neat CSS3 effects for HUD elements for a start.  

How does it work? Creator Paul Bakaus explains: "Domvas uses a feature of SVG that allows you to embed XHTML content into the SVG – and as you might know, the actual SVG can be used as a data uri, and therefore behaves like a standard image."

The code does not work on IE.

Check out the project home page or the code on Github

WebGL Inspector

Posted 10:12AM on August 27 2012 by Pascal Rettig

WebGL inspector is a tool let's you dig down into your WebGL calls and see exactly what's going on.

From the website: "WebGL Inspector is a tool inspired by gDEBugger and PIX with the goal of making the development of advanced WebGL applications easier. What Firebug and Developer Tools are to HTML/JS, WebGL Inspector is to WebGL."

1 2 3 4   > >