Roger Tilson, Jianming Dong, Shirley Martin, and Eric Kieke
rtilson@us.ibm.com, jdong@us.ibm.com, smartin2@us.ibm.com
Ease of Use, IBM, Austin, TX, USA

The Opportunities and Challenges Presented by E-commerce

Designers have only recently begun learning how to create effective e-information web sites--web sites that present information about products and services. Now designers are increasingly being called upon for a new challenge--e-commerce. Most of the principles designers have learned and used to create e-information sites will apply to e-commerce as well, but e-commerce introduces some new issues and challenges that designers need to be aware of.

Many companies have already established e-commerce web sites, and in the next few years, many more e-commerce sites will come online. Companies will develop e-commerce web sites for different reasons: to reach new customers, to stay abreast with their competitors, and to meet their customers’ expectations and needs.

The increasing importance of e-commerce is apparent in the recent GVA study conducted by researchers at the Georgia Institute of Technology. In their summary of the findings from the eight survey, the researchers report that "electronic commerce is taking off both in terms of the number of users shopping as well as the total amount people are spending via Internet based transactions." Over half of the 10,000 respondents report having purchased items online. The most cited reason for using the web for personal shopping was convenience (65%), followed by availability of vendor information (60%), no pressure from sales people (55%), and saving time (53%).

Although the issue of security remains the primary reason why more people do not purchase items online, the GVA survey also indicates that faith in the security of e-commerce is increasing. As more people gain confidence in current encryption technologies, we can expect more and more users to frequently purchase items online.

Many current e-commerce sites are not fully taking advantage of this opportunity, however. In the current issue of "Internet World" (formerly "WebWeek"), columnist Whit Andrews discusses his own sad experiences with bad usability when trying to purchase things online. He says, "Problems with consumer adoption of internet commerce have almost no connection to issues of technology...What happens when regular folks try to buy things on the Internet is insupportably bad business."

Whit Andrews quotes Mark Hurst, president of a consulting firm specializing in Internet ease of use: "It's ease of use, it's ease of use. Why doesn't the industry get that?"

The IBM Ease of Use Group has begun a series of studies to assist our customers and all professionals in creating easy-to-use e-commerce sites. This paper documents the results of the initial study in which sixteen participants used and compared two sites that sold clothing, and two sites that sold computer products. The primary purpose of this first study was to pinpoint factors that affect the usability of four e-commerce sites. Future studies will focus on e-commerce sites that sell other types of merchandize or services. Future studies will also focus specifically on the issues or factors that participants have commented or that we have observed are important.

The sixteen participants in our initial study encountered some major design problems with the four e-commerce sites. Some of these major design problems included the following:

• the sites did not effectively communicate where and how to add an item to the shopping list (the list of items the user plans to buy)
• the sites did not provide effective feedback when items were and were not saved in the shopping list
• the sites did not effectively communicate if and when users needed to register or log in to order
• the sites did not facilitate easy navigation from the shopping list to other parts of the site

This paper discusses these findings and provides some suggestions for improving the usability of e-commerce sites.

Methods

We asked eighteen people to evaluate four e-commerce web sites. Two of the eighteen people participated in pilot testing. The other sixteen people participated in the formal testing used to collect data.

Participants evaluated two e-commerce sites that sold clothing, and two that sold computer products. We wanted to determine the interface and information designs participants preferred for sites that presented the same kinds of content. We did not want to focus on sites with only one type of content, however, so we chose two sets of sites.

We systematically varied the order of the presentation to control for order effects. The participants completed roughly equivalent tasks at each site. While using each site, participants stated what they liked and disliked. They also focused on what would encourage or discourage them from purchasing a product from each site. After using each pair of sites with similar content, e.g., Computer Site A and Computer Site B, participants stated which one they preferred and why. They also listed major likes and dislikes for the sites.

After using the four sites, participants rated the significance of factors that would influence their decision of whether to purchase an item online. The factors that participants rated were culled from feedback from nine people within IBM as well as the two pilot participants.

Participants’ Background Information

The following table shows the age, sex, occupation, and education level of each participant. It also shows the amount of time each participant uses the web each week, and whether each participant had purchased any products or services from e-commerce sites. We were not sure whether and how online shopping experience would influence participants’ use and evaluation of the sites, so we wanted a balance of users who had and had not purchased items online. Half the participants had bought something online, and half had not.

The table also indicates that most of the participants were well educated. Future studies will need to involve less educated participants and more participants who have not purchased items online.

Findings: Understanding E-commerce Issues in the Context of UI Principles

Many of the problems that participants experienced with the four e-commerce sites reflect new issues, but these new issues can still be understood within the context of traditional UI design principles. Principles like simplicity, satisfaction (feedback), and versatility (flexibility) are also very important in designing e-commerce sites. Even though these principles seem like old news, the four sites that the participants in this study used did not always apply these principles successfully. One problem may be that UI principles are very general. These principles offere a starting point, nevertheless, for understanding the usability problems with four current e-commerce sites.

Below are some UI design principles that were applicable to the design of the four e-commerce sites that participants used and compared. A more detailed explanation of each of these principles can be found at the IBM Ease of Use web site (www.ibm.com/easy).

• Simplicity: Don't compromise usability for function
• Support: User is in control with proactive assistance
• Obviousness: Make objects and their controls visible and intuitive
• Encouragement: Make actions predictable and reversible
• Satisfaction (feedback): Create a feeling of progress and achievement
• Accessibility: Make all objects accessible at all times
• Versatility (flexibility): Support alternate interaction techniques
• Personalization: Allow users to customize

Obviousness and simplicity of product menus

Designing sites that contain hundreds of items of merchandise can be very challenging. Users need to be able to scan and select items easily. Participants in this study generally liked the simple menu list at Clothing Site B more than they liked the dropdown menus at Clothing Site A:

• Only one participant (13) stated he liked the dropdown menus at Clothing Site A (illus. 1)
• Five participants (4, 6, 9, 10, 16) indicated they liked the menu list at Clothing Site B (illus. 2)
• Four participants (1, 2, 8, 9) indicated they disliked the dropdown menus at Clothing Site A
• No participants indicated they disliked the menus at Clothing Site B
• Participant 16 stated she wanted a menu list at Clothing Site A like she had at Clothing Site B

Illustration 1: The menu list at Clothing Site A. These dropdown menus require 3 clicks to view an item, and many items are hidden in the initial view.

The dropdown menus at Clothing Site A present at least three problems. First, the items in each menu are initially hidden from the user. Participant 9 said, "at first glance, you only get to look at the name of one item." Second, it is not clear what users must do to see the item. Some participants did not immediately recognize that they needed to click VIEW. Third, Clothing Site A requires three separate clicks to go to the page that contains information about the item.

Dropdown menus work best in situations in which users are interacting with content or information on the screen and still need access to other tool or other types of information. In the case of Clothing Site A, participants only needed to select one item from the screen and move on. Dropdown menus in this case did not make good use of the available screen space. Because items were unnecessarily hidden and selection required three clicks, the dropdown menus did not provide the simplest and most effective UI design.

In contrast, participants described the menu list at Clothing Site B as "nice," "plain," "simple," and "clear." One participant said, "I like the way they keep the information on the left side and change the information on the right side."

Illustration 2: The menu list at Clothing Site B. More items are immediately visible than at Clothing Site A.

Simplicity of the path to products

If the main purpose of a web site is to sell products online, then designers need to enable participants to accomplish that task simply and easily. Participants 1, 3, and 10 commented that purchasing an item at Clothing Site A seemed to take longer than Clothing Site B. Participant 10 said he felt he had "to go through so many levels of information." Participant 3 said "the process seemed to take longer" at Clothing Site A.

The number of clicks required for navigating to the merchandise at the two sites differed more than the number of levels. Clothing site a required at least seven clicks before seeing any merchandise: 2 clicks to get off the first page, 1 for a category such as casual clothing, at least 3 to select an item from the dropdown menu, and 1 to dismiss the security message. By comparison, Clothing Site B required 4 clicks: 1 click from the home page, 1 on a main shopping category such as Menswear, 1 on a subcategory, and then 1 on the actual item. Clothing Site B did not require users to interact with a security message before seeing merchandise.

Supporting users with helpful categorization of merchandise

The participants were impressed when designers provided helpful product categories. For instance, 4 participants (1, 4, 10, and 16) were very pleased that Computer Site B categorized their monitors by size. The designers used icons to represent the different size monitors. Similarly, 5 participants said they liked that Menswear was separated from Womenswear at Clothing Site B.

Support for personalizing or narrowing product lists

Whether participants used the search or followed links, Computer Site B listed products alphabetically in a table format. Some of these lists continued for five pages or more. Participants 1, 2, and 4 wanted ways to skip to the manufacturer or specific product they were looking for. At least seven participants expressed a dislike for having to look through the entire list.

Versatility and support in the form of product pictures

Five participants (1, 2, 4, 10, and 12) complained about the lack of pictures of the computer products at Computer Site A and Computer Site B. Participant 12 said he wouldn't buy without a picture. Participant 11, on the other hand, did not want to waste time loading pictures of computer-related merchandise. Some participants mentioned that they would like to have the option to view larger pictures.

Support for reading and learning about products

Four participants (4, 9, 12, and 16) remarked that the product information at Computer Site B was inadequate. Many categories in tables of specs were left blank for no apparent reason. At least one participant attempted to click on these fields for more information, and was disappointed to discover she couldn't.

Six participants (2, 4, 6, 9, 10, and 16) also commented on the poor print layout of the product information at Computer Site A. Most participants commented that they disliked the specs being all capitals at Computer Site A. One or two participants also complained about having to read so much. They wanted lists of bulleted items instead of lengthy text.

Obviousness of order buttons/links

One of the advantages of e-commerce is that someone can create a registry or a wish list--a list of items that you would like for other people to give you on special occasions. The challenge to designers is to provide these extra features without creating confusion. The designers of Clothing Site B wanted to enable users to peruse items and then select one to add to their "wish list," or select one to buy themselves. The problem was that 9 out of 16 people mistook the wish list for a place to save items that they themselves were planning to buy.

The labeling of the buttons contributed to the problem. The participants were asked to purchase four items from Clothing Site B, and so they wanted to save items and check out later. The buttons were labeled as follows:

Participants did not want to order the item "NOW." They wanted to save the item and check out later.

Similarly, 10 out of 16 people experienced difficulty finding the order button at Clothing Site A. All 10 participants first scrolled past the button. The link indicator appears below:

With the detailed descriptions of the items, the pictures of the products, and the information about sizes, this inconspicuous button/link was hidden from the participants. The button or link small and atypical, and its placement almost always required participants to scroll past pictures and a block of text to find it. The graphic does not look like an HTML link, nor does it look like a button.

Supporting users by providing a compare feature

Computer Site A enabled participants to compare products side-by-side. Participants could click on which products they wanted to compare, click the compare button, and the specs of the products would appear side-by-side. Participants 1, 2, 9, and 11 commented favorably on the compare feature. Participants 9 and 11 indicated they disliked having to scroll horizontally, however, to view the comparisons. At least 3 participants (10, 12, 15) commented that they did not understand what the compare feature was for.

Dissatisfaction with recurring security messages

One traditional UI principle is to enable users to feel that they are making progress. Security messages at e-commerce sites can impede the progress that participants are making toward purchasing an item. Seven participants (1, 3, 5, 6, 8, 11, and 15) indicated confusion or annoyance at the recurring security messages at Clothing Site A. Clothing Site A displays three security messages during the process of adding one item to the shopping cart. One message appears upon clicking to view an item. Two more appear after selecting size and color and clicking "go to next step."

Comments from five of the seven participants about the recurring security messages are listed below:

Participant 3: Why now? I don't understand the meaning.
Participant 5: It shouldn't display it every time.
Participant 6: These notices would discourage me from buying.
Participant 11: I really get tired of the warnings.

Support for understanding the requirements of the ordering process

A good UI provides users with the knowledge that will allow them to accomplish their tasks quickly and with confidence. In this study of e-commerce sites, at least nine participants (3, 4, 5, 10, 11, 12, 13, 14, 15) expressed uncertainty concerning whether or not they needed to log in or become a member to order. None of the sites actually required logging on.

The wish list registration form at Clothing Site B caused some confusion. When participants clicked on "Add to WISH LIST," they arrived at page with nothing except for the words "log in.". Participants had no idea what this log in was for.

Also, many of the participants did not see the order link/button at Clothing Site A. Participant 10 went to help to try to determine how to order, and he then thought he needed to register to order. Some of the participants did not like the thought of having to register:

Participant 3: Do I need to fill in all this stuff. I don’t really want to deal with logging in. . . . Ok. It looks like I need to sign up.
Participant 10: It appears as though you have to register with them to order things; I don’t like that.
Participant 11: Why does it ask me to register? I don’t any more problems with this. Should I put in something?
Participant 14: I needed to join something in this one [Computer Site A]. I don’t want to feel like I’m joining any mailer. It’ll scare me away.

Versatility of the ordering process

Computer Site A required participants to click on a link to get information about a particular product before they could order it. Refer to Illustration 3 below. Four users indicated confusion about where to go to order an item that appeared in this list. The link did not clearly indicate that it would take them to the page for ordering the item. Requiring users to read information before ordering, moreover, may not always meet their needs and expectations. Participants in most circumstances wanted to read about a product before purchasing it, but not always. Participant 11 said he wanted the ability to "add the item to the cart from any screen that discusses the item."

Illustration 3: List of items at Computer Site A. Four participants indicated confusion about where to go to order.

Participant 8 said, "I shouldn’t have to see the specs to see a way to order it. I don’t necessarily want to see the specs. If my boss says find me the best laser printer, I may need to, but I may not want to [see specs] if he says buy me a LaserWriter." Versatility, or giving users the ability to perform tasks in their own order is an important UI design principle.

Feedback on saving items in the shopping list

Providing feedback when an item is added to the shopping cart and when your cart is empty would immensely improve the usability of the four e-commerce sites that participants used.

At some point when using one of the four e-commerce sites, at least 9 participants expressed uncertainty as to when and how items were saved in their shopping cart. Five participants (5, 10, 11, 15 and 16) continued shopping thinking they had added items to the list when they hadn’t added any items.

Clothing Site A did not show the shopping list after each item was added, so 5 participants (3, 4, 6, 11, and 14) either clicked on the link to view it or wanted to be able to click to view it. Four participants stated specifically they wanted to be able to view the shopping list after each item was added. Three participants (3, 4, and 7) said they would like for the shopping cart to be on-screen at all times. Participant 3 complained bitterly that she wanted to view her shopping list: "I want to see what’s in the shopping list. . . It is my shopping list isn’t it?"

Showing the list after each item is added helps confirm that the "task" is complete, but this feedback does not inform when the "task" is not complete. Only the "power user" version of Computer Site A showed the shopping list at all times. It displayed the list in the bottom left frame. Participant 12 was the only person to use this "power user" version, and he liked the persistent shopping list. He added that he would like to see the shopping list flash when an item was added. He did not at first see the shopping list.

Obviousness and accessibility of a running total

Five participants (4, 5, 6, 7, and 12) wanted to see a running total on the shopping cart. One participant was offended by Clothing Site A not displaying a total cost on the shopping cart for the items he had selected: "I don’t even know how much I am gonna spend and they’re wanting me to give them all my information. Here’s my credit card; YOU tell me how much to spend."

Support for users who want to continue shopping

Clothing Site B did not clearly indicate how to continue shopping. As the screen capture shows, there was no "Continue Shopping" button below the shopping list. Four participants expressed uncertainty about how to continue shopping, and another person was worried that the shopping list would not be saved if he used one of the links on the left.

Illustration 4: No "Continue Shopping" button at Clothing Site B

Reversibility of actions

Six participants (4, 6, 7, 8, 9, and 11) wanted to be able to delete items and/or edit items in the shopping list. Most said they wanted to be able to delete items. One participant wanted to enter information about size and color at Clothing Site B without having to return to the page where Clothing Site B wanted him to provide the information.

Versatility for customers who want to continue shopping

Purchasing multiple items at an e-commerce site can be very inefficient if the site's links must be navigated in a prescribed order. After users save an item in their shopping list, Clothing Site A provides a link to the top of the hierarchy, but to nowhere else in the site. The experience is analogous to picking up an item in a department store, walking all the way to the cash register, then returning to the front of the store, then going to some other place in the store to pick up another item, going back to the cash register with the second item, returning the front of the store, and so on and so on. The process sends users in cumbersome loops.

Clothing Site B handled this design challenge slightly better. Clothing Site B's "Product List" link sent participants to the last product list they viewed. The link was customized for each user and for each trip through the hierarchy. The "Main Directory" link sent users to the top of the hierarchy. Clothing Site B also provided the search engine on the same screen with the shopping list. Clothing Site B's links--"Product Directory" and "Main Directory"--did not clearly indicate where the user would go, however.

Factors Affecting the Decision to Purchase

After using all four e-commerce sites, the 16 participants were asked to rate the importance of the following factors on a scale from 1 to 7, with 1 being "very insignificant," and 7 being "very significant." The results indicate that security issues were among the most important factors to the participants. Many participants were not aware that e-commerce encryption techniques can be used to ensure the security of credit card numbers.

Participants’ Three Most Important Factors

Each participant listed the "three most important" factors influencing his or her decision of whether to purchase an item online. The chart below indicates that the most often-cited issue for these participants was credit card security. Eight participants listed credit card security as one of their three most important factors. Five participants listed easy return/exchange methods. Pictures of the merchandise and detailed information were also important to the participants. See the index for a more detailed account of the participants’ responses.

*Some participants listed "security" as a major concern, but did not specify credit card numbers or personal information as the source of concern. These were classified as general security concerns.

Suggestions

Consider providing a persistent view of the shopping cart.
One reason more sites are not using a persistent view, one in which the shopping cart stays on the screen at all times, may be because of the bandwidth required to do so. It would also require a frames implementation or the use of a separate window. Nevertheless, participants in this study could have benefited from a persistent view of their shopping cart. Thirty-one percent thought they had added an item to the cart when they hadn't.

Use dropdown menus only when they add value.
One situation in which they add value is when content as well navigation mechanisms or form options need to be displayed simultaneously. When content is not on the screen, dropdowns may not take advantage of the available screen space. Twenty-five percent of the participants did not like the dropdown menu implementation at Clothing Site A.

Minimize the effort/time required to navigate from the home page to product and ordering information.
Three participants thought the process of ordering from Clothing Site A was too long. The site required seven clicks to view product information.

Study how your users will want and expect products to be organized.
Twenty-five percent of the participants in this study were impressed by monitors being categorized by size. Thirty-one percent wanted clothing to be divided into men and women's.

Provide ways for users to narrow long lists of products.
Forty-four percent said they disliked looking through long lists of products.

When providing additional features such as a registry or comparison view, make certain that the extra functionality does not confound the ordering process.
For 56% of participants the registry at Clothing Site B complicated the ordering process.

Further Research

The following issues need further research. These issues should also be considered when developing an e-commerce site.

Security

Since participants indicated that security issues were their primary concern when determining whether to purchase an item from an e-commerce site, designers and information developers will need to determine the best ways to ensure and demonstrate to users that their sites are secure.

Link or Button Labels

Participants in this study were confused by the button "order ITEM NOW" because they interpreted "order" as submitting the order irretrievably to the company. By this definition, they did not want to order the item NOW. After further research determines the optimal labels for e-commerce buttons, standards or design conventions could be applied uniformly across all e-commerce sites to enable users to transfer their knowledge of one site to another. In the meantime, designers need to observe users trying to purchase items and determine the effectiveness of their labels.

User control of task steps/User access to multiple parts of the site

Two participants in this study said they wanted the option to order a product without reading the product information. Designers need to ensure that users can buy products in the ways that they want and expect to be able to buy them.

To facilitate user control, designers also need to provide access to multiple parts of the site at any one time. Five participants in this study indicated they wanted and expected to go somewhere besides the top of the hierarchy when they selected "continue shopping." One problem with some current e-commerce sites is the shopping loop. If users want to purchase multiple items, they drill down to find the item, then return the top of the hierarchy, drill down again, and repeat this process until they complete their shopping.

More research needs to be done to determine the best way to provide user control and easy access to multiple parts of the site. One possibility is a design that shows the shopping list in the left frame. Links to other parts of the site could also appear in the left frame. Research could determine what should happen in the right frame after an item is added to the shopping list.

Shopping list feedback

Many participants in this study did not know if and when an item had been saved to their shopping list. Five participants continued shopping thinking they had added an item, when in fact they had not. One possibility for further research would be a to place the product list in, for instance, a bottom left frame. Once the user adds an item to the list, the list would show the new item.

Personalization

Designers and researchers need to develop ways for users to narrow their searches and personalize their product lists. At least half the participants commented that they wanted e-commerce sites to assist them in narrowing their searches. Participants wanted to narrow and sort by price, by manufacturer, and by features. The sites that participants examined, however, often did not provide the assistance participants wanted. The participants were sometimes presented with long lists of products that they found overwhelming. Other times they browsed through products that they didn’t care to see to get to other items.

References

Andrews, Whit. "At Far Too Many Sites, 'Buyer Be Lost' Applies." Internet World. Feb. 2, 1998.
http://www.internetworld.com/

"GVU's 8th WWW User Survey." GVU's WWW User Surveys
http://www.gvu.gatech.edu/user_surveys/survey-1997-10/