2

Ask DN: Design for Android, where to start?

over 8 years ago from , Co-Founder at zero.london

Hello guys, I've spent the last 6 months designing for iOS and, with the support of a great iOS Dev, I've been able to learn a lot about best practices, to do and not to do things. I'm now about to start designing for Android for the first time and I would like to have from you suggestions, tips and technical requirements you think are essentials in order to produce a quality UI. Your help would be much appreciated. Cheers!

9 comments

  • Alex StevenAlex Steven, over 8 years ago

    It's a great time to start designing for Android! We finally have a comprehensive set of guidelines for designing for Android which can be found at http://www.google.com/design/

    Another great starting point is the Android Design in Action youtube videos by Nick Butcher, Adam Koch and Roman Nurik, although the majority of them don't cover material design they are great at explaining Android best practices https://www.youtube.com/playlist?list=PLWz5rJ2EKKc8j2B95zGMb8muZvrIy-wcF

    Finally, join the Android App Design community on Google Plus https://plus.google.com/u/1/communities/116667001535376136065

    Good luck and have fun!

    1 point
    • Giovanni LupertiGiovanni Luperti, over 8 years ago

      Fantastic! This is a great start Alex! Thank you.

      I spent some time exploring the Google Material resources over the last few weeks (impressed with it from the release). The video resources are fantastic, same as the community.

      Just a more technical question, on iOS - mobile - you design for basically 3 screen sizes (iPhone 4/5, 6 and 6Plus), with Android, supporting multiple screen sizes, what would it be the standard size to design components for?

      Thanks a lot!

      0 points
      • James StorerJames Storer, over 8 years ago

        Hi Giovanni,

        everyone works differently but my workflow for android is to work @1x (mdpi in android speak), for mobile I use 360 x 640px and tablet usually 600 x 960px. The reason I work at mdpi is because then your designs are 1px = 1dp, dips (density independent pixels) are the unit of measure for android. You then can tell your dev this needs to be a margin of 4dp etc. and you know it's right, similar to working in points for iOS.

        I also advocate getting [Layer Craft]("http://lab.rayps.com/lc/") for cutups as it's awesome, you select the layers/icons you want, where you want them saved and it will cut them out at all the required sizes and create the folder structure that the dev wants.

        So working in mdpi (100%) you can easily switch to hdpi (150%), xhdpi (200%, retina), xxhdpi (300%) just using percentages as long as everything is shape vectors and you don't rasterise anything (which no one should these days anyway).

        Nine patches are a dark art and I don't personally use them, but if you read up on them they can be useful for stretchable areas. Although I prefer to have more control over the design and like to use dpi sized drawables.

        Hope this helps. James

        0 points
        • Giovanni LupertiGiovanni Luperti, over 8 years ago

          Thank you James,

          This is extremely useful! I would assume that a 360x640px resolution would be a good start in order to support small screen devices and you would increase the size in proportion moving to hdpi, xhdpi, etc.. So we don't have to design for specific devices for Android? Like most popular Galaxy or Nexus screen sizes?

          If this is correct, what would happen if I want to take advantages of a bigger screen dimension? (Talking just about mobile and not table at the moment)

          Thanks a lot! Giovanni

          0 points
      • Alex StevenAlex Steven, over 8 years ago

        I'd suggest designing at xhdpi - similar to designing for iPhone 4/5/6 as they are around the same density (my canvas is always 720x1280 for phones). When you are speccing redlines it's very similar in concept to iOS - take your measurements and half them to get DP.

        In regards to creating assets I suggest doing them at 4 densities : HDPI, XHDPI, XXHDPI and XXXHDPI. Creating XXXHDPI assets will futureproof your app for all the new android devices coming out. I wouldn't bother with mdpi assets as MDPI devices are pretty rare these days and if someone is using one the system will take the HDPI assets and scale them down. I recommend using this chrome plugin for finding out the sizes you need to create assets at : https://chrome.google.com/webstore/detail/dpi-calculator/dldofgjemhkpilajnlenfijjpkabilcg

        Hope this helps :)

        0 points
      • Alex StevenAlex Steven, over 8 years ago

        One more thing, doing your margin, font and asset sizes in multiples of 4 really helps (you'll notice this a lot in the google design guidelines) - that way you don't get weird numbers when you convert to DP, or when creating assets for multiple densities.

        0 points
  • nabeel khalidnabeel khalid, over 8 years ago

    Get a android phone and download a bunch of apps. See how it works and then talk to any android devs to understand the constraints. Like Alex said follow the material design guide. It covers pretty much everything from fonts, spacing to animations.

    Check out how to do multiple android resolutions and what a 9patch is.

    http://developer.android.com/tools/help/draw9patch.html

    http://developer.android.com/guide/practices/screens_support.html

    Try, fail, understand and try again.

    Good luck and have fun!

    0 points
  • Daniel AdamsDaniel Adams, over 8 years ago

    Beside the guidelines, talk to devs.

    0 points
  • Sander SmeekesSander Smeekes, over 8 years ago

    For inspiration and design guidelines, Google does this very well on: http://www.google.com/design/spec/material-design/introduction.html

    For assets I use: http://angrytools.com/android/pixelcalc/

    0 points