One of the harder steps in the creative process of developing an application is right between the idea’s conception and the baby steps of its implementation.
Sure, you can open Xcode and start populating your screen with preliminary code and interface elements. But if you jump right in, chances are good you’ll get stuck or end up with an application that doesn’t resonate with your original idea as well as you thought it would.
Especially with more complex application ideas, it can be useful to work out some of the general details before you take the leap. What form will the application take? What’s it going to look like, and feel like? Framework or mockup applications are useful to create such an application prototype. They’re the proverbial napkin you use to connect the dots of the idea forming in your head.
Below are three such tools for the iPhone and iPad, with the hope that they will aid you in the design process for applications targeting those same devices.
We mentioned the proverbial napkin above, but inspiration doesn’t always come from staring at a blank screen. More often, inspiration itself is inspired by mundane events, and you won’t always have your iPhone at hand when a solution starts forming in your head. It all comes down to this: be prepared to use anactual napkin.
Whether it’s circumstance or preference that has you prototyping an app on paper, you don’t necessarily have to recreate your doodles on your iPhone manually. POP, an acronym for ‘Prototyping On Paper’, helps you translate your drawings into a functioning interface prototype. Just take a picture of your interface drawings with your iPhone’s camera, and add links between drawn interface elements and other pages in your storyboard.
Afterwards, you can easily share the prototype with friends and colleagues, who can take it for a spin on their iPhone, iPad, or web browser, and leave constructive feedback.
AppSketcher is available for the iPad only, but you can use it to create apps for either platform. The app is aptly named, as it doesn’t provide any preset interface elements. Rather, it gives you a blank canvas which you can use to sketch different views of your application using a number of consecutive pages. This makes the app mostly useful for the design of applications that define their own interface elements and don’t always follow the storyboard app structure, such as games.
As you download the app, you’ll be able to access a number of different coloured pencils with a text box tool. Initially, only three application templates are available: the iPhone horizontal and vertical views, and a blank slate. Similar templates for iPad mockups can be acquired through an in-app purchase of USD 0.99, as can a grid paper template. When you’re done, you can save your app sketches as a PDF, to your Photos, or upload them to DropBox.
If you’re willing to pay a few bucks for a more complete prototyping tool, you should take a look at iMockups. At USD 6.99, it’s priced mid-range, but has surprisingly powerful features. iMockups is only available for the iPad, but you can use it to create wireframes and mockups for web, iPhone and iPad projects.
Populate your canvases using the many included interface elements, with snap-to-gridlines. The latter is very easy to get used to and not only makes iMockups a joy to look at, but gives you a highly professional mockup. The size, position and arrangement of your interface elements can be meticulously fine-tuned using the element-specific controls shown in the screenshot above. When you’re done, send your project files to your colleagues, or export it in PNG or Balsamiq BMML.
How do you work out the initial details of an app idea? Do you tend to use paper or a computer? Let us know your mockup tips in the comments section below the article!