This month’s topic… *What is user experience? July 2011

Introduction

Here at With, we’re a little obsessed with a concept that we like to call ‘good internet’. Good internet is that deep down, happy, warm feeling you get inside when you’re using a website and it “just works”.

It’s intangible, ethereal and hard to vocalise what exactly is behind this feeling, but it is there and it makes a big difference.

Contrast this with the feeling of frustration you get when using a ‘bad website’; one that doesn’t really seem to be working the way you want it. Whether that’s due to speed, illegibility, incomprehensibility or a thousand other smaller details – we all know there are many ways that computers can annoy us, but what makes the difference between e-rage and a site that we love to use can often be very hard to pin down.

It is this void between you and the interface you are using (be it a website, app, game, cash machine etc) that User Experience design aims to address. This is not to say we can dictate the experience that a user has, but we can plan for it to be as good as possible given a set of scenarios that are likely to occur.

A fictional case study

To illustrate our point more clearly, we devised an entirely fictional scenario in which a design agency (Blob) and technical agency (Technobits) are working together to fulfil a brief for their (also fictional) client.

The client, Hildebrands, a premier London-based tailors, wishes to expand its’ service to customers by providing a new online member’s section wherein users can check the progression of their finely made goods.

After several months designing and building the new members section, only a small number of tasks remain. The most pressing of these being a login screen so members can actually access the new system.

The login screen is designed by Blob and sent for client approval. Great work! The only feedback is for some extra copy to help users of the old system and a telephone number to ring if there are any problems.

A few days later, Technobits deliver version 1.0 that adheres beautifully to the new design style, and that they are confident fulfils the functionality requirements that the client requested.

Have a play with the version 1.0 login page below to get a feel for how it works. Try wrong passwords / usernames / and tabbing between text fields, everything you would do in a real environment. The username and password is demo@demo.com and demo but also see what happens when you enter the wrong information.

A user’s bad experience…

A few days later, the CEO of Hildebrands, makes an irate phonecall to Technobits. One of his loyal customers had been using the new system and was unable to login. Even more unfortunately, this particular customer had recently placed a large order, which they have now cancelled out of frustration.

Mr Hildebrand demands answers as to why the login process is so tedious, and Blob defer blame to Technobits, for not implementing their designs to a high enough standard.

In a move to remedy the situation, Technobits and Blob agree to hire a User Experience (UX) designer to plan a better user flow for the login screen, with aim to lower customer frustration levels.

After a few hours work, the UX designer highlights a list of problems with the version 1.0 login process:

• Too much copy – important information is not clear
• Using the tab key to move between fields does not work as expected
• Both input fields clear completely after unsuccessfully logging in; this aggravates users who may have only typed their password wrong
• Login and cancel buttons have no distinguishing prominence
• The ‘Enter’ key does not submit the form
• Forgotten password information details are hard to find and the language used is confusing
• Errors are useless to the majority of users

The UX designer concludes that these issues must be resolved in order to provide a level of digital service, that is equivalent to the physical experience within the physical store.

After several days working with Blob and Technobits, the UX designer provides the following functional demo. Again, the username and password is demo@demo.com and demo but also see what happens when you enter the wrong information.

Along with the demo, the UX designer provides a list of the features added, changed and removed:

• The design of the form is simplified, the unnecessary cancel button is removed and the login button is made especially prominent
• A helpful and simple support message is displayed after the user enters a username and password incorrectly 3 times
• Using the tab key to move between fields works as expected
• Clear and useful notification when a password has been entered incorrectly – revealing the ‘forgot password’ link only when necessary
• Legible error messages

After some lengthy user testing, Blob and Technobits agree that the new version is much more likely to aid users with the login process.

To conclude our tale

Naturally, this is an extremely simplified scenario focusing on a small (although important) piece of functionality in a project where budgets and deadlines are not a factor, but hopefully it has highlighted a tiny amount of what ‘user experience’ is, and means to users.

If possible, user experience should be considered throughout the whole development process of a system, from project requirements to build and testing.

When we have good customer service the experience sticks, we share it, and go back to the business again and again. User Experience is the same and we know the only way to make ‘good internet’ is to pay attention to every experience every website user is having.