DPI in Retina iPad app design

问题

I don't know if this belongs in StackOverflow or some other SE site, but here goes.

I have a PSD design I have an iOS development team turning into a Retina iPad app. However, this design is made in the default 72 dpi.

The development team is now saying the design should be 264 dpi (same as a Retina iPad) -- as well as a 132 dpi version for the non-Retina edition.

This confuses me, as I was under the impression that dpi just represents how many pixels go into an inch of output, and therefore would only matter in printing. The dpi of an iPad just represents the number of pixels for each inch of screen, and therefore doesn't according to my brain have anything to do with the dpi of the PSD. Especially since it already is in the 2048×1536 size required for Retina.

I told them this, but they insist, which has made me doubt my own infallibility.

Who's in the right here? Does the dpi of the design file have anything to do with the dpi of the device? What would make an otherwise smart dev team think this?

回答1:

The DPI of your Photoshop file does not matter. You can go into Photoshop and change the DPI to whatever you want. Going from non-Retina to Retina is "sort of" like doubling your DPI, however.

If you've already created a design assuming a 1024x768 resolution for the iPad, you will need to recreate the design to at 2048x1536. Where the concept of dpi comes into play is that the density of data should remain consistent at both retina and non-retina resolutions. You'll just need to recreate each bitmap-based element in your file at 4 times the resolution you originally had if you start with a non-retina file. It is sort of like going from 72 dpi to 144 dpi.

回答2:

You are right.

In a PSD, the DPI is not significant as it only serves to the system to determine how to print the file.

You can always change your PSD's DPI setting to make them happy :) That's definitely not significant.

If set to 264 DPI, a 2048*1536 printed image will be exactly iPad-sized.

And similarly a SD 1024*768 image set to 132 DPI will be same size.

回答3:

DPI/PPI makes no difference when you're working for a screen, it's the amount of pixels on the screen that matter. If you design for iPad at 2048x1536px at 264ppi or 72ppi, it's still 2048x1536px in both cases. The only difference is if you full size the preview in photoshop.

PPI = Pixels Per Inch. If you're dealing with inches, PPI matters because its the density of that size. If you're measuring the document/canvas size by pixels, then the density would be "Pixels per Pixel" and that's just ridiculous.

Just make sure you're designing at accurate or higher pixels so they can be shrunken if needed for older iOS devices, low res Androids, desktop web, etc.

回答4:

Don't forget that an image, with a higher resolution than can be displayed at normal size, can improve the look of the graphic when it is zoomed into. Zooming happens all the time in iOS, especially on the iPhone, because the screen is too small to be really useful and it's just so easy to do.

回答5:

DPI matters greatly. You can't just jack up dpi properly, you must develop at the highest dpi or even better, the proper dpi. For an example why, imagine you're creating a smooth, rounded edge using algorithms from an effect. The level of detail, as it fills in every change in the curve and selects each color gradient will be finer when the dpi is higher. A;though yu can pop in and change the dpi from 72 to 132 or 264 afterward, it doesn't apply the intelligence of each effect, yourself, etc, it simply fills based on what's there. That means you are defeating the entire purpose of the clearer high dpi screen and bringing it down to the quality of 72 dpi.