Designer’s Guide – Android Launcher Icon Template

Last week we’ve talked about exporting graphical elements for Android apps for multiple DPIs with the use of a simple Photoshop action, making the process much quicker and easier. There is however one other icon that does not respect this particular pattern so this week we’ll be addressing the Launcher Icon aka the App Icon.

Why create another template?

I’ve been using PixelResort’s iOS app Icon Template for a while now and cane to the conclusion that despite the fact that I would be able to quickly export an app icon for the iPhone or iPad, I was not doing the same thing for Android devices. So I decided to quickly make one.

There are a few differences between the iOS app icon guidelines and the Android Launcher Icon ones. Most importantly, the icon should have a distinct shape, despite it’s popularity the square with rounded corners is not exactly what one expects when looking for and Android app. There’s also the idea that it should be 48*48dp in size, meaning that depending on the device screen DPI it’s going to be 144px, 96px, 72px or 48px wide… or if you want to go even lower, 36px wide for LDPI. That last one however is no longer in use now that the 4 DPIs have now shifted one higher to include the increasing range of XXHDPI products on the market. There’s also a small padding area around the actual icon that’s included within the 48dp*48dp size.

In the PSD file you’ll also find a small preview, to see how your app will be displayed on the Google Play site and while I have been contemplating the idea of showing the icon on a smartphone as well, due to the variety of backgrounds available I’ve decided that it may be a less optimal influence on the creation of your launcher icon. I’ll need to follow the guidelines on this one and make sure your launcher icon is clearly visible on any type of background.

How it works

Within the download you’ll find a PSD with the icon preview at the required sizes. What you need to do is to edit the smart object labeled EDIT THIS SMART OBJECT (obviously) and the icon you create will be automatically resized to the required sizes. Now, Google Plus requires that we submit a 512px*512px icon for display on the store but because we want to future-proof our icons, I’d suggest working at double that – 1024px*1024px (which is also the size of the smart object you’ll be editing). There’s also an action included that will quickly hide unnecessary layers and quickly export the icon itself.

Alternatives

PixelResort has also released an Android Launcher Icon Template however it appears to export for the older DPI versions, from LDPI to XHDPI while skipping the newer XXHDPI one.

There’s also an icon generator on the Android Asset Studio but if you’re like me and prefer to do the graphical editing in Photoshop, you may prefer our little bundle.

Of course, there’s also the option of exporting the icon yourself.

Remember, if you  want to keep up to date with all the mReady articles and lots of other cool stuff, be sure to follow us in Facebook.