Featured Blog | This community-written post highlights the best of what the game industry has to offer. Read more like it on the Game Developer Blogs or learn how to Submit Your Own Blog Post
Tools and resources for those making the switch from Flash to HTML5.
It seems like most are willing to concede that Flash will fall out of popularity in favor of HTML5 for web games, but that's an argument for another time and place. For those making the switch, the tools you'll be using to build your games will change, and this should serve as a good guide for tools that will make the transition as smooth as possible.bu
As of this writing, May 2013, HTML5 tools aren't as polished as their Flash counterparts - they haven't had as much time to mature - but they're improving at a much faster rate. More competition in the space has led to higher quality tools for developers, enough so that HTML5 is just as viable as Flash for developing games.
To make the tools easier to digest, I've formatted this in a way where the common Flash game development tools are compared against their HTML5 counterparts.
Phaser is "Flixel HTML5", so you'll feel right at home if you're used to Flixel. Even if your background is in FlashPunk, Axel, or some other engine, Phaser shouldn't be too foreign. It developed by Richard Davey (AKA Photon Storm), who has been an extremely active member of the Flixel community for years now, and an avid HTML5 game developer for almost as long.
There are at least a dozen good options for an HTML5 game engine - some not as friendly to Flash/AS3 developers, but still great engines. Some worth checking out include: ImpactJS, LimeJS, GC Devkit, CreateJS, and a quite a few more. As a new technology, HTML5 game engines come and go pretty often, so the person or people behind the engine really matters.
For a full list of respected and maintained HTML5 game engines, including descriptions, reviews, sample games, and important links, see HTML5GameEngine.com.
Stencyl recently started supporting HTML5 exports, but even they admit their implementation isn't as optimized as it could be. For that reason, Construct 2 is the best choice for a "drag-and-drop" type interface for creating games. Of course, saying it's "drag-and-drop" is over simplification, but if you want a way to develop games without writing any JavaScript, Construct 2 is the way to go.
Other good alternatives to Construct 2 include the HTML5 exports of GameMaker and NME.
Mochi is the de facto solution for high scores, achievements, analytics and advertising for Flash games. They haven't quite gotten around to HTML5 support, but fortunately Clay.io can fill all of those holes. There is also support for some features Mochi has shutdown in the past year like social integration and in-game payments.
A recent alternative from Google is Google Play Services.
Flash is still a great tool for creating animations, and Tresensa has developed a tool that efficiently exports Flash animations to HTML5. You can see it in action for some of their games that perform great on mobile devices: Strandead and Turkey Tumble.
For illustrations, you can export using a tool like drawscri.pt.
If you're not a fan of JavaScript, TypeScript a class-based OOP alternative that compiles to Javascript. Using this Microsoft-developed language will make the transition from AS3 to HTML5 a bit easier. You can even convert some of your old AS3 over to TypeScript with this tool.
Mochi Media distributes thousands of Flash games across thousands of websites, generating a good bit of revenue for all parties involved. Their system, however, only accepts Flash games. Clay.io has built out its own similar game network for distributing HTML5 games to publisher sites. Just like with Mochi, advertisements are displayed (you're able to easily integrate ads), and developers receive 50-70% of the revenue.
Because HTML5 introduces new possibilities like mobile, Clay.io also helps distribute your games to mobile users, and makes it easier to get them on the Windows App Store, Facebook, Chrome Web Store, Firefox Marketplace, and some others as well.
BoosterMedia offers a similar service - it doesn't hurt to use both!
Similar to Flash, the most common model for generating revenue in HTML5 games today is through sponsorships and licensing. Though FGL does accept HTML5 games, developers have had better luck at MarketJS since it has more of a focus on HTML5, and more importantly, mobile web games.
Developing a desktop-only HTML5 game these days will lead to a lot of trouble in finding sponsors, after all, you are competing with the huge market of Flash games. Creating a game that works on mobile devices provides a lot of value to publishers of all types.
Most HTML5 game development folks gather here, and it's a very friendly, welcoming community.
A great article for porting some of your older games over to HTML5.
A course taught by a couple of Googlers that walks through building an HTML5 game.
A huge collection of HTML5 tutorials and useful links.
Full Disclosure: I am one of the co-founders of Clay.io, which just so happens to show up twice in this list. If you have any questions about the company, or HTML5 in general, feel free to reach out, I'm happy to help: [email protected]
Read more about:
Featured BlogsYou May Also Like
.png?width=300&auto=webp&quality=80&disable=upscale)
