CHAPTER 8 User Interface Design
Chapter 8 is the first of three chapters in the systems design phase of the SDLC. This chapter explains how to design an effective user interface, and how to handle data security and control issues. The chapter stresses the importance of user feedback and involvement in all design decisions.
OBJECTIVES
When you finish this chapter, you will be able to :
· Explain the concept of user interface design and human-computer interaction, including basic principles of user-centered design
· Explain how experienced interface designers perform their tasks
· Describe rules for successful interface design
· Discuss input and output technology issues
· Design effective source documents and forms
· Explain printed output guidelines
· Describe output and input controls and security
· Explain modular design and prototyping techniques
INTRODUCTION
User interface design is the first task in the systems design phase of the SDLC. Designing the interface is extremely important because everyone wants a system that is easy to learn and use.
After discussing the user interface, human-computer interaction, and interface design rules, the chapter describes output, data security and control issues, prototyping, and the next steps in the systems design process.
PREVIEW CASE: Mountain View College Bookstore
Background: Wendy Lee, manager of college services at Mountain View College, wants a new information system that will improve efficiency and customer service at the three college bookstores.
In this part of the case, Tina Allen (systems analyst) and David Conroe (student intern) are talking about user interface design issues.
Participants:
Tina and David
Location:
Mountain View College Cafeteria, Monday afternoon, November 25, 2013
Project status:
Tina and David have examined development strategies for the new bookstore system. After performing cost-benefit analysis, they recommended in-house development of the new bookstore system. Now they are ready to begin the systems design phase by working on user interface design for the new system.
Discussion topics:
User interface design concepts and principles
Tina:
Hi, David. Ready to start work on user interface design?
David:
Sure. Will we start with output because it’s important to users?
Tina:
Output is very important, but the most important issue for users is the interface itself. For example, is it easy to learn? Is it easy to work with? We’ll try to design everything — output, input, and all the other elements — from a user’s point of view.
David:
How do we do that?
Tina:
Well, many sources of information about effective design concepts and principles are available. We’ll study those, and then ask our own users for their input and suggestions.
David:
What about input and data entry?
Tina:
Good question, You’ve heard the old saying, “garbage in, garbage out.” User interface principles apply to user input generally, but repetitive data entry deserves special attention. We need to create screen forms that are logical and easy to understand, as well as input masks and data entry validation rules. We also need to review any source documents that will be filled in manually.
David:
Anything else?
Tina:
Yes. The bookstore system probably will have some confidential data regarding budgets and markup policies, so we’ll have to consider security and control issues. If you’re ready, here’s a task list to get us started:
FIGURE 8-1 Typical user interface design tasks.
© Cengage Learning 2014
SYSTEMS DESIGN PHASE OVERVIEW
Because the components of a system are interdependent, the design phase is not a series of clearly defined steps. Although you might start in one area, you could find yourself working with several different elements at the same time. For example, a decision to change a report format might require changes in data design or input screens. Your design checklist will include the user interface, input and output procedures, data design, and system architecture. At the end of this phase, you will prepare a systems design specification and deliver a presentation to management.
The goal of systems design is to build a system that is effective, reliable, and maintainable.
· A system is reliable if it handles input errors, processing errors, hardware failures, or human mistakes. A good design will anticipate errors, detect them as early as possible, make it easy to correct them, and prevent them from damaging the system itself.
· A system is maintainable if it is flexible, scalable, and easily modified. Changes might be needed to correct problems, adapt to user requirements, or take advantage of new technology.
· A system is effective if it supports business requirements and meets user needs.
Although each project is different, the following basic principles usually apply.
Will It Succeed?
A system might have advanced technology and powerful features, but the real test is whether users like it and feel that it meets their needs. Here are some suggestions for successful design:
· Think like a user. Carefully examine any point where users provide input or receive output. The user interface must be easy to learn. Input processes should be easy to follow, intuitive, and forgiving of errors. Predesigned output should be attractive and easy to understand, with an appropriate level of detail.
· Anticipate future needs. Consider a parts inventory database that contains a one-character field for category, such as electrical, mechanical, or hydraulic. The design works well, but what if the company decides to break these overall groups down into more specific segments? A better design would anticipate possible expansion to two or more characters. For example, in 1999, there was widespread concern about what was called the Y2K issue because many older programs used only two characters to store the year, and might not recognize the start of a new century.
· Provide flexibility. Suppose that a user wants a screen display of all customer balances that exceed $5,000 in an accounts receivable system. How should you design that feature? The program could be coded to check customer balances against a fixed value of 5000, which is a simple solution for both the programmer and the user because no extra keystrokes are required to produce the display. However, that approach is inflexible. A better approach would be to let the user enter the amount. Or you could start with a default value that displays automatically. Users can press ENTER to accept the value, or type in another value. Often the best design strategy is to offer several alternatives, so users can decide what will work best for them.
· Manage data effectively. In addition to its effect on users, data management impacts company efficiency, productivity, and security. To reduce input errors, the system should enter and verify data as soon as possible, and each data item should have a specific type, such as alphabetic, numeric, or alphanumeric, and a range of acceptable values.
It is important to collect input data as close to its source as possible. For instance, using barcode scanners rather than manual forms on a warehouse freight dock, or having salespeople use tablets to record orders rather than filling in source documents. The easiest, most accurate, and least expensive data input strategy is automated data capture, such as the RFID scanner shown in Figure 8-2 .
In an efficient design, data is entered only once. For example, if input data for a payroll system also is needed for a human resources system, you can either design an interface to transfer data automatically, or create a central data storage area that both systems can access. In Chapter 9 , you will learn about normalization, which is a set of rules that can help you avoid data design problems. A secure system also includes audit trails that can log every instance of data entry and changes. For example, the system should record when a customer’s credit limit was set, by whom, and any other information necessary to construct the history of a transaction.
FIGURE 8-2 Automated data entry methods, such as the RFID scanner shown above, reduce input errors and improve employee productivity.
Courtesy of Intermec Technologies
CHAPTER OVERVIEW
Traditionally, a chapter on user interface design started with a discussion of output because output is what users touched, viewed, and needed to do their jobs. Today, the entire focus has shifted, for several important reasons:
· Users can design their own output. System designers are more aware of user needs and desires. A system can maintain data integrity and still allow users to view, sort, filter, and examine data in any way that helps them do their jobs. Years ago, the MIS department made those choices and users had little or no say in the matter. Today, successful applications are designed quite differently — the system developer identifies user needs, and then creates a design that will satisfy users and meet corporate requirements.
· Centralized IT departments no longer produce reams of printed reports. Those reports, called greenbar reports because of their appearance, often gathered dust while sitting on top of file cabinets. While a few examples might persist, the overwhelming trend has been to customer-designed output. The customer might be an individual user, or a community of users, such as a department. As Chapter 4 pointed out, the IT team must understand user requirements before creating a solution. That also was the message in the Dilbert cartoon on page 129 .
· The user interface itself has evolved into a two-way channel, with powerful output capability, and most user information needs can be met with screen-generated data, which a user can print, view, or save. Well into the 1980s and beyond, a user interface was a blank character-based screen, which might or might not offer menu choices. If a user entered a command improperly, the system responded with an error message, which frustrated users and stifled productivity. Many hardware-centric vendors did not understand the importance of the user interface and its implications.
Apple was a pioneer in user interface development, introducing the graphical user interface (GUI) , complete with mouse and screen icons, in the early 1980s. At that point, not many companies were ready for this concept. When software giant Microsoft finally jumped on the GUI bandwagon with its Windows® operating system, the corporate doors swung open, and everyone from managers on down said “How did we ever do without this?”
The user interface will continue to evolve, and it is difficult to predict the future. Advanced technology will support the evolution, but the real driving force will be user empowerment, which results in employee satisfaction, increased productivity, and bottom-line savings for a company.
WHAT IS A USER INTERFACE?
A user interface (UI) describes how users interact with a computer system, and consists of all the hardware, software, screens, menus, functions, output, and features that affect two-way communications between the user and the computer. The UI is the key to usability , which includes user satisfaction, support for business functions, and system effectiveness.
Figure 8-3 suggests an interesting viewpoint that interface designers should keep in mind: Industry leader IBM believes that the best interfaces are the ones that users do not even notice — they make sense because they do what users expect them to do.
When developing older systems, analysts typically designed all the printed and screen output first, then worked on the inputs necessary to produce the results. Often, the user interface mainly consisted of process-control screens that allowed the user to send commands to the system. That approach worked well with traditional systems that simply transformed input data into structured output.
FIGURE 8-3 According to IBM, the best user interfaces are the ones you don’t really notice.
© IBM Corporation 1994, 2012
As information management evolved from centralized data processing to dynamic, enterprise-wide systems, the primary focus also shifted — from the IT department to the users themselves. The IT group became a supplier of information technology, rather than a supplier of information. Today, the main focus is on users within and outside the company, how they communicate with the information system, and how the system supports the firm’s business operations.
In a user-centered system, the distinction blurs between input, output, and the interface itself. Most users work with a varied mix of input, screen output, and data queries as they perform their day-to-day job functions. Because all those tasks require interaction with the computer system, the user interface is a vital element in the systems design phase.
User interface design requires an understanding of human-computer interaction and user-centered design principles, which are discussed in the next section.
Human-Computer Interaction
A user interface is based on basic principles of human-computer interaction. Human-computer interaction (HCI) describes the relationship between computers and people who use them to perform their jobs, like the worker shown in Figure 8-4 . HCI concepts apply to everything from smartphones to global networks. In its broadest sense, a user interface includes all the communications and instructions necessary to enter input to the system and to obtain output in the form of screen displays or printed reports.
Early user interfaces involved users typing complex commands on a keyboard, which displayed as green text on a black screen. Then came the graphical user interface (GUI), which was a huge improvement because it used icons, graphical objects, and pointing devices. Today, designers strive to translate user behavior, needs, and desires into an interface that users don’t really notice. As IBM points out in Figure 8-3 , the best user interfaces are “almost transparent— you can see right though the interface to your own work.” In other words, a transparent interface does not distract the user and calls no attention to itself.
As a systems analyst, you will design user interfaces for in-house-developed software and customize interfaces for various commercial packages and user productivity applications. Your main objective is to create a user-friendly design that is easy to learn and use.
Industry leaders Microsoft and IBM both devote considerable resources to user interface research. Figure 8-5 on the next page describes Microsoft’s Redmond labs, where engineers observe volunteers who participate in software usability studies. Notice that the site invites visitors to watch an interesting video about Microsoft User Research.
Because HCI has a major impact on user productivity, it gets lots of attention — especially where multi-million dollar issues are concerned. For example, consider the article by Elizabeth Gardner in Health Data Management, which is shown in Figure 8-6 on the next page. The title tells the story, which involves government incentives for medical providers who use the new electronic health records (EHRs) . However, many physicians feel that EHR software is difficult to use and does not meet their needs.
FIGURE 8-4 HCI is essential to employee productivity, whether the work is done in a traditional office setting, or on a construction site like the one shown here.
© Goodluz/Shutterstock.com
FIGURE 8-5 Microsoft engineers observe volunteers who participate in usability studies. Notice the invitation to watch a video about Microsoft User Research.
Screenshots used with permission from Microsoft.
FIGURE 8-6 Software usability has a major impact on the medical profession, and not everyone is happy about it.
© 2012 Health Data Management and SourceMedia, Inc.
In her article, Ms. Gardner points out that physicians often multi task, answering a question about one patient while writing a prescription for another, and EHR software was not designed around that type of workflow.
The article also mentions Dr. Scott Finley, who consults on usability issues for the U.S. Department of Veterans’ Affairs and other agencies. Dr. Finley says that EHRs were designed to do a good job of gathering structured analytical data, but that approach does not promote usability. Dr. Finley says, “The data capture process needs to be judged on its own merits. It’s easier to make it hard than to make it easy.” Perhaps all systems analysts and UI designers should reflect on the implications of his comment.
CASE IN POINT 8.1: CASUAL OBSERVER SOFTWARE
Casual Observer Software’s main product is a program that monitors and analyzes user keystrokes and mouse clicks to learn more about the way employees use their computer systems. The problem is that some users feel this is an unwarranted intrusion into their privacy, and they prefer not to be observed. Some even fear that the data would be used for other reasons, including performance appraisal. You are a consultant who has been hired by a client firm that is trying to decide whether or not to use this software.
Before you advise the client, go back and review the Microsoft usability lab shown in Figure 8-5 , where the users being studied in the Redmond labs were willing participants. Then, refer to Chapter 4 , Requirements Modeling, page 155 , and consider the Hawthorne Effect, which suggests that employees might behave differently when they know they are being observed. Finally, think about the ethical issues that might be involved in this situation. What will you advise your client, and why?
SEVEN HABITS OF SUCCESSFUL INTERFACE DESIGNERS
Although IT professionals have different views about interface design, most would agree that good design depends on seven basic principles, which are described in the following sections.
Understand the Business
The interface designer must understand the underlying business functions and how the system supports individual, departmental, and enterprise goals. The overall objective is to design an interface that helps users to perform their jobs. A good starting point might be to analyze a functional decomposition diagram (FDD). As you learned in Chapter 4 , an FDD is a graphical representation of business functions that starts with major functions, and then breaks them down into several levels of detail. An FDD can provide a checklist of user tasks that you must include in the interface design.
Maximize Graphical Effectiveness
Studies show that people learn better visually. The immense popularity of Apple Mac OS and Microsoft Windows is largely the result of their graphical user interfaces that are easy to learn and use. A well-designed interface can help users learn a new system rapidly and be more productive. Also, in a graphical environment, a user can display and work with multiple windows on a single screen and transfer data between programs. If the interface supports data entry, it must follow the guidelines for data entry screen design that are discussed later in this chapter.
Think Like a User
A systems analyst should understand user experience, knowledge, and skill levels. If a wide range of capability exists, the interface should be flexible enough to accommodate novices as well as experienced users.
To develop a user-centered interface, the designer must learn to think like a user and see the system through a user’s eyes. The interface should use terms and metaphors that are familiar to users. Users are likely to have real-world experience with many other machines and devices that provide feedback, such as automobiles, ATMs, and microwave ovens. Based on that experience, users will expect useful, understandable feedback from a computer system.
Use Models and Prototypes
From a user’s viewpoint, the interface is the most critical part of the system design because it is where he or she interacts with the system — perhaps for many hours each day. It is essential to construct models and prototypes for user approval. An interface designer should obtain as much feedback as possible, as early as possible. You can present initial screen designs to users in the form of a storyboard , which is a sketch that shows the general screen layout and design. The storyboard can be created with software or drawn freehand. Users must test all aspects of the interface design and provide feedback to the designers. User input can be obtained in interviews, via questionnaires, and by observation. Interface designers also can obtain data, called usability metrics , by using software that can record and measure user interaction with the system.
TOOLKIT TIME
The Communication Tools in Part A of the Systems Analyst’s Toolkit can help you communicate effectively with users. To learn more about these tools, turn to Part A of the four-part Toolkit that follows Chapter 12 .
Focus on Usability
The user interface should include all tasks, commands, and communications between users and the information system. The opening screen should show the main options ( Figure 8-7 is an illustration). Each screen option leads to another screen, with more options. The objective is to offer a reasonable number of choices that a user easily can comprehend. Too many options on one screen can confuse a user — but too few options increase the number of submenu levels and complicate the navigation process. Often, an effective strategy is to present the most common choice as a default but allow the user to select other options.
Invite Feedback
Even after the system is operational, it is important to monitor system usage and solicit user suggestions. You can determine if system features are being used as intended by observing and surveying users. Sometimes, full-scale operations highlight problems that were not apparent when the prototype was tested. Based on user feedback, Help screens might need revision and design changes to allow the system to reach its full potential.
FIGURE 8-7 The opening screen displays the main options for a student registration system. A user can click an option to see lower-level actions and menu choices.
© Cengage Learning 2014
Document Everything
You should document all screen designs for later use by programmers. If you are using a CASE tool or screen generator, number the screen designs and save them in a hierarchy similar to a menu tree. User-approved sketches and storyboards also can be used to document the user interface.
By applying basic user-centered design principles, a systems analyst can plan, design, and deliver a successful user interface.
A HANDBOOK FOR USER INTERFACE DESIGN
What follows is a set of suggestions for user interface design, based on the author’s experience and observation. There is some overlap because many of the main rules share common elements.
Although there is no standard approach to interface design, these rules will get you started. Perhaps the most important rule is that you don’t have to follow all of these recommendations — the best interface is the one that works best for your users.
RULE 1: Create an Interface That Is Easy to Learn and Use
1.1 Focus on system design objectives, rather than calling attention to the interface.
1.2 Create a design that is easy to understand and remember. Maintain a common design in all modules of the interface, including the use of color, screen placements, fonts, and the overall “look and feel.”
1.3 Provide commands, actions, and system responses that are consistent and predictable.
1.4 Allow users to correct errors easily.
1.5 Clearly label all controls, buttons, and icons.
1.6 Select familiar images that users can understand, and provide on-screen instructions that are logical, concise, and clear. For example, the top screen in Figure 8-8 shows four control buttons, but none of them has an obvious meaning. In the bottom screen, the first five messages provide little or no information. The last message is the only one that is easy to understand.
1.7 Show all commands in a list of menu items, but dim any commands that are not available to the user.
1.8 Make it easy to navigate or return to any level in the menu structure.
RULE 2: Enhance User Productivity
The interface is where a user interacts with the system, so it can have a dramatic effect on productivity. If the interface empowers a user and enables him or her to handle more complex tasks, the user becomes more productive. Conversely, if the interface is difficult to work with, productivity declines.
FIGURE 8-8 In the example at the top, the icons do not have a clear message. In the Help text examples at the bottom, only one message is understandable. The others would frustrate and annoy most users.
© Cengage Learning 2014
2.1 Organize tasks, commands, and functions in groups that resemble actual business operations. You should group functions and submenu items in a multilevel menu hierarchy, or tree, that is logical and reflects how users typically perform the tasks. Figure 8-9 shows an example of a menu hierarchy for an order tracking system.
2.2 Create alphabetical menu lists or place the selections used frequently at the top of the menu list. No universally accepted approach to menu item placement exists. The best strategy is to design a prototype and obtain feedback from users. Some applications even allow menus to show recently used commands first. Some users like that feature, but others find it distracting. The best approach is to offer a choice, and let users decide.
2.3 Provide shortcuts for experienced users so they can avoid multiple menu levels. You can create shortcuts using hot keys that allow a user to press the Alt key + the underlined letter of a command.
2.4 Use default values if the majority of values in a field are the same. For example, if 90% of the firm’s customers live in Albuquerque, use Albuquerque as the default value in the City field.
2.5 Use a duplicate value function that enables users to insert the value from the same field in the previous record, but allow users to turn this feature on or off as they prefer.
2.6 Provide a fast-find feature that displays a list of possible values as soon as users enter the first few letters.
2.7 If available, consider a natural language feature that allows users to type commands or requests in normal text phrases. For example, many applications allow users to request Help by typing a question into a dialog box. The software then uses natural language technology to retrieve a list of topics that match the request. Natural language technology is used in speech recognition systems, text-to-speech synthesizers, automated voice response systems, Web search engines, text editors, and language instruction materials.
RULE 3: Provide Users with Help and Feedback
This is one of the most important rules because it has a high impact on users. Never allow Help to slow a user down. Instead, make Help easy to find, but not around when you users don’t need it.
FIGURE 8-9 This menu hierarchy shows tasks, commands, and functions organized into logical groups and sequences. The structure resembles a functional decomposition diagram (FDD), which is a model of business functions and processes.
© Cengage Learning 2014
FIGURE 8-10 The main Help screen for a student registration system.
© Cengage Learning 2014
FIGURE 8-11 A context-sensitive dialog box displays if a user requests help while entering data into the ADVISOR ASSIGNED field. Clicking the Close button returns the user to the task.
© Cengage Learning 2014
3.1 Ensure that help is always available on demand. Help screens should provide information about menu choices, procedures, shortcuts, and errors.
3.2 Provide user-selected help and context-sensitive help. User-selected help displays information when the user requests it. By making appropriate choices through the menus and submenus, the user eventually reaches a screen with the desired information. Figure 8-10 shows the main Help screen for the student registration system. Context-sensitive help offers assistance for the task in progress. Figure 8-11 shows a Help dialog box that is displayed if a user requests help while entering data into the ADVISOR ASSIGNED field. Clicking the Close button returns the user to the current task.
3.3 Provide a direct route for users to return to the point from where help was requested. Title every help screen to identify the topic, and keep help text simple and concise. Insert blank lines between paragraphs to make Help easier to read, and provide examples where appropriate.
3.4 Include contact information, such as a telephone extension or e-mail address if a department or help desk is responsible for assisting users.