UI Design - Prototyping

Recently I was looking for a tool that I could use to mock up UIs. Prototyping of UIs and getting user feedback is an exercise that developers often overlook - but is extremely important - because the interface is the "application" as far as the user is concerned.

Typically - I have used a paper and pencil for UI design prototyping.

Why is prototyping using a simple tool important? If you expend a lot of energy developing a UI - especially via code - then it becomes very hard to let it go. A simple form of prototyping - allows you to get a feel for the interface with the least amount of energy. In addition - it allows you to gather feedback and constantly rearrange and add UI elements to get an interface that you users want - and allows for a productive workflow.

So what is important during prototyping?

1. Should require little effort to create and change
2. Should allow you to explore and iterate over the design with your users.
3. If using a tool - it should be simple to use by developers as well as end users and other stake holders in the project. (which is why paper or a white board will never become old fashioned)
4. Whatever you use - it should be able to communicate your idea universally to all the project's stake holders.

The following video - a presentation by Manuel Clement - shows how one can use PowerPoint for prototyping. (He calls it wireframe prototyping)

http://www.microsoft.com/expression/events-training/globalevent/player/Default.html?South-Korea_Manuel-Clement_Keynote_Wireframe-Prototyping-Using-PowerPoint-2007=Manuel_Clement=Wireframe-Prototyping_Using_PowerPoint_2007

I like the idea of using PowerPoint - because you get a softcopy that you can save, email and use as a tracking tool of your project's design history. Paper is still useful - especially as a first step. (I remember using PowerPoint 2000 when I took a UI class for the purpose of designing a touch-screen ticket kiosk for a public transportation system - and the results were pretty good - allowing for non-linear progression through screens).

As a follow-up I found this website - that provides a download of a power-point file from which you can copy and past commonly used design controls like buttons, scroll bars and window elements.

link:http://www.istartedsomething.com/20071018/powerpoint-prototype-toolkit-01/

The following article has some useful steps on configuring the master slide which will make prototyping multiple dialogs/screens quicker - by creating the basic canvas on the master slide.
http://www.jansfreeware.com/articles/misc-prototyping.html