3 ms·

What do we need for HTML5 games to be awesome?

10 points by fridek 15y ago

wslh 15y ago
That browsers work first. For example Google Chrome has issues with SVG leaving trailing images when you move an object.
nextparadigms 15y ago
Can you make games like those showcased for Flash 11 on WebGL? I, for one, am looking forward to WebGL games replacing Flash games. Since WebGL is based on OpenGL ES 2.0, can the code from iOS or Android games be mostly re-used for WebGL games? What about making games directly in Native Client?
- fridek 15y ago
  Flash 11 looks nice, but with WebGL you can make games like those in normal OpenGL. Best example is Quake 3 in WebGL by Brandon Jones - http://media.tojicode.com/q3bsp/ http://media.tojicode.com/q3bsp/ During onGameStart conference he also showed Team Fortress 2 level (200mb of assets) in a browser, running smoothly at 60 fps. The map was parsed from original game file. You can't easily port C++/Objective-C/Java games to JS, but you can use the same assets and GLSL shaders (as long as they are ES 2.0 compatible). I haven't tested NaCl yet, so I can't even say if it supports WebGL.
  - nextparadigms 15y ago
    I believe they said at Google I/O that either it supports or it will support WebGL. The guy from Rovio said he used GWT to convert his Android Java game into the WebGL version of Angry Birds that is available now in the Chrome Webstore. So maybe GWT makes it easy enough to port Java games to JS?
modeless 15y ago
This guy is clueless about what we really need for awesome HTML5 games. Operator overloading? Really? What we really need: Better WebGL support from graphics vendors: fewer driver bugs and better sandboxing. WebGL in IE, or at least WebDirectX. Full screen mode. Mouse capture. Polling input APIs, Gamepad and multitouch support. Decent low latency audio APIs. Web Sockets. Better control over garbage collection. A few good libraries and game engines for JavaScript; or, even better, Native Client support.
- fridek 15y ago
  Yup, operator overloading. I miss it and I wonder why you don't. Check link at the end of the post - http://codeflow.org/entries/2011/sep/11/webgl-and-html5-challenges-for-the-future/ http://codeflow.org/entries/2011/sep/11/webgl-and-html5-chal... it includes most of what you said and I'm a little to lazy to rewrite what this guy has already listed.
  - modeless 15y ago
    Sure, I like operator overloading as much as the next guy, but lack of it isn't going to stop you from making a great game.
- simonbrown 15y ago
  Full screen is coming soon to Chrome. http://code.google.com/p/chromium/issues/detail?id=73923 http://code.google.com/p/chromium/issues/detail?id=73923
- zidar 15y ago
  Well I could live without IE, but your list is good. In my opinion though, the mouse capture is the most important one. Playing a game and not being able to spin around, cause the mouse hit the edge of a screen is bad.
- nextparadigms 15y ago
  Why should IE have WebDirectX? Do you want the web to be splintered like the OS platforms? I'd rather they don't implement anything at all and get people to move to the other browsers if they want to play those games, if IE isn't going to adopt WebGL.
- seanalltogether 15y ago
  I've tried porting some AI and physics from AS3 over to JS and realized that there are some fundamental problems with JS that simply isn't on the roadmap to fix. Overall "engine-like" code performance can be 2x-5x slower in JS then in a language that supports basic typing. I found it very telling that Unity3D announced compiling for Flash 11 and nothing about WebGL.
simonbrown 15y ago
> Every browser should ask user, if he allows website to run WebGL content. I doubt most users would understand the warning, most would probably just click through it. WebGL may have some security issues that need to be addressed, but just adding a warning seems like a cop-out.
AshleysBrain 15y ago
My startup may be of interest: a HTML5 game editor for Windows (www.scirra.com) which solves some of these problems (easy to import artwork, animations, set collision masks, add physics, low GC overhead engine, etc). </shameless plug>
- wccrawford 15y ago
  I've actually been getting into games programming for HTML5 recently. A couple questions I don't see answered there: Do I have to use your creator for everything, or can I actually do a lot of the programming myself? And if I can, can I use CoffeeScript instead of Javascript?
jdc 15y ago
V3 = M1.multiply(V1).add(V2); // and even worse V4 = V1.add(M1.multiply(V2)); ...I don't code in JS often, but am I missing why you wouldn't just use this?: V3 = M1 * V1 + V2; V4 = V1 + M1 * M2;
- teamonkey 15y ago
  V1,V2,V3 are vectors. M1,M2 are matrices. Javascript doesn't have built-in matrix math.
  - fridek 15y ago
    And there is no operator overloading, so you have to go with prefix notation. It's not that bad unless you want to write something like GJK collision detection. I actually do, so you see why it annoys me so much.
wccrawford 15y ago
I don't think people use block/retro graphics because they think the browser can't handle it. I think they do it because they are indies and they're doing what they can to get their game out there. While I think there are a lot of things on that list that need to happen before html5 games are taken seriously, there's a few missing: Lockdown. There's no way to protect your assets from theft. I know DRM is the anti-Christ, but protecting your assets is not something the AAAs will be giving up. (I don't expect this will ever happen, though.) Sound. My lord, why does sound suck so badly in browsers? Controls. You can't capture the mouse and use it for FPSs, etc. Apparently there are gamepad libraries for JS, but I haven't tried them. Input in general is just pretty primitive.
DanielRibeiro 15y ago
Physics engines work well on Javascript (and coffeescript and clojurescript): http://danielribeiro.github.com/ClojureCoffeeScriptGame/ http://danielribeiro.github.com/ClojureCoffeeScriptGame/
- fridek 15y ago
  This is 2D and done in coffescript which sounds like cheating ;) 3D math is not that simple and it has to be done really well. I look forward to see a good 3D physics so if anybody has found/done it, please share.
  - DanielRibeiro 15y ago
    The library is in Js: http://code.google.com/p/box2dweb/ http://code.google.com/p/box2dweb/ Which is a port of a famous physics engine in C: http://box2d.org/ http://box2d.org/ And there are 3d physics engines for Js as well: http://glge.org/demos/cardemo/ http://glge.org/demos/cardemo/ and http://www.glge.org/ http://www.glge.org/
hackermom 15y ago
C++ style programming (something else than JavaScript) and WebDirectX... This doesn't sound like the portable, any-browser-on-any-platform experience that I want HTML5 to truly be. There's something else to take note of here: HTML5 wasn't conceived with gaming in mind - but thanks to slick work by slick hackers, we have a lot of this already, and there will be a lot more. The question is if another in-browser language that isn't JavaScript, and another 3D API that isn't WebGL, will aid this rather than fragment it.
- fridek 15y ago
  WebDirectX was rather humorous thing, but the point is that if IE would support any API, we could write some wrapper and actually let things work. Now it's as you said, only hacking. There is not much money (equals manhours) involved when technology is not well supported.
program 15y ago
> To be honest – CSS3 animations have terrible syntax I think that this guy has never heard of the canvas element. Using CSS3 animations for making games is pure madness.
- robterrell 15y ago
  Not madness, but widely accepted reality. We use CSS3 animations to get the benefit of hardware acceleration on devices that support it. Canvas isn't hardware accelerated. Our current game gets over 40 fps on iOS devices with a couple hundred sprites in action. That would not be the case if we were just blitting into a canvas.
robterrell 15y ago
Audio is the #1 missing peice right now. In the work I've been doing, everything else has solutions or workarounds, but there's no good answer to this one. Using a SWF to play sounds is a terrible kludge.

10 points by fridek 15y ago

wslh 15y ago

That browsers work first. For example Google Chrome has issues with SVG leaving trailing images when you move an object.

nextparadigms 15y ago

Can you make games like those showcased for Flash 11 on WebGL? I, for one, am looking forward to WebGL games replacing Flash games. Since WebGL is based on OpenGL ES 2.0, can the code from iOS or Android games be mostly re-used for WebGL games? What about making games directly in Native Client?

fridek 15y ago
Flash 11 looks nice, but with WebGL you can make games like those in normal OpenGL. Best example is Quake 3 in WebGL by Brandon Jones - http://media.tojicode.com/q3bsp/ http://media.tojicode.com/q3bsp/ During onGameStart conference he also showed Team Fortress 2 level (200mb of assets) in a browser, running smoothly at 60 fps. The map was parsed from original game file. You can't easily port C++/Objective-C/Java games to JS, but you can use the same assets and GLSL shaders (as long as they are ES 2.0 compatible). I haven't tested NaCl yet, so I can't even say if it supports WebGL.
- nextparadigms 15y ago
  I believe they said at Google I/O that either it supports or it will support WebGL. The guy from Rovio said he used GWT to convert his Android Java game into the WebGL version of Angry Birds that is available now in the Chrome Webstore. So maybe GWT makes it easy enough to port Java games to JS?

modeless 15y ago

This guy is clueless about what we really need for awesome HTML5 games. Operator overloading? Really? What we really need: Better WebGL support from graphics vendors: fewer driver bugs and better sandboxing. WebGL in IE, or at least WebDirectX. Full screen mode. Mouse capture. Polling input APIs, Gamepad and multitouch support. Decent low latency audio APIs. Web Sockets. Better control over garbage collection. A few good libraries and game engines for JavaScript; or, even better, Native Client support.

fridek 15y ago
Yup, operator overloading. I miss it and I wonder why you don't. Check link at the end of the post - http://codeflow.org/entries/2011/sep/11/webgl-and-html5-challenges-for-the-future/ http://codeflow.org/entries/2011/sep/11/webgl-and-html5-chal... it includes most of what you said and I'm a little to lazy to rewrite what this guy has already listed.
- modeless 15y ago
  Sure, I like operator overloading as much as the next guy, but lack of it isn't going to stop you from making a great game.
simonbrown 15y ago
Full screen is coming soon to Chrome. http://code.google.com/p/chromium/issues/detail?id=73923 http://code.google.com/p/chromium/issues/detail?id=73923
zidar 15y ago
Well I could live without IE, but your list is good. In my opinion though, the mouse capture is the most important one. Playing a game and not being able to spin around, cause the mouse hit the edge of a screen is bad.
nextparadigms 15y ago
Why should IE have WebDirectX? Do you want the web to be splintered like the OS platforms? I'd rather they don't implement anything at all and get people to move to the other browsers if they want to play those games, if IE isn't going to adopt WebGL.
seanalltogether 15y ago
I've tried porting some AI and physics from AS3 over to JS and realized that there are some fundamental problems with JS that simply isn't on the roadmap to fix. Overall "engine-like" code performance can be 2x-5x slower in JS then in a language that supports basic typing. I found it very telling that Unity3D announced compiling for Flash 11 and nothing about WebGL.

simonbrown 15y ago

> Every browser should ask user, if he allows website to run WebGL content. I doubt most users would understand the warning, most would probably just click through it. WebGL may have some security issues that need to be addressed, but just adding a warning seems like a cop-out.

AshleysBrain 15y ago

My startup may be of interest: a HTML5 game editor for Windows (www.scirra.com) which solves some of these problems (easy to import artwork, animations, set collision masks, add physics, low GC overhead engine, etc). </shameless plug>

wccrawford 15y ago
I've actually been getting into games programming for HTML5 recently. A couple questions I don't see answered there: Do I have to use your creator for everything, or can I actually do a lot of the programming myself? And if I can, can I use CoffeeScript instead of Javascript?

jdc 15y ago

V3 = M1.multiply(V1).add(V2); // and even worse V4 = V1.add(M1.multiply(V2)); ...I don't code in JS often, but am I missing why you wouldn't just use this?: V3 = M1 * V1 + V2; V4 = V1 + M1 * M2;

teamonkey 15y ago
V1,V2,V3 are vectors. M1,M2 are matrices. Javascript doesn't have built-in matrix math.
- fridek 15y ago
  And there is no operator overloading, so you have to go with prefix notation. It's not that bad unless you want to write something like GJK collision detection. I actually do, so you see why it annoys me so much.

wccrawford 15y ago

I don't think people use block/retro graphics because they think the browser can't handle it. I think they do it because they are indies and they're doing what they can to get their game out there. While I think there are a lot of things on that list that need to happen before html5 games are taken seriously, there's a few missing: Lockdown. There's no way to protect your assets from theft. I know DRM is the anti-Christ, but protecting your assets is not something the AAAs will be giving up. (I don't expect this will ever happen, though.) Sound. My lord, why does sound suck so badly in browsers? Controls. You can't capture the mouse and use it for FPSs, etc. Apparently there are gamepad libraries for JS, but I haven't tried them. Input in general is just pretty primitive.

DanielRibeiro 15y ago

Physics engines work well on Javascript (and coffeescript and clojurescript): http://danielribeiro.github.com/ClojureCoffeeScriptGame/ http://danielribeiro.github.com/ClojureCoffeeScriptGame/

fridek 15y ago
This is 2D and done in coffescript which sounds like cheating ;) 3D math is not that simple and it has to be done really well. I look forward to see a good 3D physics so if anybody has found/done it, please share.
- DanielRibeiro 15y ago
  The library is in Js: http://code.google.com/p/box2dweb/ http://code.google.com/p/box2dweb/ Which is a port of a famous physics engine in C: http://box2d.org/ http://box2d.org/ And there are 3d physics engines for Js as well: http://glge.org/demos/cardemo/ http://glge.org/demos/cardemo/ and http://www.glge.org/ http://www.glge.org/

hackermom 15y ago

C++ style programming (something else than JavaScript) and WebDirectX... This doesn't sound like the portable, any-browser-on-any-platform experience that I want HTML5 to truly be. There's something else to take note of here: HTML5 wasn't conceived with gaming in mind - but thanks to slick work by slick hackers, we have a lot of this already, and there will be a lot more. The question is if another in-browser language that isn't JavaScript, and another 3D API that isn't WebGL, will aid this rather than fragment it.

fridek 15y ago
WebDirectX was rather humorous thing, but the point is that if IE would support any API, we could write some wrapper and actually let things work. Now it's as you said, only hacking. There is not much money (equals manhours) involved when technology is not well supported.

program 15y ago

> To be honest – CSS3 animations have terrible syntax I think that this guy has never heard of the canvas element. Using CSS3 animations for making games is pure madness.

robterrell 15y ago
Not madness, but widely accepted reality. We use CSS3 animations to get the benefit of hardware acceleration on devices that support it. Canvas isn't hardware accelerated. Our current game gets over 40 fps on iOS devices with a couple hundred sprites in action. That would not be the case if we were just blitting into a canvas.

robterrell 15y ago

Audio is the #1 missing peice right now. In the work I've been doing, everything else has solutions or workarounds, but there's no good answer to this one. Using a SWF to play sounds is a terrible kludge.