Ok Im a little confused about developing a UI for iPhone 3, iPhone 4, iPad and web and its DPI settings
A file being sold here is as follows
iPhone 4 retina screen (326ppi) iPad screen (132ppi) web / iPhone 3G (72ppi)
over at NetTuts it says
iPhone: 320×480 px or 640×960 px (72dpi) iPad: 1024×768 px ( 72dpi)http://mobile.tutsplus.com/tutorials/mobile-design-tutorials/iphone-design-templates/
over at on a Wiki and other sources it says:
iPhone, iPhone 3G, iPhone 3GS, and iPod touch 1st/2nd/3rd Generation: 3.5”, 320×480, 163dpi
iPhone 4, iPhone 4S, and iPod touch 4th Generation: 3.5”, 640×960, 326dpi
iPad, iPad 2 : 9.7”, 1024×768, 132dpihttp://en.wikipedia.org/wiki/List_of_displays_by_pixel_density http://www.smashingmagazine.com/2010/11/17/designing-for-iphone-4-retina-display-techniques-and-workflow/
So which is correct? which should I be using?
I think ppi designations are pretty arbitrary nowadays. Just make sure your file is the right size (corresponding to your device screen, 1024×768 in case of iPad). To check if control elements you draw are the right size, you can use Maxivista or similar program.
so basically design all elements in 72dpi and then scale to the screens width is what you are saying?
I may want to add that the file I brought has
iPhone 4 retina screen (326ppi) 783px wide
iPad screen (132ppi) 783px wide
web / iPhone 3G (72ppi) 590px wide
so does this mean that the scaling of the file wont be correct? it is my understand that it will not.
When you are designing for screen, ppi is irrelevant.
All it matters is pixels. Just pixel units. No per inch. Throw the notion of 72ppi out the window, it serves no purpose in this case.
The only that matters is resolution. So look for ‘number’x’number’ and adjust your photoshop canvas size (or whatever program you use) accordingly.
DPI is the physical aspect of the screen. If you design for an iPad and iPhone 4 before, you’ll notice their resolution is very close yet on the actual phone, iPhone screen is much smaller than iPad. That is because iPhone has almost twice the dpi (or density of dots) than iPad.
That is also why you’ll notice everything is much more crisp and sharp on iPhone compared to iPad.
TLDR : Just go via the resolution numbers. Ignore DPI .
^ +1 justjimmy is right
cool cool but Im still left wondering why so many tutorials and sites are saying that you should increase the size by 200% or decrease by 50% depending on which way you are working for iPhone 4.