another image resizing question

Solar2D General Questions/Discussion
#1

Hi everyone,

I’m not a good artist and while i can do lots with code, when someone starts talking to me about “just change the resolution of the images” … i go blank.

I have been building an app for iPad (mini)… it is blurred on iPhone 4.

Is there some basic way i can re-size the images for other screen sizes?

I did hire someone to do this, but aside from writing an extensive config.lua and telling me to just change the images… i am still left with the problem.

Can someone kind please tell me how i should change the images?

Also should i start at the smallest device and work from there or at the largest and go backwards?

We currently have an iPad mini version looking quite nice… where do we go from here?

Thanks,

Jez

(ps. Android users are not being considered at this point / version).

#2

Hi Jez,

If you want sharp graphics on HD/Retina screens, you will need at least two versions of each image, and a proper config file to handle which to display. This remains the best way to handle this, and if you hired an artist to create the art, hopefully they can provide you with the necessary files.

If you didn’t see the recent tutorial on this, here it is:

http://www.coronalabs.com/blog/2013/09/10/modernizing-the-config-lua/

iPad Mini is the same resolution as the iPad 1&2 (768x1024) and the iPhone4 is 640x960. So, I’m not sure why images are being blurred on the phone, when that screen is actually a tiny percentage smaller.

Hope this helps,

Brent

#3

Thanks Brent.

I am happy to create as many images as needed, but right now we have not touched any HD devices, and what it shown on the iPad mini is sharp and on (2 separate) iphone 4 is very bad.

I think it may be something to do with the compression used to re-size?

We tried to start with large images but it seems that was not the best way to go.

If i understand the tutorial correctly, i need to make 3 sets of images.

  1. for the 320x480 base screen

  2. another at 1.5 x as big

  3. another at 3.0 x as big

Is this correct?

Thanks,

Jez

#4

Hi Jez,

You’ve got the right idea, but there is no “strict” method to follow in regards to image scaling. Personally, I find minimal purpose in supporting 320x480 anymore… devices in/around that resolution are essentially phased out now, so providing a full set of images for that resolution doesn’t make much sense. What you should do is pick a good, solid target size for the device you really want your app to look great on… for you, this sounds like the iPad Mini, which is 768x1024 (same as the iPad 1 or 2). Then, you would probably want to design an @2x image set for the Retina iPad and other HD devices, of which more and more are being released to the market (new Nexus7 and 10, upcoming Amazon X-HD tablets, etc.). These images would be optimized for a display of 1536x2048.

Hope this helps,

Brent

#5

Thanks.

#6

Hi Jez,

If you want sharp graphics on HD/Retina screens, you will need at least two versions of each image, and a proper config file to handle which to display. This remains the best way to handle this, and if you hired an artist to create the art, hopefully they can provide you with the necessary files.

If you didn’t see the recent tutorial on this, here it is:

http://www.coronalabs.com/blog/2013/09/10/modernizing-the-config-lua/

iPad Mini is the same resolution as the iPad 1&2 (768x1024) and the iPhone4 is 640x960. So, I’m not sure why images are being blurred on the phone, when that screen is actually a tiny percentage smaller.

Hope this helps,

Brent

#7

Thanks Brent.

I am happy to create as many images as needed, but right now we have not touched any HD devices, and what it shown on the iPad mini is sharp and on (2 separate) iphone 4 is very bad.

I think it may be something to do with the compression used to re-size?

We tried to start with large images but it seems that was not the best way to go.

If i understand the tutorial correctly, i need to make 3 sets of images.

  1. for the 320x480 base screen

  2. another at 1.5 x as big

  3. another at 3.0 x as big

Is this correct?

Thanks,

Jez

#8

Hi Jez,

You’ve got the right idea, but there is no “strict” method to follow in regards to image scaling. Personally, I find minimal purpose in supporting 320x480 anymore… devices in/around that resolution are essentially phased out now, so providing a full set of images for that resolution doesn’t make much sense. What you should do is pick a good, solid target size for the device you really want your app to look great on… for you, this sounds like the iPad Mini, which is 768x1024 (same as the iPad 1 or 2). Then, you would probably want to design an @2x image set for the Retina iPad and other HD devices, of which more and more are being released to the market (new Nexus7 and 10, upcoming Amazon X-HD tablets, etc.). These images would be optimized for a display of 1536x2048.

Hope this helps,

Brent

#9

Thanks.