Home > Design, Layout, Tips > A Great Tool for Creating iPhone App Mockups

A Great Tool for Creating iPhone App Mockups

For anyone interested in creating an iPhone app but wondering where to begin, I think the best thing you can do is just sit down and lay it out.  I have always been a big fan of whiteboards and as of late the huge Post It Easel Pads but these are impossible if you travel a lot and are of limited use when trying to collaborate over long distances.  The answer for me has been to use Balsamiq, a tool that allows you to quickly create mock-ups of both websites and iPhone apps.  With Balsamiq I can work through the mechanics of how an app should work, and visually see the flow from action to action.

iphoneexamples

In previous posts I have suggested to first time app developers the importance of creating proper specs when planning to create an app.  I think mockup tools like Balsamiq are even more useful than making great specs and writing out usage scenario examples.  Not only does it help you better develop your idea but it also gives you the ability to share your mockups with other people instantly.  For example, if you are thinking about outsourcing development or are talking to other team members, Balsamiq will let you share your mockups and convey clearly what you want to do (for info on how to protect your idea with outsourced developers read this post).  And by visually demonstrating the flow of how you want your app to work developers will have a much better idea of what you are looking for.  This will pay off in terms of the quality of developer you manage to get and it will also improve the accuracy of the time and budget estimates you get from developers.

Even if you plan on developing the app yourself, you can benefit from working through the fuzzy parts of your idea.  A mockup tool will give you the simple tools you need to work through EVERY aspect of your app structure before you begin the development process.  This is important because it can alert you to fundamental flaws in your idea or logic before you put the time and effort into building it.

In addition to the sketches of the iPhone and its main interface tools you also have sketches of dozens of buttons, switches, icons and other items that you can customize.  For example, when you drag an iPhone image to the drawing area, a box pops up where you can select whether to include the status toolbar at the top, change the orientation, the background look, etc.  You can even drag call out boxes into the picture as well to insert commentary about your mockup.  Check out this video for an example of what is possible.

Balsamiq includes a free trial version so you can test it out today…give it 5 minutes and you will see how quickly you get the hang of it.

Reblog this post [with Zemanta]

  1. November 24th, 2009 at 16:36 | #1

    Our development team has used Balsamiq for creating mockups and have found that even the less technical (mktg, design) members of our team can easily hit the ground running with this software. It has saved us a lot of time by allowing us to sort out design and functionality related details before coding ever starts.

    It was in this same spirit that we created Mockup, the iPhone app visual prototyping tool. It was released to the App Store yesterday. http://bit.ly/14TR5g

  2. October 28th, 2009 at 21:54 | #2

    A free yet high-fidelity alternative is MockApp. MockApp lets you do your mockups in Powerpoint or Keynote and offers the most comprehensive iPhone UI library in vector format. You can download it for free at http:// MockApp.com/download

  1. No trackbacks yet.