The web designer's guide to user experience
3rd Jan 2010 | 11:00
Experts demystify the process behind UX design
Planning good UX
User experience ('UX' to its friends) is a term increasingly bandied about.
Currently in that strange position of being excitingly new to many, touted as an essential component of web design process by industry experts and seemingly on the way to becoming ubiquitous, UX also has an air of mystery about it.
This is partly because it's tricky to pin down exactly what it is. When interviewed, industry pros told us the term can be "subjective", "hard to describe" and has come to mean various things.
Dan Saffer, principal at Kicker Studios, was perhaps the most succinct, describing UX as "What a customer perceives while engaged with your product and a way of looking at a product holistically, from the point of view of a user who likely doesn't care about how something is made, just the product itself."
HAND CODED:Kicker Studios' Dan Saffer thinks gestural interfaces (as seen in Canesta Gestural Entertainment Centre) will lead to a UX revolution
The benefits of UX design
When people talk about UX design for the web, they're referring to everything that fashions user experience: interface design, information architecture, usability and product design that encompasses the presentation, interaction and organisation of online services.
"The process for UX design is therefore about understanding and designing a user's experience from start to finish, not just what a website looks like or how it functions," explains Clearleft's user experience director, Andy Budd.
Once, this line of thinking might have seemed overblown in nature, but as Luke Wroblewski, senior principal of product ideation and design at Yahoo, says:
"Barriers to entry in digital products are very low. There are now so many websites that functionality and technology are baseline features and users differentiate on the basis of how something works – the experience they have with it. When competing services are a click away, managing that experience and giving people something they really want to use goes a long way to getting people interested in your output."
Planning good UX
Good UX doesn't happen by magic: you have to plan for it. "Creating a user experience is a given, but creating a good user experience is hard," says Sjors Timmer, user experience designer at Webjam.
"Human decisions can be irrational, so there's no definitive checklist that we use to conclude whether we trust a site or if it's friendly."
Extending this line of thinking, there's no checklist regarding UX design itself – no set process or series of steps to follow. Instead, you master a toolkit of techniques and learn how and when best to use them. However, Paul Seys, Redweb's head of user experience, thinks it best to start with the client, educating them about the importance of a user-centred approach:
"Clients are keen to see something tangible immediately, but we first need to understand the requirements of the business and the needs of users." If a client needs a nudge in the right direction, Dan Saffer suggests reminding them:
"Customers' thoughts about products are mostly influenced by what they experience and feel while using them. A good user experience creates passionate, happier customers, and you can charge more for products and services that people love and that they consider higher in value. A poor user experience is one that no one consciously cares about and, at best, will lead to loss of revenue."
Approaching UX design
Luke Wroblewski says the UX design process examines various factors. Is the product findable? When you get it, do you understand what it is and then how to use it? And if it works, is it desirable? The specific tools used, suggests Budd, depend on the problem at hand:
"If you don't understand a user's needs or goals, a persona or mental model could be useful. If you don't know how to structure a large amount of content, then use process flows or site maps. If you're designing processes such as checkouts, it's hard to visualise them, so sketch wireframes to enable you to examine how users move from one phase to another."
In terms of structuring the process, rather than dealing with specific problems, freelance user experience consultant Leisa Reichelt of Disambiguity thinks UX design operates at two levels:
"At a strategic level, it's identifying and understanding the audience and finding ways to communicate value with them effectively. At a tactical level, it involves looking more at interaction design and usability problems."
She divides work into two broad categories: generative and evaluative. Generative work is about creation, working with organisations to help design, structure and communicate their offering.
"We do this through research, trying to define and understand the end-user audience, focusing on behavioural traits rather than marketing criteria," she explains. "This can then be structured into audience modelling tools, such as personas, which can be powerful in guiding good UX design."
Reichelt starts with pencil and paper for prototypes, and aims to share the direction she's heading in with clients as soon as possible so they understand the strategy that underpins the UX design. If an organisation isn't on board with this, it's hard to get to a great end product and maintain good UX.
"Understanding who your end users are is essential. When you know what tasks they're looking to perform and their mental models on approaching the site, you can structure and label content to support these things, rather than imposing advanced understanding of content on users who lack the knowledge people within the client's organisation have."
Alexa Andrzejewski, interaction designer for Adaptive Path, suggests thinking of yourself as a storyteller:
"Think about the story you want to tell at each point in the design process. Early on, convey the experience of using a product or service without getting into design details – in first person, answer 'I love this product because ...' or 'this product is like ...' On understanding this, tell the story of how flows, screen design and visuals support the experience. Think about the feedback you want at each stage."
VISUAL AID:Interaction designer Alexa Andrzejewski thinks concept posters "are a powerful way to articulate what the experience of using something should feel like"
Testing UX design
Throughout UX design, testing is important to affirm theories. At Clearleft, designers' web knowledge enables the process to begin in-house via cognitive walkthroughs – designers imagining themselves using a site – but real users are needed for the best results.
Budd notes that you can test paper prototypes, "which requires a little leap of faith from test subjects, since they're seeing and interacting with paper websites," but Clearleft prefers working with interactive HTML and CSS prototypes, with Silverback recording tests.
During testing, determine a site's key activities and provide testers with set tasks. Watch them perform while they talk out loud, explaining what they're doing or thinking. "Users often struggle at the same points, meaning those components need revisiting," says Budd, who adds that you must realise that such issues aren't necessarily due to lack of ability on the part of designers:
"We're building from scratch complex systems that haven't been built before, for different types of users doing different types of activities. It's hard to understand the headspace users are in, and the only way to do it is to come up with a concept, try it, test it, get feedback and feed that into the design process."
Iterative design is universal in product development, and Budd says the same should be true for the web:
"Go through several iterations of design/review/improve. If you don't, issues with the website will remain but you won't know about them, which could reduce signups and orders rather than optimising to get the maximum return on investment."
Budd is also keen to crush the fallacy that UX design and testing must be costly: "This is perpetuated by a few large consultancies that charge huge fees, but all you need is a pen and paper." Instead of jumping straight to Photoshop, he recommends spending a few hours sketching layouts, functionality and process flows.
"Many designers find that clients change their minds, but clients often only understand and experience a site upon seeing designs, at which point changes might be required on a functional level. Provide process sketches before putting effort into design and you'll save time and money. Even if your process isn't exhaustive, some planning is always better than none."
Luke Wroblewski adds that group testing also needn't be expensive: "Try guerrilla usability testing: with just eight people, you'll be able to find pretty much all the problems with your app."
Analytics can also be useful. "If you're a small developer shop, write code to send data back about how people are using your app and use the information to fine-tune things." Should the budget expand, you can look into things such as eye-tracking research and focus groups, but, ultimately, UX testing is mostly about getting people to use your app and talking to them about it – not very mysterious, or tricky to achieve.
Inside users' heads
When watching people use a site, the psychology behind web design becomes more apparent, with users warming to nice-looking things and recoiling from fiddly, frustrating experiences. Wroblewski likens UX to conversations – good ones make you feel affirmed, confident, free to share and be yourself, but violating social conventions, being pushy and acting desperate rapidly ruins things.
"Learn from human conventions," he says. "It's not about you. Don't move too fast. Don't make people wonder. Become part of their world and cheer them on. These things can make people fall in love with your product or service."
Reichelt warns against assumptions regarding human psychology though, because such things are often false:
"It's a big mistake to overestimate how much we value choice. Don't think of everything someone might want to do and delegate the decision entirely to the user, because people aren't good at making decisions when confronted with too many options. Reduce prominent options and channel users down the path you know they're likely to benefit from."
In fact, assumptions cause many commonplace UX problems. Wroblewski says designers often have an inside-out perspective, knowing how websites are structured and allowing this to permeate into the user's world, whose perspective is outside-in, coming to sites and apps cold.
He cites web forms that churn out a database structure, rather than framing things in the way a user wants to achieve a task. Always design from the user's standpoint, not that of the developer or even the client. For example, UX problems often stem from sites being built around a company's internal organisation, which might be alien to anyone approaching the business from outside.
"Common problems also revolve around critical components, such as registration and check-out," says Budd. "So many shopping carts are badly designed, with poor or broken baskets and invasive checkout procedures. People get defensive and drop out, despite wanting to make a purchase."
This, he argues, proves the point that UX isn't just a case of "get a UX person in and they'll make the site a bit nicer," nor even about a level of psychological persuasive design – it's about fundamental issues that can take a failing site and turn it into a successful business.
"The alternative is failing to let users buy," he explains. "Bad design and usability prevent people from spending money and can ruin a potentially successful business."
The future of UX
Ubiquity is definitely in UX design's future, according to many in the industry. Budd's certainly not alone when he says, "UX design has gone from being something a few large agencies do to something of a de-facto standard."
He thinks that in a few years, UX design won't even be a distinct discipline – merely something every designer does while building a website.
But, as with standards-based design, experts will take things further than most. Sjors Timmer reckons that creating usable sites soon won't be enough in itself:
"The question won't be whether or not someone can use a site, but whether they actually want to – understanding and influencing a user's behaviour using lessons learned from psychology, sociology and marketing will become increasingly important online."
Budd agrees, adding that most UX companies have already mastered the idea of planning an experience for the user and will soon start making sites more persuasive, employing skills that "understand the triggers that affect people, and designing less on a service level and more on a psychological level."
If this all sounds a little highbrow, he helpfully adds: "Essentially, this is about understanding what makes human beings tick and designing websites in a way that both pleases and satisfies them."
UX design may also permeate into other business processes. Since designers are strong problem-solvers, it's conceivable that they'll become more involved in strategic business planning.
"It's all part of thinking holistically," argues Andrzejewski. "People increasingly recognise that the experience isn't limited to just a website, but rather every interaction you have with a company, from its Facebook page to a mobile application. Components exist in a larger ecosystem and must work together to create an experience that's more than the sum of its parts."
And in an industry reliant on technology, Wroblewski recommends not forgetting how interface innovation affects UX: "We've moved on from people learning things specific to interfaces – from punch cards and command lines, where you learned how they worked to input into the system, to GUIs, to natural user interfaces."
With the iPhone and similar platforms, he says, content has become the interface; intuitive gestures and augmented reality enable easier access to content, reducing the interface overhead required to achieve something.
Increasingly, complexity falls to the system design, relieving your users of the burden of learning the system. "Flicking a photo to see another is natural and intuitive, but behind the scenes lots of things work hard to enable this," says Wroblewski.
"But complexity must go somewhere – you either put it on the system's users or absorb it within the system itself." The latter is what UX designers will have to be increasingly mindful of.
First published in .net Issue 196
Liked this? Then check out How to design perfect website icons
Sign up for TechRadar's free Weird Week in Tech newsletter
Get the oddest tech stories of the week, plus the most popular news and reviews delivered straight to your inbox. Sign up at http://www.techradar.com/register