Ecommerce User Interface Design Lawrence Najjar Information Architect

E-commerce User Interface Design Lawrence Najjar Information Architect Viant lnajjar@viant. com

Outline • • Why worry about e-commerce usability? Why improve e-commerce usability? Page format Navigation Catalog Registration Checkout 2

Why Worry about Ecommerce Usability? • • • Up to 50% of potential sales lost because shoppers cannot find what they want 1, 2 83% of shoppers left e-commerce sites due to poor navigation and slow downloads 3 78% of shoppers abandoned their online shopping carts 4 3

Why Improve Usability? • • After improving e-commerce usability: – IBM got 400% increase in sales 5 – DEC got 80% increase in revenue 6 Improving usability estimated to: – Increase number of buyers by 40%7 – Increase order size by 10% 7 4

Page Format • • • Design page size for AOL users 8, 9, 10 Design page to download in less than 10 seconds (40 K)11, 12, 13, 14, 15, 16 Put user interface elements in familiar locations 17, 18 Put shopping cart summary on every page 18, 19 Put sign-in entry fields on home page Include links for contact us, privacy policy, security info, and referral 20, 21 5

Example Home Page 6

Example Interior Page 7

Navigation • • • Make nav simple, intuitive, and consistent Tell user where user is, how user got there, how to get back, where else to go 22 Provide global and local nav controls Use breadcrumbs Allow user to get to any product in 5 clicks or less 23 Provide specialized browse functions 8

Navigation (continued) • • Put search entry field on every page Design search to put user’s searched-for hit on first page of search results Allow user to search by product name, product category, brand, model/item number, and price On search results page, allow user to perform another search, refine results, and sort results 9

Catalog • • Let user directly enter the catalog Organize catalog into familiar sections Allow user to sort products in a section 24 Provide link to put product in wish list and to e-mail page Show shipping cost Include product comparison tool 25 Include expert product reviews and allow users to enter reviews 10

Registration • • • The more streamlined registration process is, the more likely users will register and buy 26, 15 Require only e-mail address, password, permission to e-mail promotions, and permission to leave cookie 27 Get other user info during checkout and via periodic, optional, one-question, multiple-choice popup surveys 28 Allow user to edit and delete registration Don’t show full credit card number 11

Checkout • Checkout is biggest reason people cannot buy from site 29 On shopping cart page, show: • – – – – – Hyperlinked product names Entry fields for quantities Prices Dropdown list of shipping choices and costs Order subtotal, including shipping + taxes if user is registered Check boxes for removing products Check boxes for moving products into wish list Button to refresh the page Links to return to shopping and to checkout 12

Checkout (continued) • • • Don’t require user to register to check out 29 Put checkout fields on single, vertically scrollable page Provide obvious links to privacy policy, security policies, delivery guarantees, and customer service guarantees 26 For signed-in member, fill in checkout fields For errors, put notice at top of page, explain at each field what was wrong and how to fix it Provide complete, editable order summary 13

Checkout (continued) • Provide order confirmation that includes 19: – – – • Order number Instructions for canceling order Directions for tracking order and shipment Customer support info Promotion (optional) Require password when changing shipping address 14

Conclusion • • E-commerce usability is important User interface design best practices improve usability of e-commerce sites 15

References Cohen, J. , & Thompson, M. J. (1999, February). Mass appeal. The Standard [Online]. Available: http: //www. thestandard. com/article/display/0, 1151, 4927, 00. html 2 Seminerio, M. (1998, September 10). Study: One in three experienced surfers find online shopping difficult. In Inter@ctive Week [On-line]. Available: http: //www. zdnet. com/intweek/quickpoll/981007 b. html 3 Thompson, M. J. (1999, August 9). How to frustrate Web surfers. Industry Standard [On-line]. Available: http: //www. thestandard. com/metrics/display/0, 1283, 956, 00. html 4 Biz. Rate (2000, October 23). 78% of online shoppers abandon shopping carts according to Biz. Rate survey. Biz. Rate press release [On-line]. Available: http: //www. bizrate. com/content/press/release. xpml? rel=88 5 Tedeschi, B. (1999, August 30). Good Web site design can lead to healthy sales. New York Times e-commerce report [On-line]. Available: http: //www. nytimes. com/library/tech/99/08/cyber/commerce/30 commerce. html 1 16

References Wixon, D. , & Jones, S. (1992). Usability for fun and profit: A case study of the design of DEC RALLY version 2. Internal report, Digital Equipment Corporation. Cited in Karat, C. , A business case approach to usability cost justification. In Bias, R. G. , & Mayhew, D. J. (1994). Cost-justifying usability. San Diego: Academic Press. 7 Creative Good (2000, June 12). The dotcom survival guide. Creative Good [Online]. Available: http: //www. creativegood. com/survival/ 8 America Online (2001, March 8). AOL membership surpasses 28 million milestone. America Online press release [On-line]. Available: http: //media. aoltimewarner. com/media/cb_press_view. cfm? release_num=502 52317 9 Kadison, M. L. , Weisman, D. E. , Modahl, M. , Lieu, K. C. , & Levin, K. (1998, April). On-line research strategies: The look to buy imperative. Forrester Report [Online], 1(1) [On-line]. Available: http: //www. forrester. com/ 10 America Online (2001, January 2). AOL holiday season shopping reaches $4. 6 billion. America Online press release [On-line]. Available: http: //media. aoltimewarner. com/media/cb_press_view. cfm? release_num=502 52085 6 17

References Miller, R. B. (1968). Response time in man-computer conversational transactions. In Proceedings of American Federation of Information Processing Societies Fall Joint Computer Conference, 33, 267 -277. 12 Nielsen, J. (1994). Response times: The three important limits. In J. Nielsen, Usability Engineering (pp. 115 -163). San Francisco: Morgan Kaufmann. Available: http: //www. useit. com/papers/responsetime. html 13 Nielsen, J. (1997). The need for speed [On-line]. Available: http: //www. useit. com/alertbox/9703 a. html 14 Lamers (1996, February 27). Personal communication. 15 Sacharow, A. , & Mooradian, M. (1999, March). Navigation: Toward intuitive movement and improved usability. Jupiter Communications. 16 Sullivan, T. (1998). The need for speed. Site optimization strategies. All Things Web [On-line]. Available: http: //www. pantos. org/atw/35305. html 17 Bernard, M. (2001, Winter). Developing schemas for the location of common Web objects. Usability News. Software Usability Research Laboratory, Wichita State University [On-line]. Available: http: //wsupsy. wsu. edu/surl/usabilitynews/3 W/web_object. htm 11 18

References Cyber. Atlas (1999, February 25). Online stores lacking. E-tailers should follow lead of offline shops [On-line]. Available: http: //cyberatlas. internet. com/market/retailing/taylor. html 19 Ragus, D. (2000). Best practices for designing shopping cart and checkout interfaces [On-line]. Available: http: //www. dack. com/web/shopping_cart. html 20 Reichheld, F. F. , & Schefter, P. (2000, July-August). E-loyalty: Your secret weapon on the Web. Harvard Business Review, 105 -113. 21 Stanley, J. , Mc. Carthy, J. C. , & Sharrard, J. (2000, May). The Internet’s privacy migraine [On-line]. Available: http: //www. forrester. com/ 22 Fleming, J. (1998). Web navigation: Designing the user experience. Sebastopol, CA: O’Reilly. 23 Tracy, B. (2000, August 16). Easy net navigation is mandatory – Viewpoint: Online users happy to skip frills for meat and potatoes. Advertising Age, p. 38. 24 Nielsen, J. , & Tahir, M. (2001, February). Building sites with depth. In webtechniques [On-line] 2001(2). Available: http: //www. webtechniques. com/ 18 19

References e. Marketer (2001, March 12). Turning shoppers on(line). e. Marketer [On-line]. Available: http: //www. emarketer. com/estatnews/estats/ecommerce_b 2 c/20010312_pwc _search_shop. html 26 Agrawal, V. , Arjona, L. D. , & Lemmens, R. (2001). E-performance: The path to rational exuberance. The Mc. Kinsey Quarterly [On-line], 1. Available: http: //www. mckinsey. com/ 27 Charron, C. , Bass, B. , O’Connor, C. , & Aldort, J. (1998, July). Making users pay. Forrester Report [On-line]. Available: http: //www. forrester. com/ 28 Nielsen, J. (1999). Web research: Believe the data [On-line]. Available: http: //www. useit. com/alertbox/99 0711. html 29 Rehman, A. (2000, October 16). Effective e-checkout design. ZDNet/Creative Good [On-line]. Available: http: //www. zdnet. com/ecommerce/stories/evaluations/0, 10524, 26388741, 00. html 25 20