16

Get a couple of friends and make them go through bugs and check all game assets. Think of ways of monetizing it, like implementing the Kongregate API or so.


16

I agree with Ef Es, get a couple of people, parents/friends whoever, and watch them play through it. It's the worse to launch a game only to find it really hard because you were use to the game mechanics. I suggest maybe making a blog of the launch of your game, just go over the details, any updates can be listed there as well. If money isn't a concern, ...


15

Let's start with the array. Don't think about it as tridimensional. Indeed, if you want to have stackable units there, it makes sense at first sight: first dimension is collumns of rows of tiles second dimension is rows of tiles third dimensions is tiles, i.e. arrays of units. But this third dimension won't be consistent, as you will store there not only ...


13

Canvas and DOM aren't mutually exclusive, although they are fairly separate. One good approach would be to render the main game area (eg. the falling pieces in Tetris) using Canvas, and do all the UI (eg. score display) with DOM elements that are overlapping the canvas element. That said, such an approach isn't really necessary for a primitive game like ...


12

About DOM DOM works pretty well for old-school 2D, that means using no image rotation or scaling. There are actually tools for both of these jobs, but you can't count on them performing well. For a game you should rely on the browser layout engine as little as possible, that means use position:absolute to place objects. Try as far as possible not to create ...


12

This means that when the background is drawn, not all of it is redrawn every frame. When something on the map moves, the area it used to occupy gets marked as dirty. Then when drawing, you know you only need to redraw that portion of the background. This is beneficial because then you only need to redraw the areas that weren't shown before. So this is ...


11

Not knowing the API's at your disposal, here's the basic math behind getting an angle in degrees: angle = math.atan2(y2 - y1, x2 - x1) * 180 / math.pi; The * 180 / math.pi; converts it from radians to degrees.


11

1) Lack of knowledge. Developing for Canvas might be well beyond some web developers who are very accustomed to manipulating DOM. 2) Lack of a scene graph. The DOM is (in game engine terms) a scene graph, permitting strong querying and manipulation of DOM nodes. Writing a game using Canvas requires the developer to "reinvent" that part of the wheel. 3) ...


10

First of all I suggest that you change directions from: W - up-left S - down-right A - down-left D - top-right into more intuitive: W - up S - down A - left D - right As for your concern, I suggest that you make two functions, one translating isometric tile coordinates into grid coordinates, and second the other way around. That way you could simply ...


10

Framerate varies by browser. A few still do not support accelerated canvas rendering, others don't support WebGL at all. Best bet is to profile actual code on actual target hardware/browsers to determine which performs best for your specific needs and user demographics. WebGL is only supported on IE in version 11+ but canvas has been supported for several ...


10

Multiple canvases can help in some cases. Just as a quick example - say you have 2 layers (canvases) to your game. The background of your game is not going to change very frequently, for example. So one canvas will be dedicated to just rendering the background of your game. This means you only have to render the background once, and only re-render it ...


9

OK, I figured it out. Almost. It's actually quite obvious, and I feel a bit dumb for not noticing this right away. When you call drawImage(src, 0, 0) without specifying width/height it draws the entire src region, which in this case is much larger (the canvas is 320x420 versus the img at 185x70). So in the canvas case the browser is doing much more work, ...


9

It’s important to note that changing the co-ordinate system with rotate and translate do not affect anything that’s currently drawn into the canvas. It only affects subsequent drawing actions. var TO_RADIANS = Math.PI/180; function drawRotatedImage(image, x, y, angle) { // save the current co-ordinate system // before we screw with it ...


8

I have a good feeling that getHP() and getMaxHP() are returning integral values (int, short, long, byte, etc). If so, they should be cast to floating point numbers (float or double) before dividing otherwise integer division will take place, causing the health scale to be either 1 or 0 and nothing in between. This also goes for this: 120 * (int)healthScale. ...


8

Delta Time is used to make your game speed constant, independently of framerate. If your game starts to get "heavier", it will start to slow down in framerate on less powerful android systems. For example, if you made it to run on 60 FPS, an Android cellphone that can run it at 30FPS will have the game slowed down by 50%! By including the DeltaTime in the ...


8

Renderer apart, consider reading the following articles to understand how older systems implemented optimal tile-based map traversal: Tile-Based Games FAQ version 1.2, and Tile Graphics Techniques 1.0 They're indispensable guides for implementing tile based games on systems which may have limited resources. In terms of today's technology, HTML5-based ...


7

Here's how I would suggest handling it: First, have your Player class store a variable, jumpForce, which is a 2D-vector similar to velocity and gravity. Now, also have a constant, initialJumpForce, which is the immediate force that will be exerted on your player when the jump key is first pressed. When the jump key is pressed, and the player is grounded (...


7

Generally, this advice is given not because of abstraction or code cleanliness but rather because gameplay logic that is sensitive must be simulated by an authorative server to prevent cheating and hacking. Long story short: If you don't particularly care about players hacking their score - don't bother. If your game is multiplayer, then you should looking ...


6

Completely depends on the type of game, although canvas fits "most" of them. DOM management gets horrible at a certain point, the more elements you got the slower, the more elements you move around THE EXTREMELY SLOWER. Managing asset loading order with IMG elements is... non-trival (intercept errors on purposely broken protocols on the image tags :D ). ...


6

Rendering in most games takes place within a loop (the game loop) and in each iteration of the game loop the entire backbuffer is cleared (in this case your canvas) and redrawn from scratch. The term dirty rendering is referring to a technique where instead of clearing the entire canvas every frame, you only clear it on demand (i.e. only when something ...


6

Many games do use an array of arrays to represent a level. It's possible that you could have poor performance with massive or infinite maps of open worlds if the entire map is in memory; a solution for that is to keep only some portion of the map in memory and load/unload map portions as the player(s) move around. If you're just beginning to write small 2D ...


6

2D tile maps are exactly how they sound, imagine something like this: 1,1,1,1,1 1,0,0,0,1 1,0,2,0,1 1,0,0,0,1 1,1,0,1,1 This the design of our map and if we take 0 = floor 1 = wall 2 = chest Then you can see that our map is a room with an entrance and a chest in the middle of the room our data structure for this could be like @georgeK said an Array of ...


6

As far as 1) you'll need to use a toggle state. Fire ONLY if the user did not click the previous tick, and is registered as clicking this tick. This can be thought of as the rising edge of the click state. here should the fire logic be called ^ clicked ___ not clicked ___| For 2) it seems that your update() ...


6

It is not possible to apply an affine transformation to the tile and get the result you want, because affine transformations preserve coplanarity, whereas the shape you need is not flat in the 3D world. Even if you got the outline to match (which can be done), the texturing would be all wrong and cause seams at the junctions. I suggest splitting the tile in ...


6

I don't know what you think is wrong with those two approaches - both seem fine to me. The only thing you have to watch out for is that you don't draw your whole world offscreen. Drawing offscreen is relatively cheap in most canvas implementations, but iterating completely through your data structure which stores the world data likely isn't. So before you ...


6

I think the most effective way would be just to fake it. Rendering to some target element using your own built in sprite font as if you're rendering a normal 2D screen. This approach makes sure no strange stuff happens when people are missing fonts, or are using a very different language (Chinese, Russian). Fonts and texts are one of the most difficult ...


6

This page contains an excellent list of optimizations that can be made to canvas. In the section labeled "Use multiple layered canvases for complex scenes" it describes why having multiple canvas objects is actually better in many cases because you don't have to redraw large expensive objects (background images) as frequently as smaller, fast moving ones (...


6

Instead of using an ImageView and transparent GLSurfaceView you should instead render your background using a fullscreen quad (just like you do with your sprites, but sized to fit the entire screen). Render this fullscreen background first (very important) and then also remove the gl.glClear(GL10.GL_COLOR_BUFFER_BIT); call in from onDrawFrame. You no longer ...


6

Instead of testing the collisions ON the player, you should testing them AHEAD, to check whether there's a wall where the player WILL be walking. To do that, you'll only need to change 2 things: 1- Your player.collision function should accept two arguments: an x and y offset. You should add them to your collision checking algoythm too. 2- When calling ...


5

There is no need to double buffer html5 games. The browser already handles this for you by only updating the canvas object after your script has run. http://www.mail-archive.com/whatwg@lists.whatwg.org/msg19969.html


Only top voted, non community-wiki answers of a minimum length are eligible