Designing Android Interfaces

March 2, 2011

One of the issues that has started to annoy me as Android has started to game momentum commercially is that a lot of Android apps are just a copy of the iPhone application. This issue occurs on iOS as well, as a lot of iPad (compatible) apps are just scaled up iPhone apps, however this is a really bad practice. Android has a lot of different ways for users to interact with an application compared to iOS (physical buttons and sometimes even a physical keyboard), and developers should really take advantage of these. This isn’t really helped by the fact that there isn’t really any good first party documentation on standard design patterns used in Android.

Over the last week I have been working on creating a nice interface for an Android application I am working on. I have had absolutely no design experience before (that is worth mentioning, anyway), however I have wanted to learn so I thought this would be a good opportunity. I have spent a lot of time researching Android design patterns and come across a few nice tools and resources, so hopefully this will help avoid the issue Android apps being blatant copies of iPhone apps in the future.

Android Patterns

I don’t know how I haven’t come across this before, but speaking to other Android fanbois I am not the only one. Android Patterns is a wiki providing a nice graphical overview of interaction patterns on Android. This is very much aimed at designers, so if you are are designing your first Android application (especially if moving from iOS) this is a must-read!

Android UI Design Patterns

This site provides a nice review of the patterns used in popular applications. It provides a nice critical review, so it is easy to see what worked and what didn’t. The site seems to be quite new, however it is being updated quick regularly at the moment. Hopefully this will continue, there are quite a few apps I would like to see reviewed.

Pencil + Android templates

Pencil app:

Android templates:

Pencil is a nice user interface design tool, that runs inside Firefox (euggh…). It is quite easy to use, especially if you aren’t a Photoshop expert like me. I expect there are Photoshop templates for Android same, but I liked this as it was easy to learn. Last night I managed to design a couple of screens in less than half an hour, it is definitely a lot nicer to see the actual mockup rather than messing about with an XML template to try and get something looking nice. Also DroidDraw just isn’t worth the effort (sorry!), compared to this.

That’s about it for now, I’ll try and keep this updated as I find new resources. If you have any that you think would be useful feel free to post them in the comments.