If you read my Twitter feed (and, let’s be honest, it’s not like I’ve put any effort into promoting it), you may have noticed that, last week, I was at Tech.Ed. Anyway, I’ve got notes on a number of the sessions and I figured I may as well post write them up in some sort of coherent format. Some sort of coherent format – I’m working from some fairly disconnected dot points here.
The user experience of an application is defined not so much by the designers as by the developers and their time frames. The specification usually defines the features – and if the user experience is simply one line in the spec – “and it should be usable”, that will define how much attention it gets during development.
One trick that designers use is the “squint” test – you squint at the page, and see what draws your eye. This should, ideally, be what your users are supposed to find.
User experience design is not primarily about graphics – graphics can set the tone, but they are the last part of the UX design.
All user interface elements need to be processed by the user, so remove all unnecessary elements – it makes it easier for the user to understand the page. Unlike in school essays, variation should be limited – the more consistent the user interface is, the easier it will be for your users to deal with it.
How many colours should you use. Scott suggested this simple test: rate your graphic design skills on a scale of one to five. Now use that many colours. Background colours should be neutral colours – white, grey, black, navy, blue or brown are good choices. Cool colours appear to recede in the user’s vision, hot colours pop forward. One good way of adding colour is to pick new shades of the same colour. Another trick is to pick an image that expresses the right sort of feeling, and select colours from that.
Some useful sites for colour selection:
- Kuler, ColourLovers
- These allow you to select and search colour pallets. If you select “Create” it will allow you to upload an image and select colours from that, or from a base colour.
- Vischeck shows your UI (or image) as it would be seen by a colour-blind user – a useful check to have.
Scott also suggested a simple test for how many fonts you should use. First, rate your graphic design skills on a scale of one to five. Now, use one font.
Alignments between document elements create relationships. This is a useful thing – but it’s no good if you create relationships between the wrong things.
There are several ways you can group elements besides groupboxes – proximity, similarity, alignment and even just by surrounding them with whitespace. You can add visual weight to an element with the use of colour, size, constrast, irregular shape, and misalignment.
This was a deservedly popular session – both the presenter and his content was great. I enjoyed it greatly and I’ve got to recommending watching Shane Morris give a talk if you ever get the chance.