Which are the best tools for designing for Android? I have my favorites but I'd really love to hear about tools you use and your experiences with them. Please leave a comment!
To kick of the conversation I'll present my favorite design tools. Both of these tools are for drawing wireframes. I don't do visual design at all.
OmniGraffle
www.omnigroup.com/products/omnigraffle
Price per license $99.99
Only available for Mac
Android stencils available for free at: http://graffletopia.com/categories/android
OmniGraffle is my editor of choice for drawing wireframes. Usability of the tool is on class of it's own. The app feels like it is reading your mind when moving components around. The editors guides and helps you by snapping components to their right places almost automatically.
There are Android stencils available for OmniGraffle but they aren't really needed. I personally don't use them and build components using OmniGraffle's shape tools. For icons I simply copy Android icons from Android platform SDK (android-sdks/platforms/android-15/data/res/drawable-xhdpi).
WireframeSketcher
wireframesketcher.com
Price per license $99
To kick of the conversation I'll present my favorite design tools. Both of these tools are for drawing wireframes. I don't do visual design at all.
OmniGraffle
www.omnigroup.com/products/omnigrafflePrice per license $99.99
Only available for Mac
Android stencils available for free at: http://graffletopia.com/categories/android
OmniGraffle is my editor of choice for drawing wireframes. Usability of the tool is on class of it's own. The app feels like it is reading your mind when moving components around. The editors guides and helps you by snapping components to their right places almost automatically.
There are Android stencils available for OmniGraffle but they aren't really needed. I personally don't use them and build components using OmniGraffle's shape tools. For icons I simply copy Android icons from Android platform SDK (android-sdks/platforms/android-15/data/res/drawable-xhdpi).
WireframeSketcher
wireframesketcher.comPrice per license $99
Eclipse plugin available for all platforms that run Eclipse
Android stencils available for free at: http://wireframesketcher.com/mockups/index.html
WireframeSketcher is another tool that I've used in past and still use sometimes. It is an Eclipse plugin so it fits perfectly to any Android developer's desktop. It also has Android stencils that can be used to build more Android looking wireframes but as with OmniGraffle I personally don't use them. WireframeSketcher has a broad list of ready components and icons which is all that is needed.
Here's something I did just few weeks ago with the WireframeSketcher for work (sorry for the bad focus. I purposefully chose that one as I don't want to fully expose our upcoming design ideas yet). It took about two hours to draw all screens needed for a simple user testing for a mid-sized app. The tool is very efficient for this kind of tasks. For final design I still used OmniGraffle though.
These are mine. Which one are yours?
Please leave a comment or participate to discussion at Google+
I've actually been using the Eclipse Graphical Layout Editor for doing mockups (i.e. the one you use to make the actual layouts). It allows me to see how things scale, use imports, themes, styles, and all the other tools I'm used to having available when doing the actual development. I obviously take some shortcuts and workarounds since the rendering is the priority, not the behavior on the device. I then just take screen-captures and composite them with Cacoo.
ReplyDeleteAdvantages: I'm using a tool I'm already familiar with, I'm able to show a "living wireframe" where things scale and move based on different configurations, and the developer gets a quick and dirty starting point for making his own layouts (in some cases they're reusable) which cuts down on dev time.
Disadvantages: it sucks for things "below the fold" since you can't scroll well, it's "scary" for non devs since it relies on an IDE, no easy way to export pngs or pdfs besides just screen-caps.
http://www.invisionapp.com/ is excellent, especially if you have to collaborate with other designers or get feedback from engineers.
ReplyDeleteThanks for mentioning WireframeSketcher. I just want to add that WireframeSketcher also comes as a standalone version, so it can be also used without Eclipse when needed.
ReplyDeleteI'd personally lean towards Balsamiq or MyBalsamiq, myself:
ReplyDeletehttp://www.balsamiq.com/
I'm using Axure RP, and it has been very useful! I export the prototypes in html and then copy them to my Galaxy S ii. Then I run the prototype on the device using the Dropbox html viewer. It's a great tool to do this, since it hides the browser's navigation bar, so the prototype can behave like a real app.
ReplyDeleteI tend to wireframe with a pencil, using android phone templates I printed. I was thinking of buying the android ui stencil kit http://www.uistencils.com/products/android-stencil-kit but it's pretty old now. I wanted to create my own stencil ruler with some ICS UI elements, but I'm still looking for a company that would be able to print and cut it on a flexible plastic ruler (if you've got suggestions I'm open to it).
ReplyDeleteTeehanlax also created a pretty nice .PSD android 2.3 toolkit ( http://www.teehanlax.com/blog/android-2-3-4-gui-psd-high-density/ )
FluidUI is new HTML5 web app custom built from the ground up for mobile UI design. Wireframe or prototype Android UI with drag and drop UI libraries - easily preview designs on phone and share mockups as links. Think you might find it useful...
ReplyDeletehttp://www.fluidui.com
Here is a great free to to prototype android apps http://www.justinmind.com/prototyper/free-edition it's completely free and great to build clickable mockups for web and mobile apps. It has a good collaboration feature as well.
ReplyDeleteFluid UI is now live - dive in: https://www.fluidui.com/editor
ReplyDeleteThanks Ian! That is a seriously cool tool. I wrote a quick post about it to let others know that it is online.
DeleteWow thanks so much Juhani - that means a lot the team here.
ReplyDeleteHi,
ReplyDeleteReally nice post thank you for share information it was so helpful for me go ahead and good lick ^__^
Unfortunately it's been years since Android was created as an OS and over a year since this article was posted and there are STILL no mature android UI/UX tools out there!
ReplyDeleteDeveloping for Android shouldn't be this difficult! I used FluidUI to help mock-up the screens to my Android App but turning those mock-ups into an actual interface is ridiculously over-complicated.
As a designer primarily, I want to be able to build my interface in a WYSIWYG environment and I want my IDE to create what's needed as far as layout xml, styles, assets, etc.
Really? If I want to reference a color name like Red, I have to actually set the color in strings.xml and then I can use the color name? C'mon.
Add to that the fact that the place I'm working for is developing using Mono for Android and Visual Studio 2010. Forget finding articles on Android Mono Devlopment.
I've got Eclipse installed as well as all the SDK's and Java runtime environment, ADT, etc. It's all so disjointed, fragmented and a PITA.
Android interface development shouldn't be this difficult.