Multiple screen sizing for all mobile devices

4

Index

Stats

19,426 visits, 48,011 views

Tools

License

This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Published on 19 Aug, 2014. Last updated 19 Feb, 2019

About six months ago I had an idea for a (mobile) game. I have programming skills in a dozen different programming languages but was a complete NOOB with Apps. After reading some articles on the world wide web I figured out the easiest way to achieve my goal was to write the App with Construct 2 because I was not limited publishing a game for just one platform. John Bura's article convinced me to use C2 instead of GameMaker, GameSalad or Stencyl...

After a short learning period I wrote the basic game in about three or four days but one thing kept me from publishing. I wanted to publish just one game (free and paid) on the App Stores from Apple and Google and the www that was able to handle all screen sizes in an elegant way. Ashley's tutorial named Supporting multiple screen sizes gave me some insight about the matter but unfortunately not a solution...

I finally found the solution on YouTube, looking for something else. Ed Farias made a Vid named Construct 2 - Screen Resolution as the first part of his course named Construct 2 Mobile Monetization where other NOOBS like me are being told how to make money with their Construct 2 game. The price of the course (I was one of the students) is $29 but you get $5 discount if you follow the link from the YouTube vid. I would like to strongly recommend all beginners to follow this course. Thanks a lot Ed...

So why a tutorial about this matter you might think if there's a solution on YouTube available. Well, actually I made some refinements making it a little bit easier to use this technique. As a matter of fact, I excluded one of the dimensions (height) and with just a variable width and Ed's safe zone the game will be scaled perfectly (tested) on all mobile devices. To understand this I have to explain some things about the Aspect Ratio of mobile devices...

Actually there are just 5 Aspect Ratio's for mobile devices - at the moment -. There are three iOS and five Android Aspect Ratio's. Because of some overlapping there are 5 to handle:

3:2 or 2:3 --- iOs and Android

4:3 or 3:4 --- iOs and Android

5:3 or 3:5 --- Android

16:9 or 9:16 --- iOS and Android

16:10 or 10:16 --- Android

Because my game is designed for portrait mode we use the bold portrait

Aspect Ratio's in the rest of the tutorial...

  • 0 Comments

Want to leave a comment? Login or Register an account!