By Richard Kerr and Trent Mankelow

Recently I used an airline’s touch-screen kiosk to check-in, and made the mistake of touching the No button on the ‘dangerous goods’ screen. I’d anticipated that the question would be worded something like ‘Are you carrying any dangerous goods?’, like it would be if I was physically checking in. Unfortunately it wasn’t worded that way, and pressing No kicked me out of the system. An airline representative, who had been hovering nearby, moved in and cancelled the process. He then took us through the whole process again, this time doing every step for me. How embarrassing.
 
This got me thinking. Shouldn’t a successful self-service kiosk interaction be one where I can do it myself?
 
This is an important question as more and more services are being migrated to kiosks. BNZ has departure fee kiosks, Dymocks has introduced a BookFinder kiosk, PAK’nSAVE have a SHOP’nGO kiosk as part of its self-scanning experience. Back in 2005 the Photo Kiosk was even named the Person of the Year by the PhotoImaging Manufacturers & Distributors Association.
 
 
How to create a great kiosk
 
The first step in designing any kiosk is to establish its purpose. This involves understanding who the audience is and what their goals are. Then you should work out the common tasks they’ll want to perform. (It’s interesting to note that research suggests that kiosks work best when they focus on just a single transaction.)
 
Next, you should adopt a user-centred, iterative design process.
 
This involves testing your kiosk designs with representative users performing representative tasks using the kiosk or a prototype. For example, if the kiosk is for supermarket shoppers, you might test with the actual people who do the family shopping. In fact you would ideally conduct the tests in the environment that the kiosk will be ultimately be located - in the supermarket itself.
 
 
Kiosk usability tips
 
As part of designing a kiosk, you’ll want to take into account the large body of research that exists. The following guidelines can help to produce a great kiosk experience:
 
•    Optimise for ease of learning over efficiency of use. For most kiosk interfaces it is important to presume no prior knowledge of the system by the user. The appearance of the interface should convey that it is basic or at least straight forward and simple to use.
 
•    Design for single touches rather than common web/desktop interactions. Multi-step point and click gestures that are appropriate for mouse and keyboard interactions may confuse kiosk users. Ideally eliminate interactions that involve dragging, double-clicking, scrolling or scroll bars. For example, pull-down menus that necessitate a press, drag and release can be difficult to execute using a touch-screen.

•    Don’t display the mouse cursor when the customer touches the screen. Any evidence about the operating system driving the experience can break the user’s mental model about how they are interacting with the kiosk. It may confuse users about which actions might be possible, and it looks unprofessional.

•    Don’t use black as a background colour, as it promotes reflections and accentuates finger prints. Instead, use halftones or textured backgrounds.

•    Attract customers to the kiosk. Ensure that there is a prominent ‘Touch to start’ button, and include a short looping introduction to familiarise users with the system, explain how it operates, and alert users to what they can achieve using it.

•    Ensure that there are clear visual cues that elements have been selected. For example, make buttons ‘depress’ when touched to indicate when they have been ‘pushed’. Other ways of indicating this are colour or shade changes, a ‘negative’ of the button or even sound.

•    Gives customers a sense of control. Display a busy indicator if a process will last longer than a few seconds. Offer clues about where the user is in the system, and how far they have to go to complete the process.

•    Design the system so that the user can complete the process as quickly as possible. This will increase the chance that the user will stay to complete the process and will decrease the chance of physical fatigue.

•    Carefully consider how questions are phrased when leading the user through the process. In particular, if the kiosk is replicating a task already performed in the real world discover the exact wording of how the question is asked. For example, if users are used to answering a question in the affirmative, consider making sure the related question on the kiosk is also asked in the affirmative. 

•    Track how the kiosk is being used. It can be very useful to track how often a kiosk is used and when it is used, the amount of users per day, the average time spent at the kiosk, the average completion time for tasks, and the last screen visited before leaving.
 
A great kiosk provides a better experience than the one customer can currently receive over the counter. That’s the promise of airline check-in kiosks - they shouldn’t just make the experience quicker, they should make it better.

Good self-service kiosks reduce costs for the business, but great ones also deliver a rewarding and engaging customer-experience. It’s good for the business and the customer. 

Interested in ensuring your new kiosk is as easy to use and intuitive as possible? We have done kiosk and touch-screen work for leading organisations such as Air New Zealand, Navman, Westpac and others. Let us know if you’d like to know more about our services, by emailing Trent.
 

This month, we welcome back Larry Marine, to respond to last month’s newsletter about link-rich home pages. He writes about when lots of links might not be the right answer, and what to do about it. Larry is a founder and principal of Intuitive Design & Research, and holds a degree in Cognitive Science. He is an expert in user research and user-experience, and has worked with companies of all sizes, from start-ups to Fortune 500.
 
 
After last month’s article, you would be forgiven for thinking that link-rich homepages are the answer to every web design problem.  Unfortunately, however, it’s not that simple. Link-rich homepages are a good solution for information-oriented domains, but a task-oriented environment may be better served by a different approach.
 
Usability testing shows that information-oriented designs are not very successful in task-oriented environments. An information-oriented website, such as a standard business or corporate site, tends to offer plenty of content, from varying types and sources. A task-oriented site intends to help customers solve problems, such as determining the right health insurance options for a couple expecting their first child.
 
Information-oriented sites organize and categorize information by the content type and relationship. This approach relies on the users’ ability to find, assimilate, and use the right information, and most importantly, to know what information to ignore. Such sites work well when users know what they are looking for and how it is organized, but this approach rarely works well when the users need more guidance.
 
In a task-oriented environment, the users barely know the extent of their problem, much less what to look for or how it is organized on the site.   They can get lost and frustrated very quickly, and chances are, they won’t come back.  A much more successful, though more difficult, design approach helps the user define their problem and then suggests the best solution.
 
As you might guess, the design approach is very different for these two domains, and just as an information-oriented approach is not very successful in a task-oriented environment, the reverse is also true. If you know what you are looking for (as in an information-oriented environment), a task-oriented approach seems quite cumbersome.
 
But what does a task-oriented problem domain look like? To begin with, content doesn’t have to be information artifacts. It can be anything.  Take buying flowers, for an example. In an on-line flower shop, an information-oriented approach would have users find different flowers by flower type or name and put them together in a bouquet. A typical florist would have little trouble performing that task with such an information-oriented tool, but the average on-line flower purchaser is not a florist. Actually the average flower consumer is on the opposite end of that scale - men.
 
The typical male doesn’t know or care much about flowers.  All they want is to get a nice bunch for their sweetheart, in as short a time as possible. If it wasn’t for the last minute, the typical man would get nothing done, especially when it comes to anniversary and birthday gifts. I’m a man, so I know! When it comes to flowers I need them fast, and I don’t want to spend half a day figuring out which flowers I need. I just want the right bouquet for the occasion. After years of marriage, I have learned one thing about flowers, with the exception of Valentine’s Day, nothing cries insincerity more than a simple, dozen red roses. Roses are supposed to be a surprise, not an easy way out.
 
OK, so now we have the root of a task-oriented problem. I need just the right flowers grouped together in a bouquet that is appropriate for the occasion. A task-oriented approach should begin by asking me for the occasion, and then show me a set of bouquets perfect for that occasion. This is a big difference between an information-oriented approach and a task-oriented approach. An information-oriented design will typically provide an information artifact, such as an article, in one and only one location. A task-oriented design may very likely duplicate artifacts, such as putting the same bouquet in many different appropriate occasions.
 
Take a look at ProFlowers.com, an on-line florist that employs a task-oriented user-experience approach. The Nielsen ratings of on-line commerce for May, 2008 show that Proflowers is number 1 in conversion rates, almost 36%. There are a number of reasons for this, not the least of which is their task-oriented design. I know, because I designed it and the CEO still publicly acknowledges that the UI design is one of their key success factors. Interestingly, the other on-line florists, at the time, used an information-oriented design that required users to build bouquets. What was the hot seller on those sties? You guessed it, a dozen red roses.
 
But as I said, task-oriented designs only work in task-oriented domains. Focusing on making sure you understand the problem domain correctly before defining a solution will help you find the right design approach.
 
Now go buy your sweetheart some flowers.

This month we’d like to welcome back Donna (Maurer) Spencer.  We last interviewed her nearly a year ago, on card sorting. Today she is talking about link-rich home pages, a subject that is near and dear to my heart.
 
I recently had a conversation with a manager of a large government website. He boasted about the recent changes to the department home page.  He was particularly proud of one of his developments. "I reduced the number of links from 67 to 17", he told me.
 
My eyebrows shot up and I just managed to stop myself gasping in surprise.  Regaining my composure, I calmly asked him, "Oh, really. How did that work out?"
 
"It’s much better," he said.  "Now people only have to choose from the 8 main categories on the home page" (the other 9 links were footer links and site utilities).
 
I walked away knowing that this manager had no real idea whether the changes worked and with a strong feeling that they probably hadn’t.
 
Believe it or not, link-rich home pages (ones where you have a lot of links) are OK.  They might even be a really good option, especially for large websites with a wide variety of content.  Let me explain why.
 
Whenever we combine content into groups and decide on a label, we are creating a category. On large websites with varied content, creating a small number of categories that represent all the content is extremely difficult.  That’s because as we create fewer and fewer categories, the labels get more and more abstract. The labels chosen may mean something to the developers, or the staff of that organisation, but will the customers understand?  How will the customers know how to find the information they want?
 
That’s where link-rich homepages can help. Instead of using just broad categories as the entry point to a site - we can use broad categories plus detailed links. Take a look at the MAF website in New Zealand for an example.
 
An example I’ve worked on recently was for a big government department in Australia. The old home page navigation had a left-hand navigation bar with 8 main categories. The new approach still uses the left-hand navigation bar, but the body of the page has the category name plus links to sub-topics and relevant external websites. The addition of key links helps explain what the each category is about, and allows people to jump directly to a topic of interest (and they do - when the new version was released, traffic to the topics pages increased).
 
A word of caution is necessary, however.  Effective link-rich home pages don’t just happen.  Too many links can be confusing and hard to navigate.  There is a lot on the page, so you need to take special care to:
 

• Cluster links into groups that make sense to the reader - or people will still not know where to start.
• Place a lot of attention on good visual design - use plenty of whitespace, good alignment and good line height. Otherwise the groups of links will not be readable.
• Avoid using other attention-grabbing devices such as banner ads and anything that moves - the visual load will be too high.

The final challenge with link-rich pages is that everyone will tell you that you are wrong - the common perception is that less is better. The best way to overcome this is to undertake usability testing. But don’t just test the link-rich page. Test an alternative version with a more traditional small set of categories. That way you’ll know that your link-rich version works, and you’ll be able to show that it is better than the alternative.
 
Want to know more? Hear Donna rave about the advantages of link-rich home pages and much more IA goodness at our workshop on the 21st of August in Wellington.

Recently we were asked what we thought the most widespread web usability issues were. We have evaluated over 140 websites in the last 18 months, and repeatedly see the same website design mistakes, most of which are easily corrected. The Top Ten mistakes are:

1. Poor categorisation and labelling of information.
Problems with site structure and the names of the main categories are among the most damaging problems for a website. For example, the <a href="http://www.pumpkinpatch.co.nz">Pumpkin Patch website</a> has ‘Shopping’ and ‘Product Guide’ categories - neither of which actually show the range of kids clothing that they have for sale. Too often websites reflect the internal structure and labels used by the organisation, rather than those of their customers.

2. Poor navigation design.
Even if a site is well organised and information is in clearly labelled categories, the design of the navigation elements can undo all the good work.

3. Cluttered page layout.
Many pages are difficult for users to scan because the design is cluttered. Information isn’t aligned and there is too much unused space. The most important information on a page isn’t clear at a glance. Few pages make effective use of section headings and sub headings so that it is obvious how the information on a page is structured.

4. Inconsistencies with web design conventions.
People spend most of their time at other sites. That’s why it’s crucial that your site follows standard design conventions and behaves as visitors would expect. Inconsistencies will make your site harder to use and less intuitive.

5. Too little content.
It is amazing how little thought goes into understanding who website users are and why they are using a site. A luxury lodge website we worked on earlier this year, for example, did not tell visitors how many people could stay at the lodge at one time, or whether they could bring their own food.

6. Too much content.
While too little content can be a problem, we more often hear complaints about too much content. Users balk at the idea of reading long pages of text online. Overseas research has shown that people read up to 25% slower from a computer screen as opposed to paper. Our own experience supports this - at ACC, for example, people preferred pictures and diagrams over words to illustrate injury prevention principles.

7. Poor use of links.
People move around on the web by clicking on things. That’s why it’s got to be obvious what a user can and can’t click. Sites should link useful pieces of information together. For example many university sites don’t link their subjects pages to useful pieces of information such as timetable details, or pre-requisite papers.

8. Poorly implemented forms.
Despite their popularity, most online forms still make basic mistakes. Compulsory fields aren’t highlighted and users aren’t given instructions on how to enter dates and phone numbers in the correct format. My personal favourite - entered information is not saved until the form is complete - forcing users to re-enter all information if they make a mistake.

9. Poorly written error messages.
An ideal website prevents people from making mistakes in the first place. At the very least a website should help users to diagnose and recover from errors. Instead most error messages are terse and impolite and use obscure jargon and vague phrases.

10. Poorly implemented search.
Many people browse for information on a website and use search engines only as a last resort. Your search engine needs to be bullet proof, or you risk irritating already exasperated users.

Note: Jakob Nielsen has also recently released his Top Ten Web Design Mistakes of 2005

I’m lucky enough to have the latest version of MSWord and all the additional functionality that it offers. However I was surprised when I clicked the wrong button to change the page set-up to Landscape- for the second time. Then, despite my awareness of the tendency, a third, fourth and fifth time!  I couldn’t recall ever having this problem before I installed the 2003 version, so what had changed?

For the older version, there is a natural mapping between the shape of the display and the current page orientation. When you click on the circle next to Landscape, the display changes accordingly. For the new version, although you get to click on the display shape directly, the natural mapping is lost. Now, the Portrait symbol is surrounded by a Landscape box.

This may not create a problem when you have enough attention to spend on the task of selecting an orientation. But when your mind is preoccupied by the piece of work that you are developing you may not have attention to spare. It is times like this that lack of clarity may contribute to mistakes and unnecessary frustration.

I imagine that the reasoning behind the change is that it is easier for the user to actually click directly on the desired orientation symbol than the corresponding text. However I’d like the best of both worlds, natural mapping AND direct selection:

- Nikki