Game Development, Does stage size actually matter?

Report · Aug 25, 2017

Hello! I'm developing a PC and mobile game using ActionScript 3 and Adobe AIR and I'm trying to determine if the stage size could be slowing my game down. I set the stage to be 1920x1080 and checked the "Full screen" option in the Adobe Air 23.0 for Android publish settings, but when I tested it on a smartphone I found it ran sluggishly. I scaled the stage and all its contents to 640x360 and found that the game seemed to run better.

My question is, since vector art looks sharp at any size, and since AIR apps can scale automatically to any phone size, are there any disadvantages in making the stage size as small as possible for better performance?

Thanks for any insight on this matter. I'm a familiar with the coding behind flash games but am learning more how to optimize them for devices so any additional input is appreciated.

Report · Aug 25, 2017

The default stage scale mode will scale the stage up so that you still see all of the content, but it's as tall or as wide as it takes to fill the device screen.

I'm not sure why the 1920x1080 one would perform differently to the 640x360 one, unless maybe if you have some things set to cachasbitmap, in which case they would be make into much larger bitmaps in the bigger stage version.

I tend to work with the stage set to 1024x768, with extra content off the left and right of the stage. Enough to reach out to at least 1365x768. That then scales up or down to fill any device from 16:9 to 4:3. In fact I have it a bit wider than that, so my apps are ok even on the new Samsung devices, that are extra wide.

So, no, I don't think there's an advantage of making the stage as big as the biggest device.

Report · Aug 25, 2017

Thanks for the response! Yes I have my game backgrounds set to cache as bitmap but upon testing it again I don't see much of a difference in performance between 1920x1080 and 640x360 after all. I'm glad I don't have to rescale all the game levels now. I will definitely consider developing apps at 1024x768 in the future.

Report · Sep 08, 2017

1024x768 is just what I happen to use. Following my approach, any 4:3 size would do. So, 640x480 as a stage size and extra content out to 854 wide would be just as good as my earlier figures.

One thing to note (hey, that's a pun!) is that the new Samsung devices are as wide as 2:1. Fortunately in my apps although I said I make sure the background goes out to 1365, it actually goes out further, so I'm ok. For the 1024x768 example, that means I have at least 2048 of background width, and in a 640x480 example you would want to have at least 1024 wide. Then the Note8 will be happy too.

There is another mode, noBorder, that gives you an alternate approach to handling a wide range of ratios. I can describe that if you're curious!

Report · Sep 24, 2017

It's funny how you mention the Note 8, (great pun by the way). I recently got one and I found I did have to add extra content to the edges of the game's background to cover up the stage. However, the extra content isn't visible on narrower screens with the way the camera works in my game. This is perfectly fine since there is never anything important at the edges of the game level but it's just an extra thing to be aware of when designing level backgrounds.

I am definitely interested in hearing more about no border mode as I cannot find info on it on the web.

As well, I now see the advantage of setting the making the game have a 4:3 aspect ratio since you do not need to add extra content to the top and bottom of the game. It definitely saves some work and makes the game more consistent on different devices.

Report · Sep 24, 2017

The iPhone X is even wider than the Note 8.

I did these examples a long time ago:

noBorder:

showAll:

exactFit:

noScale:

You can resize your browser window to see the effect it has. In this case the stage is 4:3, but for a noBorder case I would make the stage be 14:9. With that size you can go out to 16:9 or in to 4:3, and not lose too much off the edges. The advantage is that you have a bigger common area in the middle, but the drawback is that the math to position things that need to be at an edge is slightly more complicated.

Report · Sep 20, 2017

The use of vector is probably the main reason your app is lagging, you can run some simple tests to figure it out, add more of your vector art to the screen and check the fps bump. Mobile dev should be done with bitmap only.