Welcome to our App of the Week series where we highlight Smartphone and iPad applications for business.

Do you own a small business and are thinking about creating (or updating) your website?  As you go through the process of deciding on a domain name, finding appropriate hosting and determining what your target audience wants to see, the planning quickly moves to the “look” of the website. Even if the plan is to hire someone to build the site, most businesses start with a concept or simple drawing of what they want their web presence to be.  Web professionals call this initial design a wireframe.

(click image to enlarge)

A website wireframe is a simple layout that illustrates basic elements of a web page without the use of artwork or color – basically the building blocks of a website.  It’s similar to a house plan, but instead of showing the walls of a kitchen, bedroom or dining room, the layout shows page sections, web buttons, video or picture locations, text areas and navigation elements. The artwork, images and color (collectively considered the site branding) is then created based on the wireframe in order to keep the site consistent and user friendly.

The problem is that many wireframes start out as drawn on a piece of paper (I’ve done a few on the back of a napkin over the years!). Great for jotting down quick ideas, but difficult to share. There is also the option to use programs such as Microsoft Visio or Photoshop, but unless you use them regularly they can be challenging to use fast. Then came the iPad.

iMockups for iPad ($9.99 from the iTunes store) is a website wireframe application that appeals both to occasional users (such as those with ideas to update their business site) as well as professional web designers.  Being specifically designed for wireframing, the app makes the process very friendly.

(click image  to enlarge)

For the novice

iMockups has a very short learning curve.  It is possible to understand the basics of the application and start drawing your wireframe mockup within less than 5 minutes.  Elements are simply dragged on to the page and moved around with a touch and drag.  As you move items in place, red lines will help place components in relation to others – so that everything looks in line with each other and you don’t have to guess at sizing.

(click image  to enlarge)

Here is a nice, short overview of iMockups features and use:

Once your wireframe is created, it’s easy to share the concept (via email) with colleagues for feedback or your web development professional as a starting point for discussions (they will have lots of ideas backed with solid experience so take their advice!).

For the web professional

First, it should be clear that iMockups is considered a low-fidelity mockup tool.  It doesn’t offer super complex functions and has a limited palate of elements. It’s all about sections, flow and basic functions so you will have to go more detailed later. However, it is stellar at capturing ideas during brainstorming sessions or rapid wireframing.  It is perfect for recording that late night idea or quickly developing a frame directly with your client.

Currently the export options are limited to only PNG image or a save to your iPad gallery.  It makes the design process solo as it becomes impossible to send a work in progress to another colleague for edits. According to the iMockups support site, plans are in the works to introduce export to Balsamiq.

iMockups also has a frame properly sized for iPhone wireframing.  The functions are basic and good for simple application design and mobile site layouts.

(click image  to enlarge)

Bottom line

iMockups makes building a simple website wireframe friendly for both professionals and novice designers.  The interface is easy to use, frames come together fast and the results are easy to share.  It is now my primary wireframing tool of choice to share preliminary concepts with colleagues and clients.

One more item of note: iMockups was developed by Endloop Systems Inc. – a Canadian based company.  It’s great to see a strong application like this coming from a Canadian team.  Congratulations!