Forums » Impact Engine » Ejecta: Creating resources for several iOS devices

I've made a game with Ejecta - but I prototyped it using my ol' 3GS... Now I want to do the real art for it, and am wondering the best way to target retina iPad and iPhone, as well as non-retina iPad and iPhone.

I'm assuming I'll need to make 4 different versions of everything - but I'm wondering how to best handle that in code: do I have to change all my magic numbers for tile widths for each device - or are there any handy retina tricks that just render different images, using the same code (like on the web with the x2 images)?

My home-made physics will likely be affected too - because a force of "2" will be different on a retina vs a non-retina device, so ill have to double everything, right?

Any tips or tricks would be greatly appreciated!

Making 4 different versions sounds overly complicated.

By default, Ejecta already uses the retina resolution when available. However, this is not directly "exposed" to you.

Ejecta resizes the screen when it's first created. That means if you specify your Canvas to be 480x320 pixels, Ejecta's internal resolution will be 960x640 on a retina iPhone. So if you want to draw at retina resolution, just draw all images with half the size - or, specify that you want your canvas to be 960x640 in the first place.

Again, the canvas width and height you set is only the resolution exposed to you. The internal resolution may be different. As another example, you could also request the canvas to be 240x160, and Ejecta will scale canvas up to fill the screen.

You can read a bit more about this all here.


So how you handle different resolutions entirely depends on your game. Maybe it's ok to have all images in 2x size in the first place - even on non-retina devices (where they will be drawn with half the size).

However, if that causes performance or memory problems, you may still need two versions of your graphics.

The different aspect ratios between iPhone5, iPad and older iPhones should not require you to make another "version" of your game. Just set the viewport size accordingly: see this article for an example.

Somewhat related, I just pushed some changes for Ejecta, that will enable it to automatically load @2x images.

E.g. this img.src = 'background.png'; will load the background@2x.png when running on retina devices and the @2x version is present. It will behave exactly as the normal res image.

You can get the latest Ejecta dev version from github:
https://github.com/phoboslab/Ejecta

Hi All,

How does one deal with iPad retina resolution which is 2048-by-1536?

Does ejecta pick up @4 images?

Thanks in Advance

DavidH:

Images use @2x based on pixel density, not window size. You can read the width and height of the window using window.innerWidth and window.innerHeight if you need to determine your device window size.

Do AnimationSheets and Impact.Image also pick up retina(@2x) assets automatically?

Also, do you need to bake the code? Will it help the performance or does it not matter?

Baking the code only improves performance if your game is web based (because the requests/download time). For impact, you won't see any performance improvement, but it still is a good idea to bake and obfuscate it with an external tool because anyone with a jailbroken device can see all you have inside your ejecta game App folder.