What tools and processes do you use to prepare wireframes and other interaction design documents for iPhone applications?

There are two aspects of the question: one is around tools (“what tool do you/should you use?”) and the secondary question is around process (“how do you go about using your tools?”) I’ll answer the second question first and then the first, second…

The key to starting your design process is simple: know what you are designing. Yes, I’m sure many of you are saying, “Thank you, Captain Obvious!” but I mean it…. Have a vision of what you are trying to design. What problems are you trying to solve? And what I’d the overarching idea behind your design?

The “vision thing” is a tricky tricky thing, and sometimes you stumble upon a theme without realizing it. Since I love movies, one of the things I use to explain this idea is the driving idea of what successful movies are all about. What’s the idea behind Star Wars? “Local farm boy becomes hero, destroys evil empire.” Titanic? “Romeo and Juliet on the Titanic.” The Dark Knight? “Anarchist fights the guardian of order to prove he’s right about people.” A simple vision that is the “through line” that drove what the creative team behind the movies brought to audiences.

Define your vision, and keep it simple – if you want to succeed you need something that is easy to communicate understand and remember – especially for yourself. One key input to that vision is defining your problem. What is the design providing the user? Is it fixing a problem? Is it providing an engaging distration FROM problems? How will people use it?

And since it’s mobile, you need to keep context in mind. If it is a note taking app, don’t focus on formatting tools – make it simple quick and without distraction. Taking notes “on the go” means that other aspects of word processor apps are just not needed. Etc… Look at (and if possible, research) how and when people use their mobile apps to look at opportunities and for potential ideas.

So, once you have your vision, and you understand the mobile context and usage patterns, target your customer. Who is the app for? That is another key question. Let this understanding frame your design, your verbiage and your approach. The more specific a target you have, the more clarity you can work from. I suggest using/developing personas to define user stories around how they would use your app.

Then, sketch sketch sketch… And sketch some more. Design on paper, and if you can, get a collaborator – “peer-designing” is one of the methods I have used to make a good design better. Just be sure to work with someone who you can be comfortable with and someone who is mature in their craft to be able to accept criticism of their design with grace and a collaborative spirit (and make sure you have the same type of attitude, yourself).

Iterate. Do guerilla usability testing. And be willing to question your assumptions and when it comes to your design be ready to “kill your darlings.” don’t be precious about your designs.

I’ll once again state the obvious: if you are creating an iPhone app, have an iPhone. Use it, a lot. Get to know the conventions of the interface, and make sure to support those conventions. Break the rules if you have to, but have a good reason to do. Support the conventions of the device and the expectations of the users.

So, you have done the high-level design “vision” thing, you know what you are going to design and who you are doing it for… You’ve “sketch stormed” and now you want to present it to development and stakeholders (or, if you are a one-man shop, you want to document for future reference). The answer I’ll give is one that may be unexpected:

The tool doesn’t matter.

Use whatever you are comfortable with to document the design. You can use a word processor, a graphic design tool, a piece of vellum paper, photos of whiteboards… The key is to capture the who what when where why of the design. Focus on the Design, not the capture mechanism.

To complete this answer, I’ll tell you what I use and why: I use OmniOutliner and Simplenote to capture ideas, MindNode to create mind maps, Omnigraffle and Axure to document and prototype designs, Microsoft Word for documentation and note-taking, and Keynote and PowerPoint to present and communicate ideas and designs. Your toolset will of course vary – this system works for me, but may (and probably will) change if more and better tools become available.

And remember, a poor worker (and an immature designer) blames his tools. The best design tools support the design process, and doesn’t get in the way. That’s why I recommend sketching – it’s a frictionless way to design that is the simple act of putting paper to pencil.

See question on Quora

Comments are closed.