Occasionally I receive an email asking if it’s hard to design and build android applications and what’s the best way to get started. So, I figured it made sense to post a quick how-to on our blog on how to make a design. Unfortunately, I’m not a developer so I’ll only be covering the design aspects of the process. With that said, stay tuned for future dev how-to’s from Froogloid’s master android developer, Chris Pick.
First, chose an application idea that’s do-able. For example, don’t try to invent a time traveling mobile application your first time out the gate :) Once you have your idea, do some research to see who else is offering a similar product. If someone has already built an application that’s very similar to your idea, don’t be discouraged. The reality is, your idea is probably not an original. Study what other people have built and figure out a way to add additional features and streamline the apps usability. Often times it’s better that someone has already built a product similar to your idea so that you can learn from their design shortcomings.
Now that you have your idea, let’s get started with the design. First, if your not familiar with the Microsoft office application “visio”, I HIGHLY encourage you to learn. It’s a simple application that will allow you to create screenshot designs very easily and fast. If you’re a newbie check out the visio how-to video’s on youtube. Here’s one: http://www.youtube.com/watch?v=xmDjmm0btO8 Here’s the best part…. a company by the name or artbitfuls has created a custom visio stencil specifically designed for android UI creation. You can download the stencil here and also see some of the designs they’ve created using visio. Keep in mind that visio is very helpful in regards to designing your layout and picking which android widgets to use. However, visio is not a great tool to design custom buttons and graphics. I would strongly encourage you to use photoshop for this. When designing, don’t try to reinvent the wheel. The android SDK has provided a wealth of existing widgets to use in your design. USE THEM! Trust me, it will make your life so so so much easier! The previously mentioned visio stencil provides graphics of most of the widgets however, go here for a complete list.
When I make design I try to focus on one thing ~ “make the application as user friendly and intuitive as possible”. Here’s a tip: try to find the most non-techie person you know, in my case it’s my girlfriend, and without telling them anything about the application you’ve designed ask them to review the screenshots and provide a play by play on what the application does and how the user will interact with it. If you’ve designed, let’s say, a bowling game and they think you’ve designed a baseball game you’ve got a problem :) It’s best to change your design as early in the process as possible. Otherwise you’ll have a very angry developer :)
Here’s a couple before and after screenshots of a2b. You’ll notice the layouts are very similar but the actual graphics are different.
Visio Designs:


Built Application:

