Executive Summary Usability Report
Transcription
Executive Summary Usability Report
Avram Baskin Usability Review for Senior Citizens: Evaluation of AOLTravel http://www.aol.com Page 1 Executive Summary Following is a list of the top usability issues I believe have to be addressed on the AOL Travel web site: ! ! ! ! ! Make more judicious use of color. Use high brightness and saturation values for high value objects, and lower saturation and brightness values for low value objects. Avoid long downloads – seniors may not have high speed internet access, and they will likely be using older, hand-me-down computers. The search engine is not smart enough to recognize typos. Switch to a smarter search engine, such as Google. Some pages are too long – too much scrolling is required. Break down the content on these pages into logical groups and put the content on two or more pages. Not all buttons are clickable. In some cases, only the label is “hot”. Use image maps to make the entire button clickable. Usability Report “They say you can't teach an old dog new tricks - and maybe they're right. It seems to me our mission to escort the Chancellor of the Klingon High Council to a peace summit is problematic at best.” Captain’s log, Captain James T. Kirk Stardate 8679.225. While the stakes of Captain Kirk’s final mission in command of the Starship Enterprise (NCC-1701-A) were a bit more weighty than the stakes for creating usable web sites for seniors, his sentiment about not being able to teach an old dog new tricks is no less problematic for the design of usable web sites than it was for his mission. In the case of web sites the “old dog” is not the senior citizens using the web, but rather the people designing the sites senior citizens want to use. Morrell, Mayhorn, and Bennet’s survey of world wide web usage by middle-aged and older adults showed that the top three interests of both groups was (1) e-mail, (2) accessing information about traveling for pleasure, and (3) accessing health related information. While access to communication and health care information are both important goals, I suspect that that “traveling for pleasure” points to the most likely reason for designing more senior friendly web sites – because there’s a buck to be made. The 2000 census of the United States showed that there were more than 35 million people aged 65 or older (U.S. Bureau of the Census, 2001). This demographic controls more than 900 million dollars in disposable income (Spry Foundation, 1999). So, there is an economic incentive to create web sites that accommodate the needs of this age group. And this incentive will increase in the future. 2000 was the first census in which this age group did not grow faster than the total population (U.S. Bureau of the Census, 2001). There is now a population bubble behind this group – the baby boomers -- that will be retiring over the next 20 years. Avram Baskin Usability Review for Senior Citizens: Evaluation of AOLTravel http://www.aol.com Page 2 As with any computer interface, designers have to consider the particular needs of the target audience. In the case of seniors, there are three areas that require special attention over younger users. As we age, our cognitive processes become less efficient. One consequence of this is that, in general, the capacity of working memory decreases. Also, efficiency in performing motor tasks (i.e. pointing and clicking with the mouse) decreases. The third area is vision – for most adults, vision declines over time, and this may have implications for the color palette and fonts selected for the interface. One area of conflict that comes up in the research on usability for seniors is the age range that constitutes the demographic “senior citizens”. Because different age ranges are used by different researchers, it is difficult to draw global conclusions and create design guidelines based on a literature survey. The following table lists the age ranges included in studies reviewed for this report: Title Making Computers Easier for Older Adults to Use Web Usability and Age: How Design Changes Can Improve Performance A Further Examination of the Influence of Spatial Abilities on Computer Task Performance in Younger and Older Adults A Comparison of Website Usage Between Young Adults and the Elderly Aging, Motor Control, and the Performance of Computer Mouse Tasks The Locus of Age-Releated Movement Slowing: Sensory Processing in Continuous Goal-Directed Aiming Age-Releated Kinematic Differences as Influenced by Task Difficulty, Target Size, and Movement Amplitude Effects of Age and Training on World Wide Web Navigation Strategies A Survey of World Wide Web Use in Middle Aged and Older Adults Nielsen and Coyne Exploring How the Elderly Use the Web Authors Worden, Walker, Bharat, and Hudson Chadwick-Dias, McNulty, and Tullis Age Range Mean age 70.1 years Pak 65-75 Liao, Groff, Chaparro, and Stumpfhauser 64-87 Smith, Sharit, and Czaja 60-75 Pohl, Winstein, and Fisher 64-78 Ketcham, Seidler, Van Gemmert, and Stelmach Mean age 68 Mead, Spaulding, Sit, Meyer, and Walker 64-81 Morrel, Mayhorn, and Bennet 60-92 Usability for Senior Citizens Groff, Liao, Chaparro, and Chaparro 65+ 64-87 Comments Age range not provided 55+ Age range not provided. Avram Baskin Usability Review for Senior Citizens: Evaluation of AOLTravel http://www.aol.com Page 3 Context I evaluated the usability of AOLTravel from the perspective of Arlene, a 72 year old woman. Arlene has been using a computer for a little over seven months. Her first computer was a hand-me-down from her daughter, but she felt the performance was too slow when she tried to access the Internet, so in August she purchased a new Dell computer. Arlene wanted a computer because she thought it would be “interesting and a good way to get information”. When she received the computer from her daughter she took a training class geared toward senior citizens through a local adult-education program. She finds that using the computer is fun, “it’s like a hobby”. Never-the less, her computer time is limited. She has a very active – she participates in several discussion groups, and volunteers her time with two charitable organizations. She does not depend on the computer for her social life. Arlene uses a dial-up connection to access the web. She does not mind waiting a bit for pages to load. She reported that she does sometimes get frustrated with long waits for search results, but she attributes this to her entering incorrect information for the search – “it’s because I’m not specific enough”. When queried about whether she’d be interested in a faster connection, such as cable modem if it cost $50 per month, she responded that it would not be worth it. Her main concern is that when she is online she and her husband cannot respond to phone calls. As a result, she limits her sessions to 30 minutes. She would be interested in a device that would allow her to respond to phone calls while she’s online. E-mail was not one of her goals for getting a computer, but she reports that she now spends approximately 60% of her time online reading and sending e-mail. She finds it’s an economical way to stay in touch with far flung friends and relatives. Arlene does not have any favorite web sites, but she reported that she uses the web to check movie reviews on http://tvplex.go.com/buenavista/ebertandroeper/today.html, weather reports, and prices for hotels, car rentals, and airfares (although she has never made purchases or reservations online). Her experience has been that it’s easier to call, and that calling gets her better prices when she and her husband travel. She reported that if she saw a good price she would purchase online, and would not have a problem providing her credit card number to a “reputable company”. I observed Arlene performing a search task (checking for hotel prices) as she would for a trip to Florida. She said she used www.travelocity.com,; she did not realize that she was using the Travelocity search engine on AOL – she thought she was using the actual Travelocity web site. Avram Baskin Usability Review for Senior Citizens: Evaluation of AOLTravel http://www.aol.com Page 4 The task was to find the price for her favorite hotel in Boca Raton. Starting on the AOL Travel: Travel Main page, she entered BocaRaton, FL (sic) in the search field (there is a Hotels and Lodging link on the page). The response was an error message that informed her the system could not find a match for bocaraton, fl. When Arlene realized there was a typo in the search entry she corrected it. She received a links to get information about Palm Beach and Boca Raton. She was expecting to get a list of hotels. Her comment was “the biggest problem is knowing what to ask for.” Her next search was for the name of the hotel she wanted to stay at – Residence Inn Marriot Boca Radon (sic). The system again displayed an error message informing her that a match could not be found for Boca Radon. Arlene corrected the typo, and this time received a page displaying information about the hotel. Avram Baskin Usability Review for Senior Citizens: Evaluation of AOLTravel http://www.aol.com Page 5 She carefully reviewed the page and confirmed the correct address for the hotel. She used the scroll bar to display rates that were “below the fold”; she apparently did not have a problem finding or using the scroll bar, although she used the down arrow, not the elevator box There were blocks of text about the hotel and with the pricing information. Arlene reported that she typically reads all of the text, unless she realizes it’s not pertinent to what she’s trying to accomplish. Analysis My analysis of AOLTravel was performed at a resolution of 800 x 600. I used two sets of guidelines: ! ! General human factors guidelines, including use of color, grouping, and optimization for cognitive processing. A list of heuristics (Appendix I) I created for designing for senior citizens in the target audience based on articles by Nielsen (2002), Bernard (2003), Chadwick-Dias, McNulty, and Tullis (2003), the SPRY Foundation(1999), Fitts (1954), Smith, Sharit, and Czaja (1999), Pak (2001), Mead, Spaulding, Sit, Meyer, and Walker (1997), Liao, Groff, Chaparro, Chaparro, and Stumpfhauser (2000). Avram Baskin Usability Review for Senior Citizens: Evaluation of AOLTravel http://www.aol.com Page 6 The analysis includes the following pages: ! ! ! ! Welcome screen – this is not included in the detailed analysis. I look at this screen only from the perspective of navigation, because this is the screen that initially displays when the user logs into AOL. AOLTravel home page The page that displays after an incorrect search term is entered The page that displays when a successful hotel search is completed. Welcome Screen After logging into AOL the user sees the following screen: ! ! ! AOL Tool Bar – 1 – available on all screens. Icons change on mouse over. Navigation Bar – 2 – provides access to functions available in AOL; available on all screens. Icons and menu items change on mouse over. Welcome Screen – 3 – the vertical black line on the right indicates the edge of the initial displayable area at a resolution of 800 x 600 pixels after login. 1 3 2 The default setting is for the Navigation bar and Welcome screen to float – they can be repositioned by the user. Both windows can be minimized, but they cannot be maximized. This may be confusing for users, especially older users, because it does not follow typical window behavior for Microsoft Windows applications. The user must scroll to display the right edge of the Welcome screen – this may also be an unexpected behavior. If the user repositions the screen, part of the menu bar will be covered. If the horizontal scroll bar is used to display the rest of the screen there may be targeting issues (Fitts, 1954; Smith, Sharit, Czaja, 1999). Avram Baskin Usability Review for Senior Citizens: Evaluation of AOLTravel http://www.aol.com Page 7 When the user mouses over Travel Deals, the hot link is confirmed by a background color change (white to light blue). The SPRY Foundation (1999) reported that older users may have trouble picking up colors in the green/blue/violet range. Although blue is typically a good background color to use, it appears that this has a low saturation and brightness level. The change may be hard to detect. My recommendation is that whatever hue is selected, saturation and brightness should be increased and the button should bevel, so it appears to “pop up” at the user. AOL Travel Home Page The user’s interaction with AOLTravel begins on the Travel Main screen. The Travel Main screen floats and it displays over the Welcome Screen. The user has to reposition the screen to display the menu bar. If the user inadvertently clicks a secondary window -- in this case the Welcome screen -- the travel screen may disappear from view, resulting in user frustration. I recommend having the Welcome screen automatically minimize, and having the Travel Main screen display the vacated space. The Travel Main screen includes the following components: ! ! ! Guides and Advice - 1 Travel Options – 2 Deals and Specials – 3 3 1 2 Avram Baskin Usability Review for Senior Citizens: Evaluation of AOLTravel http://www.aol.com Guides and Advice The grouping is tenuous at best. Search, Browse by Destination, Browse by Interest, Maps, Trips, & Resources may group as “ways to get information about trips”; it would seem that Travel Spotlight would be better located under Featured Trips. I recommend assigning each member of this “group” a separate space on the screen, separated by background color. Use the same hue, but vary the saturation and brightness; use high values for saturation and brightness to draw the user’s eye to this area -- assuming this is intended to be a high value area. Search Arlene went directly to search, missing some (perhaps) better ways to accomplish her task. The search function is overly sensitive to typos. Both times Arlene entered a search term with a typo, she received an error message. I recommend making the search engine a bit more forgiving – perhaps use Google instead of the current engine. When I entered the same typos as Arlene (Boca Radon, Fl/BocaRaton, Fl) on Google, the system asked if I meant Boca Raton, Fl. It would also help to make the search engine smart, so it remembers the user’s prior searches and bookings and makes suggestions about deals the user may be interested in. In addition to these changes, I recommend changing the background color from green to a low saturation, low brightness color --but not blue -- and changing the color for the search button to a hue with a high saturation and high brightness value. Page 8 Avram Baskin Usability Review for Senior Citizens: Evaluation of AOLTravel http://www.aol.com Resource Buttons These buttons do not appear to naturally go together. Generally, only related objects are grouped by color and shape. Browse by Destination and Browse by Interest provide different options for getting trip information. Maps, Tips, & Resources is a link to Map Quest. Boards & Chats provides access to online discussion boards. I recommend grouping the first two buttons and the third and fourth buttons separately. Also, change the hue to a fovial color with a high saturation and brightness value. These display as buttons, but only the text is hot. The black rectangle on the Browse by Destination button indicates the area on each button that is hot. The user may get frustrated by clicking on a button and not receiving a response. I recommend making the entire button hot, and separating the buttons with white space. Also, provide feedback to the user on mouse over by changing the color of the button, and bevel the button to make it pop out at the user. Featured Trips This would be better placed under Deals and Specials. I recommend changing the color for the Featured Trips header to a fovial color with high saturation and brightness values. Travel Options This section provides links to almost all of the user’s possible travel needs – air travel, vacation packages, hotels and lodging, cruises, and car rentals. This would appear to be in the perfect place – the center of the screen because this section is the most obvious affordance on the screen for accessing vacation information. There is high contrast between the background and foreground; the links are obvious. The one recommendation I have for this section is to increase the leading (white space between the text links, and to make more of the area to the right of each link hot Page 9 Avram Baskin Usability Review for Senior Citizens: Evaluation of AOLTravel http://www.aol.com Page 10 One note has to be made here – despite the fact that this section should have drawn the user’s attention, Arlene went directly to Search. This could be because of her past experience with the site, but it could also be because her eye was naturally drawn to the upper left area of the screen. It might be worth a usability test to reposition this section to upper left, and moving the search box to another section of the screen. Deals and Specials The background color sets this section off from the center section, and clearly groups together all of the deals and specials. The red text used for hotels.com may send a subliminal warning message – red is associated with danger. I recommend changing to a more culturally benign color – perhaps green or orange. It appears that the colors used for the headers Deals and Specials, Last Minute Weekends, and Deal Alerts are the same hue as the background (or close to it), with saturation and brightness varied. Since this information is of interest to the users, I recommend changing the hue for these headers to one that will provide high contrast with the background. The message in the lower half of the ad for hotels.com changes approximately every 2.5 seconds. This may be too fast for an elderly user to react to. I recommend increasing the time between changes or making this a static display that includes the message and the link. Error Message As error messages go, this one is very clear and it is easy to take corrective action. ! The use of red for the message itself is appropriate. - 1 ! There are clear instructions for what to do next. - 2 ! There are two places to enter a new or updated search term. – 3 The problem on this screen is the animated, saturated red ad for the Sopranos. This may generate revenue for AOL or Travelocity (not a trivial consideration) but it has nothing to do with the purpose of this screen, which is to explain the problem with the search and how to remedy it. My recommendation is that this distracting ad be removed so the user can focus on the business at hand -- not to mention that it may not run on older computers. Hotel Page 3 1 2 3 Avram Baskin Usability Review for Senior Citizens: Evaluation of AOLTravel http://www.aol.com This screen is to long; it requires too much scrolling. The horizontal black line indicates the location of the viewable area before scrolling. I recommend splitting this screen into several screens, with links on the above the fold part of the screen. The dealsonhotels.com section at the top of the screen is a distracting banner ad. I recommend making this area smaller, or removing it all together, and using this area to include more content for the above the fold part of the screen. Use fovial colors, not blue, for areas of the screen you want to draw the reader’s eye to, and for these colors assign high values for saturation and brightness. Page 11 Avram Baskin Usability Review for Senior Citizens: Evaluation of AOLTravel http://www.aol.com Page 12 Hardware Issues As might be expected, there are some significant differences in performance when AOL is accessed from a dial-up model and a cable modem. On an older model computer with a dial-up modem like the one Arlene originally used, it takes almost two minutes to access AOL. On her new computer dialup access is somewhat faster, but no where near as fast a cable modem on a newer computer. With a cable modem access time is under five seconds. Summary There are a number of usability issues that will make AOLTravel difficult for senior citizens to use. Relative to younger users, computer interface designers must accommodate seniors’ limited working memory, reduced psychomotor ability, as well as problems resulting vision degradation. Solutions suggested for AOLTravel included careful selection of colors, making it easier to target hot links with the mouse, and reducing extraneous graphical noise on the screen. These changes will improve the user experience for seniors, and, in the case of AOLTravel, make it more likely that visitors will make a purchase. Avram Baskin Usability Review for Senior Citizens: Evaluation of AOLTravel http://www.aol.com Page 13 Appendix: Heuristics for Evaluating Web Sites for Senior Citizens 1. Clearly identify all links as links (Chadwick-Dias, McNulty, and Tullis, 2003; SPRY Foundation, 1999; Bernard, 2003). 2. Make all parts (bullets, etc.) clickable (Chadwick-Dias, McNulty, and Tullis, 2003; SPRY Foundation, 1999; Fitts, 1954; Smith, Sharit, and Czaja, 1999). 3. When designing the site, consider that different users may wish to change the size of the text (Bernard, 2003; Chadwick-Dias, McNulty, and Tullis, 2003; Nielsen, 2002; SPRY Foundation, 1999). 4. Make button labels clearly representative of the button’s purpose, or provide a tool tip that provides additional information (Bernard, 2003; Chadwick-Dias, McNulty, and Tullis, 2003). 5. Provide text summaries for complex information presented in tables (Chadwick-Dias, McNulty, and Tullis, 2003). 6. Avoid using web and technical jargon (Chadwick-Dias, McNulty, and Tullis, 2003; SPRY Foundation, 1999). 7. Use domain jargon, but make the terms hot so users who do not understand the term can get an explanation (Chadwick-Dias, McNulty, and Tullis, 2003). 8. Provide obvious confirmation of the user’s current location (Chadwick-Dias, McNulty, and Tullis, 2003; SPRY Foundation, 1999; Pak, 2001; Mead, Spaulding, Sit, Meyer, and Walker, 1997). 9. Avoid pop-ups and multiple windows displaying at one time (Bernard, 2003; Chadwick-Dias, McNulty, and Tullis, 2003; SPRY Foundation, 1999). 10. Avoid banner ads, wallpaper, and other extraneous, distracting graphical elements (Bernard, 2003; Chadwick-Dias, McNulty, and Tullis, 2003; SPRY Foundation, 1999). 11. Keep content above the fold (i.e. avoid scrolling) (Bernard, 2003; Chadwick-Dias, McNulty, and Tullis, 2003; SPRY Foundation, 1999; Mead, Spaulding, Sit, Meyer, and Walker, 1997). 12. Use simple and clear affordances for navigation (Bernard, 2003; SPRY Foundation, 1999). 13. Use active voice (go to…, move…) for link. labels (Chadwick-Dias, McNulty, and Tullis, 2003). 14. Separate links with white space – make sure each link can be identified as a separate link (Bernard, 2003; Nielsen, 2002; Smith, Sharit, and Czaja, 1999; Fitts, 1954; SPRY Foundation, 1999). 15. Avoid pull downs, contextual menus, and other targets that require cursor movement to small targets (Nielsen, 2002; Smith, Sharit, and Czaja, 1999; Fitts, 1954; SPRY Foundation, 1999). 16. Indicate links are active by changing color and beveling (pop-up) when links are “moused-over” (Bernard, 2003). 17. Provide obvious identification of links that have already been clicked (Nielsen, 2002; Mead, Spaulding, Sit, Meyer, and Walker, 1997; Pak, 2001; SPRY Foundation, 1999). 18. Provide search engines that work with possible “typos” such as missing spaces and unexpected hyphens and parentheses (Nielsen, 2002; SPRY Foundation, 1999). 19. Make error messages easy to see (Nielsen, 2002; SPRY Foundation, 1999). 20. Make error messages easy to understand (Nielsen, 2002; SPRY Foundation, 1999). Avram Baskin Usability Review for Senior Citizens: Evaluation of AOLTravel http://www.aol.com Page 14 21. When possible, limit the number of clicks to desired information to three or less (Bernard, 2003; SPRY Foundation, 1999; Pak, 2001). 22. Include an explicit table of contents on the left side of all pages (Bernard, 2003; Mead, Spaulding, Sit, Meyer, and Walker, 1997; Pak, 2001; SPRY Foundation, 1999). 23. Provide high contrast between text and background (Bernard, 2003). 24. Concentrate more important information in the center of the screen, especially if the screen is crowded (Bernard, 2003; SPRY Foundation, 1999). 25. Avoid colored text on colored a background (Bernard, 2003; SPRY FOUNDATION, 1999). 26. Use serif fonts for text (Bernard, 2003; SPRY Foundation, 1999). 27. Use links to additional pages instead of scrolling (Bernard, 2003; Mead, Spaulding, Sit, Meyer, and Walker, 1997, SPRY Foundation, 1999). 28. When possible, use graphical buttons instead of text links (Bernard, 2003; Fitts, 1954; Smith, Sharit, and Czaja, 1999; SPRY Foundation, 1999). 29. Limit the number of graphics on the site to accommodate users with old, hand-me-down computers and dial-up access to the Internet (SPRY Foundation, 1999). 30. Constantly update important content, such as pricing and medical information (SPRY Foundation, 1999). 31. Avoid colors in the green/blue/violet range (SPRY Foundation, 1999). 32. Provide a page of instructions for adjusting browser settings (SPRY Foundation, 1999). 33. Use left justified text (SPRY Foundation, 1999). 34. Avoid text that scrolls automatically (SPRY Foundation, 1999). 35. Keep design layout clear, logical, and simple (SPRY Foundation, 1999). 36. Provide a tool bar with a consistent design at the top of each page to aid navigation (Mead, Spaulding, Sit, Meyer, and Walker, 1997; Pak, 2001; SPRY Foundation, 1999). 37. Avoid frames, or provide frame alternative sites (SPRY Foundation, 1999). 38. Provide context sensitive help (SPRY Foundation, 1999). 39. Provide easily located phone numbers in case additional assistance is required (SPRY Foundation, 1999). 40. Include context sensitive FAQs (SPRY Foundation, 1999). 41. Avoid animations – these may not run on older computers (Liao, Groff, Chaparro, Chaparro, and Stumpfhauser, 2000; SPRY Foundation, 1999). 42. Use large buttons and icons (Fitts, 1954; SPRY Foundation, 1999; Smith, Sharit, and Czaja, 1999). 43. Make selective use of sound to provide important information, but provide text alternatives for users who don’t have sound cards (SPRY Foundation, 1999). 44. When using sound, avoid background noise – for example, do not use background music (SPRY Foundation, 1999).