Pixeling in photoshop vs ratio

Sigh.. Greetings there ^_^

Once again, i have searched for like hours for this and i just cant seem to find the answer!

I want to create a game for Iphone 5 which has the resolution 1136 x 640 pixels and a ratio display of 16:9.

1. This means when drawing a background of 1136x640 pixels, it will exactly fit the iphone 5's screen, correct?

2. Can i draw something in 100x100 pixels and keep the ratio of it when viewed in the iphone5, WITHOUT it changing?

3. Could someone explain the ratio properly? I do not seem to understand it correctly, if the answer for the above question is No, then what size in pixels do i need to draw to keep my character at 150x150 in pixel size?

Thanks in advance!

3.) Everything visual has an aspect ratio, which is the relation between width and height. An iPhone 5 display for example is a rectangle with a ratio of 16:9. That means that for 9 units in height it uses 16 units in width (landscape mode).

2.) Regarding the answer to point 3, why should the aspect ratio of an 100x100 object change?

1.) After answering point 3, it means, that everything with a final output aspect ratio of 16:9 can be displayed exactly fitting the iPhone 3's display. For example, a picture with 8x4.5 cm, a wallpaper with 32x18 inches, a video with 640x360 pixel, or a game with 1280x720 pixel.

The resolution of 1136 x 640 pixels means two things:

a) All visuals with a 16:9 ratio that doesn't fit exactly to that pixel size, will be scaled. Scaling doesn't change the aspect ratio, just the number of pixels used to display it.

b) 1136x640 is not exactly 16:9, it's a bit more stretched horizontally. A true 16:9 aspect ratio would either be 1136x639 or 1137.77~x640.

If you want to support the aspect ratio of the display, just use a size for your game that has a 16:9 aspect ratio and use the fullscreen option.

If you want to support the resolution of the screen, use 1136x640 for your game's size.

In both cases, the aspect ratios of your objects won't change.

If the ratio of the background is the same as the ratio of your phone's screen: yes. Best result will obviously be obtained with a background in the same screen size as the phone's display resolution.

Sure - the ratio of height/width will once change if the screen is stretched unproportionally.

I am not sure where the problem of understanding lies.

If the screen doesn't get scaled and your sprites are at 100% size and their top-left corner has integer coordinates (so not something like 0.5) and your sprite isn't rotated (except 0�, 90�, 180�, 270�), it will not get blurred.

If you enlarge the game's view (because it was designed for a smaller resolution), ofc you will notice some blur.

Nonetheless even if you scale, a 100x100 box will always appear like a square, and not a rectangle, since both height and width are scaled by the same factor.

You are not understand what i mean.

A 2.)

If i draw something in 100x100 pixels. Let's say it is 3 CM. Once important under the retina display it will still be 100x100 pixels but WILL it become smaller, to the eyes compared to when i draw it on photoshop on PC? Since each pixel range on the iphone displays smaller pixels due to the retina display. If you draw a 1136x640 background, it will fit your ihpone 5 screen perfectly which is CLEARLY smaller in reality, but it fits fine due to retina display, it shrinks down. Now the 100x100 will it also shrink? That is the question.

The real size can be found out by calculating: pixel / DPI of the display. The result will be in inches, so if you wanna calculate in SI units like everyone should, then you have to calculate:

pixel / dpi * 2.54 (result will be in cm)

If the game gets scaled (it would on a retina display), you have to take the scale factor into the calculation.

Allright, my drawing of characters are small enough, i don't want them to become even smaller, is there anyway to stop this from happening other than 'drawing them bigger' ? Perhaps save them in a bigger sized transparent background or so? - My point here is that i am worried that my characters will be too small.

I think I understood the question very well:

2. Can i draw something in 100x100 pixels and keep the ratio of it when viewed in the iphone5, WITHOUT it changing?The answer to this question is, as I said, yes, it keeps the ratio, it doesn't change at all.

But that's not what you wanted to know. The question was wrong. So if you make the right question you'll get the right answers.

Now to your new question:

If i draw something in 100x100 pixels. Let's say it is 3 CM. Once important under the retina display it will still be 100x100 pixels but WILL it become smaller, to the eyes compared to when i draw it on photoshop on PC?How many cm a digital image will cover depends on its ppi or dpi value. For digital media ppi is the right measurement, for printing it is dpi.

ppi means pixel per inch and desrcibes the pixel density in relation to its size of a digital medium, like a display. Under Windows you have the option to use several pixel densities, but the most common is 96 ppi. With such a density, a 100x100 pixel image will cover 1.04167 real world inches (~2.64583cm)

The iPhone 5 display is said to have a density of 326 ppi, so a 100x100 pixel image will cover 0.3067 real world inches (~0.7791 cm)

IMPORTANT: The image doesn't shrink! It just looks smaller to the eye. It keeps the same amount of pixels.

I'm no expert in Photoshop, but in GIMP there's a viewing option called "point to point", which makes sure, every pixel of the image fits to one pixel of the screen, when in 100% view mode. If you turn that optin of it will be displayed according to its density. So, if I create a 100x100 image with 326 ppi and deactivate "point to point", I see the image in exactly the real world size, the eye would sense it on the iPhone 5. Since Photoshop is the professional, costly image editing software, I'm sure it has such an option also. I just can't tell you the name, or in which menu it hides. Maybe some Photoshop expert can help here.

So, basically, there is no other way than making them in a higher pixel size, or, as I said in the first post, use a smaller 16:9 resolution an scale it to fullscreen.

I am sorry mate, but i have absolutely no idea what you are talking about. I do not understand you *at all* but i appreciate that you tried atleast :) I mean''use a smaller 16:9 resolution and scale it to full screen''

ehm.. what? Full screen what/where? makes no sense for me sorry, but ty for trying.

Understand that i am new to this, and i am trying to draw something in pixel size and keep it the same size once it is viewed in the iphone 5, NOT pixel size but same inch length. My real question is can you keep the size without drawing it bigger or can u save it in a bigger transparent background size to avoid it being smaller. (not in pixels..)

Greaver it seems it's very unrelated to C2, it's about game design.

I would like to explain about the results, look this:

http://powerupware.com/HTML5/zoompng/

The default on start layout is scale 1.0

Click anywhere to zoom, there are 3 sprites

2 Dark blue ones in left and right and one pink.

the left one uses screen resolution, if we try to zoom, it looks blurred and isn't part of high definition.

the right one uses bigger size than the left one , we try to reduce its size in editor, then zoom again it looks fine but aliased.

the pink uses higher version of bit for PNG (I don't recall about numbers) it looks definetly HD, but it consumes more memory.

I hope you understand this method.

I wrote above that i am new to this.. What resaults will look like what? ''left one uses screen resolution and looks blurred'' .. what do u mean honestly? Screen resolution on the retina display? How can it not be screen resolution in that case? What/How is the difference.......?

I mean sigh.. i dont get any of this.. And yes this is related to C2, because i bought the product and i am trying to create a game for the iphone.. I just need to understand this resolution thing, i keep reading and asking but everyone gives me answers that makes 0 sense to me. Why does this look blurred? Coz of screen resolution.. O.o what is that? is it created by a different software or? I said i am new to this..

No offense intended, but all the people in this thread gave you comprehensive answers. They are as easy as possible. If you still don't understand, you need to learn the basics first. When working with graphics, terms like resolution, aspect ratio, ppi/dpi and size are key to a developer world that consists of a vast variety of display sizes, ratios and resolutions.

You repeat saying you are new to this. Still, it seems you're hoping for an all time, no learning needed solution: There is none. You need to learn the basics. If explanations are not understandable to you, use the old but still valid method of trial and error. Do prototypes and test them, until you achieve the result you want.

Best is to read more about other (game)designers that have to deal with this

found a nice link here, http://www.vickiwenderlich.com/2012/06/how-to-size-game-art/

Wikipedia is your friend if you don't understand words such as display resolution, easy as that.

Pixel doesn't directly correlate to size on the screen, since obviously it depends on how large one pixel is on the device. Maybe you can understand this sentence at least.

If you code in 16:9 in a smaller resolution and scale up to a bigger 16:9 resolution, then the size of your objects will be the same as if you had programmed it for the bigger 16:9 resolution. Only difference will be that it won't be as sharp / image quality will be worse, because you have less information available for each pixel. (talking about raster graphics here)

Hehe you still dont understand me. I know how/what it will look like under the retina display. I am just asking if i can keep the size of my drawing in the iphone aka disable the retina on 1 or 2 objects. Do u understand now? ;) haha

Yes exactly, but that is still not what i am talking about. Ayway thanks for trying to explain ;) gl hf