Flow carried out a set-of contextual interviews with customers of varying shopping frequencies alongside an expert review. Key shopping journeys and tasks were identified in order to focus research on business priorities. During the user research sessions participants were asked to carryout a couple of key tasks across multiple online retailing platforms and were probed to answer questions regarding their expectations and habits of shopping online. The expert review was competitor focused and allowed for several retailing platforms to be assessed from a heuristics perspective. The research and analysis was completed over a couple of weeks and led to strategic findings in relation to how to support different customer mindsets along their shopping journeys.

The insights were shaped into a set of strategic recommendations that will be used by the client to drive the future direction of their multi-channel retailing offer.

A typical newspaper article View large, or large without the overlays

When we look at a typical webpage, the amount of space supporting the reading task is incredibly small.

What is all the rest of the space used for then? Navigation (in yellow), promotion for other sections of the website (in orange), and ads (often animated) for things that have nothing to do with the article (in red).

They each have very different purposes. Ads are here for the understandable reason that they bring in money and often represent the main source of income for online publications. Promotions for other sections of the website try to get me to read more content on the site, which would make me load another page containing ads, earning the site even more money. Some sites take it to the extreme and split even short articles into multiple pages.

Next is the navigation, which is here to help me move to other articles or sections of the site. However, at this point, thank you very much, I am still trying to read my article, and I haven’t finished yet.

Navigation, internal promotion, and external ads. None of these help me read my article. Which, as you remember, is what I am actually trying to do.

Readability

Several months ago, I was shown Readability , an “experiment” from some folks called Arc90. Once set up, a single click could reformat almost any article on the web into an easy-to-read and clutter-free page, only showing content. Even better, I could once again assess how long the article was, and how much I had already read, by looking at the relative size and position of my scrollbar. This was a breath of fresh air, and I have been using it continuously ever since (together with Instapaper for reading later on the go).

Safari Reader

The same page in Safari Reader See large

Recently, Apple released the 5th version of their Safari browser. It includes a feature they call Reader, which:

“removes annoying ads and other visual distractions from online articles. So you get the whole story and nothing but the story” (from Apple’s Safari page)

Apple has used Readability’s (open source) code to build this feature and, on top of what Readability does, Safari Reader adds some nice touches: a smoother look, automatically loading multipage content at once, nice animated transitions and overlaid buttons that help the reading user (to print, change the font size, or send by email).

What Safari Reader has introduced is simply a reading mode for the web: when you enter it you get the best experience for reading, but to do anything else, you need to exit that mode.

By using a mode, Safari can focus on supporting a single task at a time, which enables it to improve the quality of the experience.

Reception

While Arc90’s little experiment did not create many waves, Apple promoting the same idea was bound to be noticed and reactions were sometimes slightly hyperbolic:

“Apple has essentially destroyed the web publishing model completely with the release of Safari 5. This is the equivalent of dropping a nuclear bomb on the entire web economy” Jim Lynch

The reasoning being that the Reader feature would block ads. This is quite exaggerated since this feature requires the page to be loaded and the ads to be displayed before I can activate it, but there is some truth to it. It probably doesn’t bother Apple that this might slightly reduce Google’s income from online advertisement, given their competition in the mobile space.

However, Safari’s Reader mode needs to be manually activated every single time, requiring me to make extra effort, which I probably  won’t, unless I am forced to by poor page design or an unreasonable number of ads.

Conclusion

The mere existence of this feature is a sign that the reading experience on the web is often not satisfactory. By failing to recognise the main need of the reading user or by letting other considerations trample this need, publishers shoot themselves in the foot and are driving their users to bypass their primary income source.

As Lukas Mathis puts it:

“If your users are using a third-party product to make your product usable, you are doing something wrong”

I look forward to the day where websites are better designed and I won’t have to use any of these band-aids to enjoy reading long online articles. Until then, I’ll happily continue to use Safari Reader, Readability and Instapaper.

For more on the subject:

Arc 90's Readability (bookmarklet that works in every browser)

Apple: What’s new in Safari 5

Nik Fletcher: On this Safari 5 Reader Hysteria

Lukas Mathis: Safari Reader

Jim Lynch: Safari Reader: Apple’s Weapon of Mass Destruction

Daring Fireball: No, Safari Reader Is Not the Beginning of an ‘Arms Race’

The Guardian: How Apple's new ad-blocker could save the media (maybe)

Ars Technica: Apple's "evil/genius" plan to punk the Web and gild the iPad

It is no wonder then that registration forms try to make sure details are captured correctly. But how to do it while still preserving a positive user experience? Registration forms basically represent a barrier for people to be overcome before they can do what they actually want to do – finally use the website!

Here is how others have tried to handle this (with varying success):

Confirming entry

I frequently see a registration form that has duplicated Email or Password fields. Now, this is a little bit annoying, especially if both Email and Password need to be confirmed (as below).

In the above example, the person’s interaction flow is significantly interrupted by having to answer two identical questions. As per Don Norman’s model of 7 Stages of Action, answering each single question on a form is a small diverting action on the person’s journey towards accomplishing her goal.

Disabling copy & paste

Harry Brignull wrote about a registration form that does not allow pasting into the ‘Confirm email’ field. Quite creative, but I agree with Harry that it could feel patronising, especially for the more tech-savvy people (who know how to copy-paste). On the other hand, it prevents people (hopefully) from simply replicating a typo made in the first field. And typos are arguably one of the commonest kinds of incorrectly entered details. Now let me ask, why do most websites actually use the wording ‘Confirm your email’? Let’s use ‘Re-type your email’ instead, and it might not be necessary to awkwardly disable standard system interactions like pasting.

Repeating key details before submit

A more elegant solution is not to display the second confirmation field at all. But how can businesses eliminate the eventual errors on forms then? I quite like concept prototypes created by Jonathan Knoll and Russ Unger, that repeat the entered email just before submitting. Jonathan and Russ have produced multiple variants, but variant 5 (picture below) is my personal favourite. It puts the entered email within the person’s locus of attention which is at that point in time on the Submit button.

Unmasking passwords

What about passwords, that are by default masked on most forms (even at registration)? First of all, I believe masking a password does not bring any value in most usage scenarios. Nielsen calls for the death of masked passwords, and I am happy to agree with him. However, as opposed to offering a checkbox to mask the password, as he is suggesting, I think the way to go is actually offering a checkbox to unmask the password. After all, in most contexts security is more important than interaction efficiency.  MailChimp is doing this already, and based on a recent live demo of FontDeck, it seems like we will be seeing this pattern more often.

A pattern for unmasking passwords is also frequently used on mobile devices. This is due to the lack of tactile feedback provided by touchscreen keyboards when inputting a password. Moreover, people also cannot rely on their motor memory (remembering the finger movements like in touch-typing, as opposed to the actual password characters). People often utilize the motor memory to enter passwords with little conscious effort, and this does not translate so easily to touchscreen keyboards as visual identification of keys is needed.

Most mobile interfaces support people by revealing the last character entered for a short time and then masking it, thus giving people the necessary feedback. I am not aware of any website doing the same, but it might be a solution for standard monitor-keyboard setup too. On the other hand, the utility of this short-time revealing is debatable since most people type so fast that revealing the last character and masking it with a time delay is very difficult to implement seamlessly.  Try it for yourself - here is an example of automasking.

Inline validation

Another powerful weapon against incorrect entries is inline validation. Validation can only catch a small proportion of specific errors, but it is generally a good approach since people are notified something is not quite right before they hit the Submit button. Therefore it eliminates the need for the dreadful error messages. “Fatal error - you have not filled in all the details!”. “Oh my god, fatal error - someone actually died!” screams the user in horror.

There are multiple ways of implementing inline validation. Luckily for us, Luke Wroblewski put a few validation variants to the test. Based on his study, validation ‘after’ (after the person indicated that she was done answering a question by moving on to the next one) is the winning option - both in terms of efficiency and satisfaction.

So what?

Incorrectly entered details in online forms are a frequent problem that can cause a lot of hassle down the line. However, when designing forms, make sure you use a sensitive approach to minimising those errors and do not make the people do all the hard work for you.

I would love to hear about your tips for minimising errors in forms.

Figure 1.  An example of collaborative filtering recommendation demonstrated on Amazon.com

Simply put, collaborative filtering recommenders allow a website to recommend stuff based on how similar your browsing behaviour is to that of other users.  These recommenders will often rely on some correlation threshold value to determine whether you do or do not share mutual interests with various other users.  A really good example of music recommendations based on collaborative filtering would be last.fm (www.last.fm)

One issue with collaborative recommenders is a result of a user's divergent goals - different goals that a user might have when using a particular interface.  For instance, say that a given user is a keen fan classical music (a Mozart aficionado), but regularly listens to Lady Gaga (and other contemporary pop music) when with certain friends because that user knows that Lady Gaga-type music will facilitate a belongingness with those friends.  When that user is alone, s/he wants to listen to classical music and be recommended only this music without having to sort through recommendations based on when Lady Gaga has been selected.

A solution that has been devised to help users with recommender noise that results from divergent goals has been to include product information (e.g., classical versus contemporary pop music) when the recommender filters your recommendations.  That way, our example user only gets recommendations for classical music when listening to Mozart.  Recommenders that include content information with collaborative filtering are called hybrid recommenders.

Another issue for any recommender system is what to do when a new user or new item comes along, commonly known as cold start. For the last four years, I’ve been looking at the relation between people’s music preferences and their personalities, which could be used as an alternative way to help resolve the cold start problem and improve music recommenders.  An associate of mine at Cambridge University, Dr. Jason Rentfrow, does a great job in describing the music preferences and personality research (see http://www.youtube.com/watch?v=29-xYiOOc8w).

Researchers like Dr. Rentfrow have identified relations between the genre of music that people listen to (e.g., rap or jazz) and personality characteristics that those people generally have (e.g., extroversion or openness to experience).  Still, genres can be really vague.  I mean, you and I might both love rock music, but are you going to necessarily love the same rock music as I do?  Instead, to help recommenders to their job, I identified audio features prominent in certain music genres and link these to personality characteristics.  So, instead of saying that extroverts like rap music, I say that extroverts really like music that has a lot of beats that happen quickly together… constantly.  This relation might apply mostly to rap music, but might also apply to certain rock songs, electronica songs, you name it.  Conversely, my research suggests that introverts like music that has few beats in the music, which is typical of classical music, but again, is not exclusive to classical.  As a result, identifying the relation between personality and music preference toward specific audio features can help improve both issues described above by identifying and sorting music according to more precise and objective audio features.

In sum, the work that I have described is still very new and there are a lot of challenges to see through before recommenders can truly become 'personalised' by learning and understanding users’ personality, but there are a lot of opportunities that may result from this type of personalisation as well.

So tell me, do you think your musical tastes describe your personality?  Have you made personality judgements about a person because of the music they listen to?

Also, do you think that there are similar aspects common in most or all of the music you listen to?  Or, do you tend to have a favourite instrument that you like when it’s played in a song?

Finally, what do you think about music recommendation based on personality?

Your comments (positive or negative) are welcome.

What makes the foundation of an expert is all of those things; education, experience, and a solid knowledge of the processes, methodologies and tools. But what differentiates the consultant from the expert is not just being an expert at implementing UCD in perfect conditions, but the ability to implement UCD in the ‘not so perfect’ context of the client.

As experts we need to be able to assess the client’s current processes, phase of development, schedule, and budget, and then determine what activities and deliverables will provide the best returns within their context. But this isn’t where it should end. As a UX expert, you should be able to deliver not only tactical recommendations, but strategic ones as well. Those strategic recommendations are not just on the user experience of their system or product, but on the activities that can help to move the client towards a more efficient and productive implementation of UCD.

As true user experience experts, we need to propose and implement activities and deliverables for the best return in the context of the client, and work with the client to migrate to a process that will bring to fruition more of the strategic value of UCD.

I’m not going to predict how well it will even perform under one handed operation, however even if it were only as light as the average magazine (like say Communications of the ACM, which I have here on my desk), holding it up with one hand and operating it with the other is going to be a strain even if the arm holding the ipad is supported.

Damn, I think I just talked myself out of buying one… maybe

Personally I’m really quite excited about the iPad and it might well be the first Apple product that I have bought in something like 6 years -  but I’ve had a niggle since I first saw it in action and read about it, which I haven’t seen anyone else pick up on yet (SURELY someone will). That is how inherently awkward double handed interactions with large portable interfaces (or tablet PCs) are.

“What?” you say…

This, I say: that in order to use two handed interactions, you need to put the iPad down on something - sometimes rather suddenly mid interaction - and that to do so is just plain ergonomically unsound.

Let’s review some options for using the iPad:

1. Your lap

Some may remember the days of the NTL set top box and its walled garden internet when internet through the TV was trialled 10 or so years ago. Some clients rushed to get their websites converted for the walled garden so that they’d work on the TV. You had to use certain colours, no stripes, I think it was 640 x 480 resolution, HTML 3 (no frames), table based layouts only, and absolutely no javascript. To interface with this wonderful garden of delights you used a keyboard on your lap.

I didn’t need to conduct any usability trials to work out how this would go. Try it now, put your keyboard on your lap and see how comfy it is to use. It isn’t is it?

To see this in action check this video about how to use an Apple application at 20 – 35 seconds. The narration suggests it's easy but watch what the narrator actually does with the tablet.

2. A desk

Place the iPad on a desk and suddenly you’re craning over at an 80% angle to look at the screen (which is normally upright) in order to see what you’re doing. "Ouch, my neck!"

3. A stand / mount

With the iPad on a stand here are your choices: either the keyboard is at the wrong angle, or the screen is, or the whole thing is at the wrong height, or more likely all three… That's an Ergonomics fail!

4. Your lap II

Legs up on your sofa, knees raised, head rested on a comfy cushion, iPad on your lap. AHA! The one comfortable position in which you can make your double handed interactions; just don’t forget some Velcro to stick your iPad to your trousers to keep it at just the right position.

But wait, OH NO, now my wrists are at a 90 degree angle to my arms. "Ouch, ouch, ouchety-ouch."

In conclusion, the ergonomics of the iPad is not looking good. I’m not going to predict how well it will even perform under one handed operation. Even if it were only as light as the average magazine, holding it up with one hand and operating it with the other is going to be a strain even if the arm holding the iPad is supported.

Damn, I may have just talked myself out of buying one… maybe...

These figures tell us a number of things;

• Retailers with strong brands can still gain sales by entering the online market – customers expect them to be there, so even late entrants such as House of Fraser can make progress.
• The greater your brand reach, the greater your chance of making sales in a tough market. People expect to have choice and convenience. Online-only brands will struggle unless they have a true point of difference in a fiercely competitive market.
• Retailers who really understand their customers will succeed in a fierce market.

I have spent many years working in marketing departments of retailers and in stores, and I have never spoken to a retailer who would ever say they don’t know their customers. They must do – customers walk through the doors in their hundreds of thousands each week. They speak to staff at tills, on shop floors, by phone, via e-mail, on doorsteps and in focus groups, every day. Market Insight teams carefully examine basket data from tills, loyalty cards and web analytics. There has never been more data on what people are doing in stores, online or over the phone.

For many years retailers have prided themselves on their ability to second guess what a customer will respond to. How they should lay out a store, what to merchandise by the till, the front door, on the home page or at a category level on a website. They think about which tools will be useful, which image is right and which promotion is best.

Ever better, retailers carry out multi-variate testing to find out what works best, they test press ads, TV ads, e-mail campaigns and direct mail shots. They can prove which version works best, and back the winner.

But do they know why?

In the course of my retailing career, I put together successful promotions, advertisements and product launches. I was even involved in some that were not so good. For all I would be able to tell you why I thought they worked or had failed but I could never actually prove my theory. Did we hit upon a lucky idea, or find the secret formula? If so, could we re-create it for a new product, different category or new season?

The answer to this question lies in talking to customers, observing their behaviour and listening carefully to what they tell us. When done properly, this can give real insight into the most important question: why?

Can I repeat that, yes, like many retail professionals my experience and skill meant I could get it right more times than I got it wrong, but is that enough when we face tougher trading in 2010 than most of us have ever seen at any time in our careers?

Do you know how much it costs to talk to your customers and what the returns could be? Here at Flow, we do and I know you would be surprised.

The dissertation looked at how control room staff at London Underground’s Victoria Line made sense of the information they received about on-the-ground events through cues from their equipment and from each other. Using field observations, the study uncovered the situations that gave rise to sensemaking, the strategies adopted to ease and speed up sensemaking and the bottlenecks in information-seeking.

The Ulf Aberg award, given annually, recognises outstanding Masters projects in Ergonomics. Projects are assessed on the quality of the research, expertise, originality, clarity and interpretation of results.

Ulf Aberg, after whom the award is named, began his career in 1961 and spent over a decade working with Ericsson and later with the National Defence Research Institute. Aberg co-authored the first Swedish textbook on ergonomics and was the first foreign member of the Ergonomics Society and the founding chairman of the Nordic Ergonomics Society.

Congratulations to Frankie!

Testing a paper prototype

Excuse 1: “It’ll slow us down”

Finding users, building prototypes and working through hours of research takes time. Why not spend that effort on writing more code?

Counter argument. You say: “Our business objective is to reach profitability as quickly as possible. To do that, we need to understand what our customers really need and make sure we’re all agreed on the direction. A usability test might take some time in the short term, but it will help us reach our overall business goal quicker.“

Usability testing, like many UCD tactics, is an investment. You put in time and money, but you get back a product that sells better and costs less to support. But usability testing is also beneficial during the design process…

The managing director observes a usability test via a video link

1. Design the thing better, quicker: Trying to design a product for target users, without ever meeting any, is like pulling teeth. But if you just watch a few users using a prototype, a competitor product or their current system, they’ll tell you what you really need to know quickly, effectively and (comparatively) effortlessly.

2. Manage the politics more easily: Successful designs come from teams all pulling in the same direction. Usability testing results will reduce squabbles, give confidence to management and get people to focus on improvements rather than feature creep. Even the most sceptical team members can’t ignore videos of 5 or 10 real people battling with their software.

3. Get a team energy boost: Seeing ideas succeed makes the team feel positive. Seeing them fail motivates people to sort things out.

Excuse 2: “Our product is already perfect”

You and your team will become so deeply familiar with the product you’ve designed that you will think it is perfect.

Counter argument. You say: “We believe the product is perfectly easy and useful. But can we prove it? How many problems exist that we’re not aware of? What impact might they have? Developers may think their code has no bugs, but we still hire testers to prove it. What evidence do we have that our design is perfect first time?”

This behaviour is often referred to as “drinking your own Koolaid“. It means you’re doubly ignorant…

In a thought-provoking piece a few years back called The Five Orders of Ignorance, software engineering expert Philip G Armour says,

“The hard part of building systems is not building them, it’s knowing what to build — it’s in acquiring the necessary knowledge… A functioning system is the by-product of the activity of finding things out.”

Excuse 3: “We already have lots of feedback”

Listening to customer feedback via email, call centre or the web is vital. Analytics and search log analysis is great, too. And it can seem like you’re getting all the user input you need.

A group of developers watching usability testing video

Counter argument. You say: “We’re only getting feedback on major issues and from committed product users – lots of other people encounter our product and never feed back. So we’re getting a skewed perspective. Usability testing will let us observe and discuss all sorts of things that customers and non-customers would never actually feed back about. It will also explain what to do about the strange patterns we’re seeing in our web analytics. This extra insight will give us a competitive edge, because it’s not obvious stuff that our competitors also know.”

Excuse 4: “This concept is not ready to test yet.”

Ready for a usability test

It’s easy to tell yourself that you’re not ready to work with target users yet – that your ideas haven’t settled down to something stable and complete which users will approve of.

Counter argument. You say: “Don’t worry if it’s not ready. We’ll test what we’ve got, and won’t worry much about the areas where we know things aren’t finished. It can give us reassurance that we’re heading in the right direction and stop us from spending loads of time designing a blind alley.”

The truth is, your ideas will never be stable and complete until you’ve had the input from users. Until then, they are just hypotheses. Better to test your hypotheses when they are young and flexible, rather than when you’ve spent weeks on refining them, and publicly declared them as “finished and ready”.

How to run that test

Doing the perfect usability test is no doubt hard. But doing a useful test is really easy…

As Bruce Tog says, without iterative usability testing “you’re going to throw buckets of money down the drain”. So just get out there and test.

The brief

The British Association and College of Occupational Therapists (BAOT/COT) is the national professional body for occupational therapy students and staff in the United Kingdom.

BAOT/COT is responsible for setting professional and educational standards, advising on policy, and supporting its 29,000 members’ research and development, professional practice and Continuing Professional Development (CPD).

BAOT/COT’s main channel of communication to members is their website. As a key component of their service to OT staff and students they wanted to ensure they were providing a valuable and easy-to-use resource, so they asked Flow to help them understand what members and non-members wanted from this resource, and then to re-design the site around these needs.

What we did

Using a range of research techniques throughout the project, Flow investigated the needs of Occupational Therapy staff and students, and designed a new website for BAOT/COT around those needs.

We interviewed Occupational Therapists, OT support workers and students to understand their perceptions of BAOT/COT as an organisation, the BAOT/COT website and other resources they use to aid them in their studies or practice. We synthesised the insights gathered from this research into a series of personas, each illustrating characteristics of different members of BAOT/COT’s audience; and used these personas throughout the project to guide and evaluate design decisions.

BAOT/COT had a wealth of information on their existing website, however, as the site had grown organically this information had become increasingly challenging to locate. To ensure content was well organised and easy to locate we undertook a card sorting exercise with people representative of BAOT/COT’s audience. This enabled us to identify the different mental models people used to understand the content that BAOT/COT wanted to include on the new site, and guided the site structure and labelling of content.

Moving into the design phase of the project, we used the insights from our initial research activity to guide concept generation and development. In order to validate our design decisions, we also tested mock-ups of the site with users at every stage – from initial concept sketches through to the final visual design, ensuring we were developing something which met users’ needs and satisfied BAOT/COT’s objectives.

Once the new site was built, we tested it again with users to validate the final designs and evaluate the site against the original brief.

The results

BAOT/COT successfully launched their new website which has been designed to grow organically, forming the foundation of a continually improving member resource.

BAOT/COT’s new website has enabled them to create a more engaging and valuable resource for members and non-members alike. Having moved away from a website which pushed information to members, to one which stimulates online debate between the organisation and its members, BAOT/COT anticipate an increase in membership and in the number of people using the site.

www.cot.co.uk

“Flow's user centred approach helped BAOT/COT understand our users' online behaviours and needs. It also helped clarify our own business goals. Clear user priorities emerged from Flow's research with our members which helped us make confident decisions about site structure, design and navigation. The team at Flow were quick to understand our values and aspirations as well as the practical challenges we faced. Their approach inspired confidence and trust. The new BAOT/COT website which emerged from the project continues to add more and more value to our business.”

Stephen Little, Web Manager and Editor for the British Association of Occupational Therapists and College of Occupational Therapists