Since the dawn of time, I’ve been producing user interface mock ups for my projects, using them not only to specify what I’m building, but also to workshop these ideas and concepts with users. They ultimately form documentation passed to developers along with the use cases and data model etc. I’ve always found the process of creating UI mocks quite tedious (cutting and pasting in something like fireworks for instance) and find that the more fidelity I put into these diagrams, the more users don’t provide valuable feedback. They either;
- Become afraid to comment fearing that I will be offended by their input or
- Concentrate too much of trivial issues like the exact spacing between fields in the image, thinking it’s the final UI
High fidelity diagrams offer an illusion of accuracy and therefore trigger these states of mind, and the cumbersome nature of the tools means I wouldn’t work with the users directly on the designs in workshops, so overall I tend to not share the screen annotations with the users directly, preferring instead to use just a whiteboard and then use the formal annotations just for the technical team.
However, this week I’ve got my hands on a tool called Balsamiq Mockups, which is an easy to use tool that offers a white-board type interface and low fidelity design elements. I decided to use it to mock up a new sharepoint data grid control I needed to build:
I produced this in about 15 minutes and it offers a good, low fidelity idea of how the UI should function that I can share with both the technical team and the users. The users will feedback honest ideas as they won’t be afraid to insult the low fidelity diagram and they won’t get bogged down with the details and colours of the UI. At the same time, I can share this with the developers and they won’t lose their initiative on how the forms should be implemented as it’s clearly not that prescriptive.
The tool is very simple to use, is extensible with new control sets from Mockups to Go, exports to a variety of formats, and the different mockups can be linked together. Overall you can use this tool for just about anything. I’ve just bought 3 licences for the analysts and architects on my current project (it’s reasonably priced too!).
The one thing I won’t do though is start using this as a replacement for the whiteboard sessions with the users. Sure, you could easily sit with them and design UI’s on a projector using this toolset, but I just find the whole whiteboard, scribbling and chatting method far more tactile. I’ll document those workshops using Balsamiq though and use that as part of the documentation sets for the technical and business teams respectively.