I'm in the process of creating a Wario-Ware-like game that will be created for browsers first then likely ported to mobile. Here are the different ways I've considered setting up the dimensions of the game:

---Fixed width---

The natural go to, set width and height


  • Easy to manage interaction in javascript
  • Don't have to worry about resizing
  • As a developer I know exactly how it will look and play


  • It might not be playable on all platforms
  • It will almost always not make the best use of all of the space on the screen

---Several fixed widths---

I'm currently leaning towards this approach


  • It can reach more platforms than having just one fixed width can
  • The developer(s) still have full knowledge of how the end product will look through testing on each size
  • It is fairly easy to change the javascript to match the varying set dimensions


  • It doesn't take up the full screen space on many screens
  • Have to develop javascript in a way where it works with several sizes


Consistent dimension ratio, varying actual size. In my case It'd be landscape layout


  • It makes good use of more of the screen
  • The fixed ratio makes developing easier than a non-fixed ratio


  • On certain platforms it may not be playable depending on the dimensions of the game and of the device
  • Interaction is harder to manage in javascript than set dimensions

---Fully Responsive---

I'd force landscape mode if possible and keep a minimum height and width, but other than that it's fully responsive


  • Makes use of the full screen
  • Able to be played on any device


  • A bit harder to manage interaction in javascript

My questions:

What approach is commonly taken when it comes to making dimensions of browser based games? Is there another approach or mix of approaches that I didn't mention that would be useful? It seems that making it fully responsive would be best, but it'd be the most work

I'm also looking for any other advice on the subject

Sorry if this is too broad for this community or if it is tagged inappropriately, feel free to edit as necessary

  • 1
    \$\begingroup\$ It really depends on what kind of game you want to make. Extensive cut-scenes could be difficult to make with a dynamic screen size, anything else should be a non-issue. \$\endgroup\$
    – API-Beast
    Apr 13 '14 at 11:05
  • \$\begingroup\$ @Mr Overgrowth's cutscene editor shows safe-zones for stuff that might get cropped at different aspect ratios. (Not a complete antidote of course, just an interesting related thing.) \$\endgroup\$
    – Anko
    Apr 14 '14 at 15:10
  • \$\begingroup\$ Can someone explain how I can make this less opinion based? I'm having trouble making it so \$\endgroup\$ Apr 15 '14 at 3:20
  • \$\begingroup\$ @Zach Keep it concrete and objective. Whether a technique or feature is worth it is dependent on the game in question, your skill at implementing it and on your subjective definition of worth. Hence effectively only you can answer it. "How do I implement a resolution-independent UI with technology X for a game Y" would be answerable. However, there are a huge amount of resources on responsive web development already and we have a question for doing it on Android. \$\endgroup\$
    – Anko
    Apr 15 '14 at 9:04
  • \$\begingroup\$ Thank you @Anko, I'll keep that in mind. By asking this question I was just looking for existing techniques and insight into how one might more easily use javascript with varying size containers and am unsure how to ask that properly \$\endgroup\$ Apr 15 '14 at 13:13

Browse other questions tagged .