screen resolution for android and iPhone design in Photoshop

Question

For iPhone an Android design, why we set the psd resolution up to 72? why we aren't using 160 for mdpi and 240 for hdpi so on. And what are the difference in design android app or iPhone app more than 72 res? Just increase the file size and clarity? Please let me know.

Thanks, Arun.

Answer 1

It is better to think about resizable design than fixed design. It is like when you develop software intended to work on regular desktop environment. For instance, Microsoft Word behaves as expected whether the monitor is 1024x768 or 1680x1050; differents parts of the UI behave according to the window size and everything goes well. Therefore, on the mobile, it should be the same.

On the iPhone, the regular screen is 320x480. A Retina screen is 640x960. On Android, there are : 240x320 (rare, on low-end phones...), 320x480 (rare too nowadays), 800x480, 854x480, 720x1280, 800x1280, 1080x1920...

To abstract all these sizes, there is the concept of density. You can leverage this feature to create multiple resolutions of the images that will cater to each group of similar resolutions on phones.

Doing a mobile app is not like doing a website. As on iOS, there are only 2 screen sizes, even only one at the beginning, many people took the fixed design approach which is not the most appropriate. It is important to design well for whatever resolution, and plan in advance how the different UI elements will resize, keep their sizes or simply move. Also, it is wise to let the user use the app in landscape mode, especially if it is compound of standard informational screens (lists, data, figures, maps...). The Android framework has tools to allow such flexibility be implemented very easily : most of the time, it is about putting the images that correspond to different situations in the corresponding folders.

Here is some suggested reading on the topic. Even if you are not a developer, you may be interested in that:

Supporting Multiple Screens

About the resolution in Photoshop : this is relevant only if you work on print media such as books, posters, flyers and such. This setting is here to allow you to say "I want to print high-res (300dpi) on A4 paper and not bother with pixels", letting the software do the conversion for you. The actual 72dp settings means that 72 pixels of your work will be printed on one inch of paper.

Mobile apps is a screen media, created in pixels that will be output in pixels. The dpi setting, or print resolution, is useless and can be ignored for any type of screen media, at least when using the graphics program. The consideration of screen densities will happen once the images will be imported into the Android project.