Tuesday, January 25, 2011

Why I'm Moving From HTML5 To Flash

As you might have noticed, Corey & I have submitted Cardinal Quest, an html5/js game that got quite a lot of attention on reddit, hacker news & twitter, to 8BitFunding in order to raise some money so that we can work on it full-time and release the flash version in a month instead of a year.

  Wait, Flash version?

You ask? Yep, that's correct!

  But...Cardinal Quest is an html5 game! It's the game of the future! Open standards! Mobile platforms! Canvas!

That was indeed the plan, which is why Cardinal Quest's prototype is written in js and html5.

Reality, however, has once again reared its ugly head. There are 3 main reasons why the final version will be written in Flash:

Browser support of html5 features is spotty at best

Each browser has its own quirks- some have buggy canvas implementations, some support only mp3 encoding in audio tags, others only ogg.

One of them doesn't yet support any html5 tags at all (workarounds exist, but are suboptimal to say the least).

Performance is not up to par

Even tho great strides have been made with regards to js execution in recent years, rendering graphics in canvas is still considerably slower than rendering graphics in flash.

Additionally, there is a huge difference in js execution speed between browsers - it is not uncommon for me to get 4x the FPS in Chrome as in Firefox.

There is no FGL for html5 games

Flash games have been around for years- they can be packed in a single SWF file, portals know how to host them, they are easy to embed and easy to distribute.

All those add up to the fact that it is significantly easier as a game developer to sell flash games than html5 ones.

The market for html5 games simply does not exist yet - at least not at nearly the same scale as the market for flash games.

Is html5 the future? I sure hope so!

Unfortunately, it isn't the present.

20 comments:

  1. Aww, hate to hear that HTML5 didn't work out for you guys :[ Sounds like early adopter pain, which is something that just has to happen. Does make me a bit wary of treading that path, but I'll test the waters in a few months to see if the situation has improved.

    ReplyDelete
  2. It will be GPL'd once it has payed for its development costs & isn't bringing in significant revenues anymore.

    ReplyDelete
  3. I use GWT. It creates a "FGL" file for every browser. Basically, it makes one .css, one .html, and a specialized .js file for every browser. Several abstracted canvas/SVG/WebGL elements exist which are usable. For performance, your game might have requirements which cannot be met by js/html. I don't know.

    For my game, HTML5 using GWT is awesome. No speed issues, no x-browser issues and indeed a "single FGL file".

    ReplyDelete
  4. Ruudjagh: it is one file for you, but not one file for the portals - at the very least they would need to integrate the html/css/js files into their site, which is more work than just embedding a single compiled swf file.

    ReplyDelete
  5. I can't leave an intelligent comment about the programming challenges you're facing, but hey, I'm a fellow Winnipeg Freelancer who is happy to find your site!

    I'd imagine you're a Secret Handshake member, too, right? :) Maybe we'll meet next time.

    At any rate, I added you on Twitter, and added you to my Tweet list dedicated to Winnipeg Freelancers:
    http://twitter.com/#!/thewebgrrl/winnipeg-freelancers

    Excellent to connect with more people who are following their own passions and dreams via Freelance work :)

    Take care!

    Jill Lampi
    Winnipeg Internet Marketing Strategist

    ReplyDelete
  6. To bad you're switching to Flash, if you did HTML5 and marketed it toward users of mobile devices you have access to the hundreds of millions of iphone/android/ipad/tablet devices around the world.

    ReplyDelete
  7. d_sc: if the flash version takes off we will make a mobile version :)

    ReplyDelete
  8. Good summary, Ido. I would add that ActionScript 3 (which is ECMAScript 3) is much more suitable for complex development, as it has real OO and type-safe feature. There are frameworks such as time-tested Parsley, PureMVC and Cairngorm out there to make large-scale development easier. At any rate, a good debugger is way better than alert statements or console logs.

    Not to mention, your graphics designer can directly involve in character creation and export them as FXG or Flash symbols. Good luck.

    ReplyDelete
  9. Since you're moving to flash, I hope you don't mind me asking what html5 game lib you used. Did you write your own or did you mess with Akihabara or GameQuery?

    I'd like to hear your thoughts and experiences with those if you did touch or test them.

    ReplyDelete
  10. I just used jquery Mark, nothing game specific.

    ReplyDelete
  11. Thanks Ido. Very good article to know the limitations of HTML 5. I still don't use it commercially, but to know the limitations will help me very soon.
    []'s

    ReplyDelete
  12. You should checkout cocos2d-javascript.org. It's a canvas/HTML5 port of cocos2d-iphone. It doesn't solve all the problems mentioned (yet), but one it does solve is packing everything into a single file. It will embed all images, map data, code, and anything else into a single .js file.

    It can't hurt to try it.

    ReplyDelete
  13. That does sound interesting, I didn't know about cocos2d-js Ratty!

    ReplyDelete
  14. Well that ONE browser can be ruled out completely as an HTML 5 platform. In present or next incarnation, apparently. Fortunately the audience it provides is not exactly your target audience anyway (they're way too busy masturbating, removing viruses, and playing facebook games at work). I have played with simulations in HTML5 and SVG a bit and had some success. Much of the performance pains related to not knowing how to write efficient JS (which I corrected, learning process). Canvas as far as I can see is a pain in the ass. It's fast, sure... It'll get there though. Sorry you won't be pushing the cutting edge.

    ReplyDelete
  15. @ntastic:
    Sounds like the cutting edge was cutting into his ability to do things.

    ReplyDelete
  16. Last sentence is excellent. Thanks for the post

    ReplyDelete
  17. I could help with an Android port :)

    ReplyDelete
  18. @badlogicgames: I'll give you a shout at #lwjgl if we have troubles figuring it out :)

    ReplyDelete
  19. It's cool to read something like that :)

    I love both tech but my favorite choice is Flash Action Script :

    .Mature language with package{}, classes{}, and variable types.
    .Support for udp or lowlevel binary format
    .Builtin filters and blendings like photoshop layers
    .Video and jpg with Alpha channel
    .Mic/webcam interaction
    .Realtime sound manipulation as synthesizers
    .Better antialias and optimization features
    .Complete api for bitmap gradients vector fonts etc that make css look limited
    .Flash IDE allow you to closely work with designers :)
    ... and many more reasons ^^

    Html5 is a good alternative but the hot html5 features are just some standard things flash has for a very long time.

    ReplyDelete