User Interface Design - Software Design - Software Engineering: A Methodical Approach (2014)

Software Engineering: A Methodical Approach (2014)

PART C. Software Design

Chapter 11. User Interface Design

User interface management is a field of computer science that has been developed and given much attention in recent years (since the 1980’s). Indeed, it is being taught as a separate subject in several curricula of Computer Science or Information Technology. Several texts have been written on the subject. It is therefore impossible to cover all that is entailed in one chapter. However, since user interface design is a very important aspect of software design, a brief summary of the subject matter is provided here.

The chapter proceeds under the following subheadings:

· Introduction

· Types of User Interfaces

· Steps in User Interface Design

· Overview of Output Design

· Output Methods versus Content and Technology

· Guidelines for Designing Output

· Overview of Input Design

· Guidelines for Designing Input

· Summary and Concluding Remarks

11.1 Introduction

A user interface is the portion of computer software that facilitates human-computer interaction (HCI). Moreover, it is the window through which end users access the software system. As you are aware, most software systems have user interfaces.

User interface design is therefore applicable to all software systems that require user interaction. It is through the user interface that users communicate with the software and with each other. Many good software products have suffered neglect in the marketplace, due to poor user interface design. On the other hand, many mediocre products have managed to survive market competition, due to attractive user interface design and aggressive marketing. Proper user interface design is therefore critical, since this could determine the user acceptance and by extension, the success of the software system in the marketplace.

There are five main aspects of a user interface. These are:

· User Needs

· Human Factors

· Interface Design

· Interface Programming

· Environment

A well-designed user interface will meet the requirements in all of these areas. It will enhance effective use of the software, thus promoting end user confidence in the product. Let us briefly look at each aspect.

11.1.1 User Needs

Among the basic user needs that the user interface must address are the following:

· Functionality — the capacity provided the user to carry out desired tasks and activities.

· Flexibility — the provision of alternative approaches to solving a problem.

· Effective Control — users like to feel that they are in control and not the software system.

· Reliability — the software must offer the user some assurance that it will facilitate solution to certain problems in a consistent manner.

· Security — controlled access to the overall system, specific resources of the system, and data managed by the system.

· Consistency of Design —the user must be able to anticipate system behavior; also information must be presented to the user in a consistent manner.

· Standardization — the user interface must conform to established standards for the software.

· Intelligibility — the user interface must promote easy learning and understanding of the system.

11.1.2 Human Factors

Good user interface design must be guided by the following human factors:

· Minimal Memory Taxation: Taxation on human memory should be kept at a minimum.

· Minimal Skilled Activities: Required number of skilled tasks should be minimized; it is better to have a few skilled tasks and several operational tasks, than vice versa.

· Shortcuts: Shortcuts should exist for experienced users.

· Help Facility: There should be a help facility for all users.

· Good Color Scheme: The color scheme must not create pressure on the eye, but must be welcoming.

· Minimal Assumptions: The number of blanket assumptions about users should be kept at a minimum.

11.1.3 Design Considerations

The following considerations should be factored into the design and construction of a user interface:

· Command Alignment: Are the commands used appropriately aligned to typical human thinking?

· Understandability: How easily learned and understood are the system rules?

· Semantic Alignment: How aligned are the terminologies and other semantics to typical human thinking in that problem domain?

· User Categories: Are all user categories (experts, knowledgeable intermittent, and novices) catered for?

· Screen Design: How adequate are the user panels? Is there consistency among the panels?

· System Documentation: How adequate is the system documentation (including the help system)? Is the design appropriate?

· System Menu: How well-structured and adequate is the menu system?

· User Interactions: What kinds of user interaction are allowed?

· System Messages: How are feedback and diagnostic error messages handled?

· Reversibility of Actions: Can users reverse their actions if they need to?

· Change Confirmation: Do users get a chance to confirm their requests for changes before these changes take effect?

· Locus of Control: Who has control (or the perception of it) — the system or the user?

· Responsiveness: How responsive is the system?

· Complexity Hiding: Are users shielded from complexity details, or are they overwhelmed by the system complexity?

· Usability: How easy is it to learn and use the system?

11.1.4 User Interface Preparation

Preparation of the user interface involves actual development (programming) as well as preparation of the operating environment. Actual user interface development will be discussed further in chapter 14. As for preparation of the operating environment, this involves various issues related to the following:

· Office preparation

· Computer site preparation

Against this background, various user interface theories and models have been developed. Your course in user interface management explores these; they will therefore not be explored any further in this chapter (for additional insights, see [Schneiderman, 2005]). Rather, we will focus our attention on user interface design alternatives.

11.2 Types of User Interfaces

User interfaces can be put into three broad categories — menu-driven interface , command interface, and graphical user interface (GUI). Command interface is the oldest category. Traditionally, this is how software systems were written. In order to use a command-based system, one had to first be familiarized with the command language for the system. Older operating systems such as Unix and System i (formerly OS-400) are still predominantly command-based. Next are menu-driven systems. They are characterized by menu(s) of options from which the user selects the desired option. The System i operating system is also menu-driven — you can access each system command from a menu. Many legacy systems that run on mainframes and minicomputers are menu-driven. The GUI is the newest type of user interface, and it represents the contemporary trend. You are able to use a mouse to select items (also from a menu), to drag and drop objects, and perform several other activities that we often take for granted. Figure 11-1 compares the approaches in terms of relative complexity of design (COD), response time (RT), and ease of usage (EOU) for each user interface category.

image

Figure 11-1. Comparison of User Interface Categories

Up until the mid-1990s, menu driven interfaces were the most frequently used, dominating the arena of business information and application systems. Since the late 1980s, GUIs have become very popular, and clearly dominate user interfaces of the current era. Of course, the approaches can be combined. An excellent example of a software system that combines all three user interface categories is the System i operating system. Being traditionally command-based, modern versions of the operating system fully support all three user interaction categories. Another example of this hybrid approach is the Windows operating system. Though predominantly GUI-based, you are allowed to key in specific system commands if you so choose. The operating systems Linux and Unix tend to be the opposite of Windows. Though predominantly command-based, each supports various GUI-based systems that can be superimposed on the underlying command-based system.

The interaction styles facilitated depend to a large extent on the type of interface supported. There are seven possible interaction styles, summarized in Figure 11-2 below:

image

Figure 11-2. Interaction Styles for User Interfaces

11.3 Steps in User Interface Design

How you design the user interface will depend to a large extent on the type of user interface your software requires, It will also depend on the intended users of the software (experts, knowledgeable intermittent, or novices).

11.3.1 Menu or Graphical User Interface

If the user interface is to be menu driven or graphical, the following steps are recommended (assuming object-oriented design):

1. Put system objects (structures and operations) into logical groups. At the highest level, the menu will contain options pointing to summarized logical groups.

2. For each summarized logical group, determine the component sub-groups where applicable, until all logical groups have been identified.

3. Let each logical group represent a component menu.

4. For each menu, determine options using an object oriented strategy to structure the menu hierarchy (object first, operation last).

5. Design the menus to link the various options. Develop a menu hierarchy tree or a user interface topology chart (UITC) as discussed in chapter 6.

The partial UITC of chapter 6 has been repeated in Figure 11-3 for ease of reference. This chart relates to the CUAIS project of earlier discussions. Also recall from section 6.4.2 that the UITC is comparable to Schneideman’s Object-Action Interface (OAI) model for user interfaces [Schneiderman, 2005].

image

image

Figure 11-3. Partial UITC for the CUAIS Project

11.3.2 Command-Based User Interface

If the user interface is command driven, the following steps are recommended:

1. Develop an operations-set i.e. a list of operations that will be required.

2. Categorize the operations — user operations as opposed to system operations.

3. If an underlying database is involved, develop a mapping of operations with underlying database objects.

4. Determine required parameters for each operation.

5. Develop a list of commands (may be identical to operations set). If this is different from the operations set, each command must link to its corresponding system operations.

6. Define a syntax for the command language — how users will communicate with the commands (operations).

7. Develop a user interface support for each command (and by extension each operation). This interface support must be consistent with the defined command syntax.

8. Program the implementation of each operation.

Note that construction of a command-based user interface requires much more effort than a menu or graphical interface. This was not always the case: In the early days of visual programming, it was quite arduous to construct a GUI using traditional procedural programming languages. However, with the advent of object oriented CASE and RAD tools, constructing GUIs is much easier than before.

11.4 Overview of Output Design

An important aspect of the user interface is the output — the results users obtain from the software. Output may be in the form of printed copy, VDU display, tape, diskette, CD or audio; or in the case of expert systems and CAM/CIM systems, output may be in the form of produced motion and/or products. Through output, the software communicates with the user; it is therefore an important aspect of the user interface of computer software.

Let us concentrate on the more traditional and prevalent form of output, namely information. The system must produce outputs according to user requirements. In a way, output is one fundamental test of the usefulness of a system. Some information require little processing before output; in other cases, much processing may be required before output.

Below are some important objectives of software output:

1. The output must serve the intended purpose: It must not be redundant and it must be in the required form, if it is to fulfill its desired purpose.

2. The output must fit the user and the situation: For decision support systems, it must fit individual user needs; for management information systems, it must fit functional needs; for expert systems, it must reveal expert analysis as required by the human expert; for CASE and RAD tools, it must generate accurate and accessible code; and so on.

3. The output must be in correct quantity: With the proliferation of distributed systems, this matter is not as critical as it used to be when centralized systems dominated.

4. The output must be on time: This is particularly important in mission critical systems, real time systems and traditional centralized information systems. It is not as critical in distributed system where the user decides when to generate/access system outputs.

5. The method of output (VDU, print, tape storage, disk storage, CD storage, or audio) must be appropriate to the need.

11.5 Output Methods versus Content and Technology

The output method affects output content and presentation. For example, a screen display or a printed report will have screen heading, body and footnote; a tape or diskette file will just have raw data.

The output method also affects technology chosen to yield the output. For example, sound cards and speakers are required for audio output; printers are required for hard copy; special cameras are required for microfilm; etc.

External output leaves the organization and must adhere to standards, for such outputs. Internal output stays within the organization and must adhere to standards for such output.

In choosing output, the technological alternatives and quality factors (e.g. reliability, compatibility, and portability) are useful.

11.5.1 Printed Output

Printed output is one of the most common output methods (the other being monitor display). It is inexpensive and can serve a wide and varied users population.

For printed output, required volume also affects choices with respect to the related technology. To illustrate, the type of printer depends on the print volumes required, the speed required, frequency required, quality required.

Reports must be properly formatted, according to established standards. Usually, each operation spec (for system output) has associated output layouts for the programmer.

11.5.2 Monitor Display

Monitor display is the other most common output method. Apart from an initial cost of acquiring a visual display unit (VDU) or workstation, it is very fast and economical. Additionally, thanks to GUIs, monitor display is very attractive and effective in enhancing the user’s understanding of system outputs.

Monitor display is also very convenient: the user can assess information before transferring to more expensive output medium e.g. printing.

One limitation of monitor display is that the number of users that can benefit is to some extent, constrained by the available number of monitors. Of course, monitor display must conform to established standards.

11.5.3 Audio Output

Audio output is usually in the form of voice to a single user or multiple users in a building. This method of output has become quite common. It is useful in situations where users must be free of encumbrances, or where a message on an intercom is adequate communication to the end users.

Increasingly, individuals who have physical challenges and executives with very busy schedules are finding audio-based systems very convenient and helpful.

11.5.4 Microfilm/Microfiche

Microfilm/microfiche is traditionally used to store large volumes of data. It takes up approximately 1% of space a printed copy would take. Special machines are required to create microfilm files. Projector-like machines are then used to magnify the images so that they can be read.

Traditionally, microfilm technology has been used in legal offices, civil engineering, colleges, universities, and banks. The technology comes with a high price tag, since special equipments are required. It can also be time consuming to access information from microfilm machine.

11.5.5 Magnetic and Optical Storage

Traditionally, magnetic storages devices (disks and tapes) have been used for storing data for future usage. System backups are typically don onto disks or tapes; these devices are then stored safely until they are required. Also, before computer networks were as prevalent and sophisticated as they currently are, disks and tapes were used to transfer information between different organizations, or offices of an organization.

Optical storage devices (DVDs, CD-ROMs, CD-RWs) have become commonplace as storage media. These devices store much more information than their traditional predecessors. DVDs (digital versatile disks) are expected to dominate the future, due to their storage capacity and flexibility.

11.5.6 Choosing the Appropriate Output Method

Figure 11-4 provides a comparison of the output methods. Additionally, the following factors should be considered when making decisions about system output:

1. Who will use the output?

2. How many users will access the output?

3. Where is the output required?

4. What is the purpose of the output?

5. What response speed is required?

6. What volumes are required?

7. How frequently is the output required?

8. What are the anticipated operational cost? What is the initial setup cost?

9. What are the environmental requirements?

10.How long must the output be stored?

image

Figure 11-4. Comparison of Output Methods

11.6 Guidelines for Designing Output

Whatever the output medium, it must follow some basic guidelines. Let us briefly focus on these guidelines as they relate to printed output and screen output:

11.6.1 Guidelines for Designing Printed Output

The following guidelines relate to printed outputs:

1. Use information gathered during investigation phase to design reports according to user requirements.

2. Adhere to established software standards as they affect output design.

3. Use standard output design forms — headings, body and footnotes should conform to established standards.

4. Have a convention for representing variable information. Constant information is usually typed or written on output design forms. Variable information is usually indicated via some convention. For example, a string of Xs (as in XXXXXX...) is used to represent alphanumeric data; a string of 9s (as in 99999) is used to represent numeric data.

5. Decide on paper width (80, 132 or 198), quality and type.

6. Involve the user in the decision-making exercises.

7. The prototype and actual output should be well balanced and attractive.

11.6.2 Guidelines for Designing Screen Output

The above guidelines for printed output all apply to screen (monitor) output. Additionally, the following guidelines may be useful:

1. Where possible, use interactive prototypes to help the user to conceptualize the output being designed at an early stage. This may be supported by the software design tool being used (e.g. CASE tools, or presentation software with hyperlinks).

2. Keep screens simple and attractive.

3. Keep screen presentation consistent.

4. Facilitate user movement among screens.

5. Control the duplication of data on screens (duplicate only when necessary).

Screen movement is usually facilitated by one of the following:

· Scrolling

· Calling up detail (e.g. position cursor and press <Enter>)

· On-screen dialog

· Function Keys

Figure 11-5 illustrates these strategies. Screen movement could also be prototyped review section 5.6) and used as a good source of feedback from prospective users of the system.

image

image

Figure 11-5. Illustrating Screen Movements

11.7 Overview of Input Design

Input may be in the form of manual input, audio, magnetic and optical storage devices (output for magnetic or optical storage media is typically used as input for some other system). The arguments presented in the previous sub-section on magnetic and optical storage devices also apply here. We will therefore concentrate on manual inputs.

Desirable objectives of software inputs are as follows:

1. Input forms must capture all required data.

2. Input screens must be well-designed screens.

3. There must be well-designed forms and screens in order to achieve effectiveness, accuracy, ease of use, consistency, simplicity, and attractiveness.

4. If input is automatic, the input files must be in the required formats.

11.8 Guidelines for Designing Input

All the points and guidelines about the design of output screens (section 11.6) are applicable here.

In the interest of clarity, they are repeated here along with some additional guidelines:

1. Use information gathered during investigation phase to design inputs according to user requirements.

2. Adhere to established software standards as they affect input design.

3. Use standard input design forms — headings, body and footnotes should conform to established standards.

4. Have a convention for representing variable information. Constant information is usually typed or written on output design forms. Variable information is usually indicated via some convention. For example, a string of Xs (e.g. XXXXXX...) to represent alphanumeric data; a string of 9s (e.g. 99999, 999.99, etc.) to represent numeric data.

5. Involve the user in the decision-making exercises.

6. The prototype and actual input should be well balanced and attractive.

7. Where possible, use interactive prototypes to help the user to conceptualize the output being designed at an early stage. This may be supported by the software design tool being used (e.g. CASE tools, or a presentation software product that supports hyperlinks).

8. Keep screens simple and attractive.

9. Keep screen presentation consistent.

10.Facilitate easy user movement among screens and reversibility of actions.

11.Control the duplication of data on screens (duplicate only when necessary).

12.As much as possible, the screen must match the associated form from which data will be entered.

13.For color monitors, avoid outrageous color schemes.

14.Input screen design must conform to established standards of the organization.

15.The principles of forms design, discussed in chapter 2, must apply to the associated form. In particular:

✓ The form must fulfill its intended purpose i.e. it must collect the data required.

✓ It must be trivially easy to fill out the form with negligible or no error.

✓ The form must be attractive.

✓ The form may be designed via an appropriate software product and reviewed before implementation.

11.9 Summary and Concluding Remarks

Here is a summary of what we have covered in this chapter:

· The user interface is the window through which end users access the software system. It is critical that this component of the software system is properly designed as failure to do so could compromise the success of the software product.

· In planning the user interface, the software engineer must dive due consideration to the end user needs, human factors, design factors, environmental factors, and actual programming of the interface.

· There are three common types of user interfaces: command interface, menu-driven interface, and graphical user interface (GUI). Your approach in designing the interface will be influenced by the type of interface that is required.

· The software engineer must observe guidelines for designing system input as well as system output. Of course, the steps taken will be constrained by the type of input/output that is required.

There is much more that could be said about user interface design, but this chapter has given you an overview that you should find useful. In fact, many computer science programs include a course in this area. Before moving on, take a look as the user interface design section of the Inventory Management System project of appendix 10. The next chapter will discuss operations design.

11.10 Review Questions

1. What is a user interface? Why is user interface design important?

2. What are the five aspects of user interface design? For each of these areas, discuss the factors to be considered when a user interface is being designed.

3. Compare the three categories of user interfaces in terms of response time, ease of usage, and complexity of design.

4. Construct a grid that shows how various interaction styles apply to the different categories of user interface.

5. Outline the steps to be followed when designing a menu based user interface or a GUI. Also outline the steps to be followed when designing a command based user interface.

6. Construct a grid that compares the various output methods with respect to advantages and disadvantages of each.

7. State four basic guidelines for designing printed output. State four basic guidelines for designing screen output. State four basic guidelines for designing software input.

11.11 References and/or Recommended Reading

[Kendall, 2005] Kendall, Kenneth E. and Julia E. Kendall. Systems Analysis and Design 6th ed. Upper Saddle River, NJ: Prentice Hall, 2005. See chapter 11, 12, 14.

[Pressman, 2005] Pressman, Roger. Software Engineering: A Practitioner’s Approach 6th ed. Crawfordsville, IN: McGraw-Hill, 2005. See chapter 12.

[Schneiderman, 2005] Schneideman, Ben. Designing the User Interface 4th ed. Reading, MA: Addison-Wesley, 2005.

[Sommerville, 2006] Sommerville, Ian. Software Engineering 8th ed. Boston, MA: Addison-Wesley, 2006. See chapter 16.

[Van Vliet, 2000] Van Vliet, Hans. Software Engineering: Principles and Practice. New York, NY: John Wiley & Sons, 2000. See chapter 16.