justinteractive

Working as a user experience consultant across many complex domains I’ve never been afraid to ask what some may consider ‘dumb’ questions. Granted, I’ve occasionally had to deal with peers puzzling over why I even asked that question but I always respond with the tenet that ignorance is a blessing.

Many agencies will search for consultants who have extensive experience of their projects specific subject matter, yet, I find this approach somewhat mis-guided and of itself, naive. Interviewers who think they know the topic they have been tasked with investigating are prone to making assumptions that inevitably pollute the actual user research. Precisely because I approach the research phase as a total newbie, the ‘dumb’ questions often reveal critical design insights that would have otherwise remained hidden.

Don’t be afraid to ask the obvious questions, but, a word of warning. Make sure you establish your approach and mention up front that you are being deliberately naive in order to better understand the topic or process otherwise your colleagues and informants are likely to think you’re just plain ‘dumb’.

I get asked this question on many occasions, in which order does one sequence action buttons that are usually attached to forms or step by step processes. I guess the answer is, it depends. Jakob Neilsen touches on the subject on useit.com and makes some similarly ambiguous suggestions, so I’ll attempt to elucidate just a little.

I believe that the real answer is not to focus on the sequence but the presentation and consitency. Making a significant difference to the way the buttons are presented will have far more influence on how they are understood than in which order they are presented. Then you have to make sure you are consistent across your site or application.

I’m assuming you want the person to choose ok, save, order or whatever the action is over cancel. With this in mind then focus on presenting your positive action as the primary action, make it look like a button and knock back the cancel as a simple hyperlink. Give enough padding between them to make them distinct but don’t loose their relationship by proximity. Here’s a snippet from a wireframe I’m marking up right now.

There is some research to suggest that, along with field labels being best placed above and flush left with their respective fields, your buttons should also be flush left with the fields and the primary call to action should come first. I’m speaking from a completely western’eyesed perspective here, top down, left right.

Finally, spend some time thinking about the buttons label,  don’t commit a “click here” sin and give it “ok”. What does the button do? If it signs in, signs up, saves, deletes or calls your mom then that’s its label. A little justin-time design if you will.

Your creative director might argue the toss over placement and alignment, but fundamentally I think you want to focus on consistency,  labeling and contrast/proximity rather than fussing over the chicken or the egg.

www.designhotels.com - a mention from the fine chap at Konigi got me browsing my way over to designhotels.com because on the face of it the site looked pretty cute from the screenshot. Unfortunately that was where the affair ended.

Pretty and nicely decorated, sure, but the ux is naff. I choose France as a destination, why do I see just 3 categories, why do none of the categories suggest how many hotels are included therein, there are not even a dozen in total so why this waste of time interim screen?

I view Paris on the map, click a hotel, no visual feedback (tooltip) on which hotel marker I’m clicking, and if i go back - tada - the page has defaulted to it’s view images state. Now I have to re-select the map and trudge through this quagmire of an interface.

A fine example of a designer thinking just making it pretty is design. It’s not, it’s about communication, function, form all working harmoniously. A fine example of good design this website is not.

I could go into way more detail but I won’t life’s too short to waste on bad design

In a great effort to be kind and not simply unleash my discontent at a conference and workshop that I’d consider fit for University students in their first year, I’m gonna’ take my time and edit out the expletives before I publish my take on this ‘lazy’ event.

Expedia, I’m singling you you guys out ‘cos your the site that tipped me over the edge. When you’re implementing a call to action, or adding a link, don’t just make the little text label the link. Use the space, make the whole thing the link. Similarly, if you’ve a list of products, for example, make the product name a link AND the description AND the thumbnail image. I want to just point and click, don’t make me think for a second which of them might be THE link. It’s not difficult, it’s downright simple. C’mon Expedia (ok, I’ll target EasyJet too for the sake of fair play).

It’s not the first time, and I’m afraid it won’t be the last time, that I’m told by a person who is yet to meet me that “you’re production work is outstanding but we don’t see any evidence of your being able to shape a design concept based on solid research techniques”.

Hmm, it’s a bitch for a couple of reasons.

1. I’m seriously failing on communicating my abilities on paper.
2. How did I launch my own software without being able to shape design concepts?

I fall asleep thinking my way through every project from the users perspective, I am the user. I often fear I appear to be rather dumb to my peers when I ask the kinds of questions a user might ask. I watch my non-web-geek friends “doing Facebook”, I question every single process I’m ever involved in. Seriously, it’s becoming obsessive Petrol dispensers, Facebook documentation, dinner menus, the poster on the Victoria line that states (with accompanying wheelchair symbol) “Disabled exit, 100 metres on foot”.

I doubt you’ll meet many designers who painstakingly craft every pixel based on contextual research, interviews and observation. I fear that the industry middle managers believe that understanding users and understanding colour theory are mutually exclusive. Hmm, aren’t they the same folks that think you can’t write code and push pixels?

I get lots of positive feedback about how easy to use or understand my software is, it’s a bitch I don’t seem to be able to do the same thing with my own pitch!

That’s what I’ve been asking myself over my morning coffee. Wireframes are the most requested element of IA or UX design this side of the Googleplex but, I fear there’s too much reliance upon them that they’re sapping truly creative solutions and killing innovation.

The wireframe is the web equivalent of the architectural blue print, it’s where the engineers refer when they’re neck deep in production. It’s too often the place the designers spend way too much of their time and for me it’s constraining great design. Think about the hours a designer or IA slaves over a wireframe, delicately tweaking the boxes and arrows alone at her desk, where’s the rich interaction coming from? Better a team sketching liberally and freely, arguing, laughing and innovating.

I spent a short time bashing out a project with a large London agency where the original IA work had failed to meet the project requirements, we needed to act fast. This is when we piled up the sheets of paper, took over a huge section of the office wall and whiteboard and started our IA / UX mural. We pasted up personas, functional requirements and perhaps the odd competitors interface on one side as a continual source of reference to the stuff which should be inspiring our decisions.

This was iterative design at it’s finest. We sketched, we moved sheets of paper on the wall to tweak processes, we used post-its and tracing paper to layer up AJAX interactions, we were vocal and influential. In this way the designers vocalised ideas, the developers picked them up on the unfeasible details, both teams bantered until beautiful simple and rich solutions were arrived at. This all took just half a day and we had it.

If the team had needed to communicate with other stake holders in other locations we photographed the wall on the iphone and we filmed our Creative Director walking through the storyboards and talking out the journeys. These photos were up on our flickr group and the video landed on Vimeo within minutes.

So what did we achieve? The results were so rich that everyone understood where we had gone and where we had arrived. We knew exactly what we had to wireframe and prototype, we could jump right in and bash them out in no time. Most importantly for me though was the sense that we had focussed upon and achieved the right design. We hadn’t asked how do we arrange the elements on this page, we’d sorted out should this page even exist and how can we make the journeys and interactions flow as seamlessly as possible.

So I’ve invested my valuable time and completed the form, then I click the big submit button.

The next screen is going to be red or green. I want to see a nice big tick, lots of green and why don’t we throw in a cartoon character with the big thumbs up. I haven’t read anything, but I know it all went through.

The alternative is a big red cross, 3 or 4 red words saying oops and that same chap looking glum and dejected. I know what’s happening before I read a word. I’m prepared, no confusion.

So what if I messed up, I know it all went wrong but I’m fixing things with a smile and all’s well with the world.

Icons are restful, they don’t insist on your attention, you investigate them at your leisure, they’re not shouting at you.

Text on the other hand, you must interpret, it cannot be ignored, it must be attended to.

Too many software apps are cluttered with functionality, why, because we can (and features mean business, right?) Well, no, not really. Clean, lean, simple and elegant is the way to go. Problem is those of us who know this aren’t always the owners of the software, we’ve got clients and they’re paying the fees.

So, when you can’t cut it out cos the client wants it in, think about using as many soft little icons as possible for all that clutter that you wouldn’t have included in the first place. Leave the text labels and links for the important stuff.

It’s not ideal, but I think its a step in the right direction.