Android design specifically, and mobile design generally.

September 16, 2014 9:38 PM

I have done a lot of research and I can’t make sense of this. I am a newbie mobile android visual designer. There’s no one else I can ask. I'm trying to understand resolution in terms of the android world for a native app design.

I know there’s no absolutes in terms of size due to vast numbers of devices and that it’s all relative, and scalable. That’s all wonderful but at the end of the day, files and comps have to be created and I need to have everything correct. Plus I want to understand.

I am working off photoshop files which are 640x960. The assets in photoshop are vector, so there’s no cause for alarm there, as these elements can be scaled up/down, etc.

The new Material Design assets are in illustrator at 360x640. I can size up those elements to 177.78% when I bring them into photoshop which seems to convert them up to 640 width.

But then when I see charts like this, I get all confused.

1. MDPI – 160dpi(dots per inch)
2. HDPI – 240dpi, 1.5 mdpi size
3. XHDPI – 320dpi, 2 X mdpi size
4. XXHDPI – 480dpi, 3 X mdpi size
5. XXXHDPI – 640dpi

I feel like I should be able to map those items to an X pixel by X pixel ratio, using width as more of an anchor than height.

Is this true and if not, what should I be asking? What do I not understand here? Also, with regards to creating redline docs, can I really just swap pixels for DP?

NOTE: I think I need a version of this with much less detail.
http://developer.android.com/guide/practices/screens_support.html

Help.

posted by happytaco to Technology (2 answers total)

Did you read the Android Developer Guidelines?
posted by devnull at 6:07 AM on September 17, 2014

Best answer: I don't see a clear question here, but I'll try to answer anyway:

Also, with regards to creating redline docs, can I really just swap pixels for DP?

If you're communicating with the person who will be creating the actual Android layout XML, always use DIP and not PX. You only want to care about PX when you're creating actual PNGs that will be built into the app.

I feel like I should be able to map those items to an X pixel by X pixel ratio, using width as more of an anchor than height.

You can map them - 1 Device Independent Pixel (dip) = 1 pixel on an MDPI device. 1 DIP = 3 pixels on an XXHDPI device.

MDPI is, for historical reasons, the baseline pixel measurement. LDPI is a bit weird, because Google claims that MDPI assets will scale down properly, but in my experience, that isn't always true. Anyway, LDPI devices are few and far between in 2014.

Personally, I design assets at XXHDPI (you can ignore XXXHDPI for now - it's just for Nexus 5 launcher icons), and then I use 9-Patch-Resizer to scale the final PNGs down. You can also use Android Asset Studio for certain things, or just have Photoshop or Illustrator do it.

As a concrete example: if you're designing an icon that will act as an ImageButton source, you'll need it to be at least 48x48dip to fit the touch target guidelines. So you create your icon at 144x144px (which is 48x48dip at XXHDPI scale), and when you're ready, scale it down, and it will look the same size on all screens.

Does that help? If you have specific questions, I'll be happy to answer. Here are some useful links for you:

Android Cheatsheet for Graphic Designers
DPI calculator (the Chrome extension is really handy)
posted by cmonkey at 6:36 AM on September 17, 2014