January 09, 2013 - Comments Off on UX and pencils

UX and pencils

When the field of (Web) User Experience emerged from the more holistic discipline of Web Design during the 2000s, it did so without a set of defined tools for doing the job and only a vague idea of what the job was.

Anyone who troubled themselves with UX knew the purpose of the role: to make an improved experience for people who used websites. However, the methods for doing that were literally sketchy.

Sketchy in that UX started as pencil-drawn pages and scribbles on paper.  Something rough and ready used as the basis of a Photoshop design was easier to amend than the finished web artwork.  This is a cornerstone of UX as a concept and remains best practice.

Pencil sketches, however, are not to everyone’s taste, and soon there was a need to create a higher level of the scribble.  The insane went to Photoshop and started drawing and aligning perfect rectangles. They then went home and watched the tail wag their dogs.

Far better were tools that simulated the sketching process but created something that could be captured digitally. Balsamiq is the brightest example of this.  As a piece of software it does little more than capture your scribbles and it does it well.

Balsamiq’s strength is that it is flippant in what it does – it appears to be rough to allow you to play rough. But, as any man who has spent far too long working inside Lloyd’s TSB will attest, the charming use of scribbled outlines is not received well in the corporate world. The much coveted straight lines and concentration comes in Axure, which is a far more serious beast despite it’s website attempting to be quirky.

Axure is about creating, not sketches as one would on paper or wireframes as Balsamiq might, but prototypes. Prototypes are clickable simulations of websites which can be as intensive to create as the end product. This hints at the difference between Balsamiq and Axure. The first is about formalised sketching, the latter about prototyping. While there is an overlapping in the middle, the tools are deployed to solve different problems.

While prototyping is an aim of the UX process, it is not the final result. Having something to show the customer what we think something will do is the aim, but how we think something will behave and how it does behave can be different things. Sometimes it is necessary to build the site in HTML. As a working model, an unpolished HTML site shows us how the website will react in the real world when users touch it and expose it to many devices and conditions.

When building a modern, robust app, one needs to nail down functionality in a way that does not involve bits of paper with arrows spidering around them. Similarly, when putting together a complex website there is a need to show how things will work in a practical environment.  The problem, such as it is, comes in the over dependence on one of these steps to the detriment of the others.

The over dependence comes when following each step rigidly for every project one works on.  Every project needs UX planning, of course, but not everything needs prototyping.  In fact, unless the interactions involved are in some way remarkable, most prototypes get in the way of development. Use of prototypes can make the preview of the experience one wishes to communicate to clients more like the experience itself, which isn’t necessarily useful.

Wrestling with the Axure template to get it to simulate interactions, which are often self- explanatory, is a poor use of time.  A right click menu looks like a square box on the screen and comes up when right clicking.  ’nuff said.

The point is not what the tools can do, but what one needs from them.  Paper and Pencils give us outlines, low-fi Balsamiq and tools of that ilk allow us to layout content. Axure lets us plan interactions, HTML prototypes model reactions.  If illustrating that step is not significant in what you are delivering then doing it is, by definition, not productive.

That we make the user’s time spend on a website more productive is the ultimate aim of the UX designer. We have a set of tools – many I have not mentioned – which give us the ability to focus on different parts of the process, allocating great detail to what needs most work, soft peddling what does not and allowing us to focus on how best to communicate our vision.