9902.ch256 1/8/02 2:10 PM Page 1 PROOF User/System Interface Design Theo Mandel Interface Design and Development I. DEFINITIONS V. USER-CENTERED DESIGN PRINCIPLES II. HISTORY OF HUMAN–COMPUTER INTERFACE VI. THE WEB USER EXPERIENCE III. THE INTERFACE DESIGN AND USABILITY PROCESS VII. NEW DIRECTIONS IN HUMAN–COMPUTER INTERACTION IV. FUNDAMENTALS OF INTERFACE DESIGN VIII. INTERFACE DESIGN AND USABILITY RESOURCES GLOSSARY usability evaluation A test of either an actual program or device or a representation (prototype) of the computer–human interface (CHI) See Interface. system. Data obtained usually includes user perfor- graphical user interface (GUI) A user interface which mance (time, success, errors, and accuracy) and presents information graphically, typically with win- subjective responses of test participants. dows, buttons, and icons that are sizable and mov- user interface (UI) See Interface. able, as opposed to a textual user interface, where user experience The environment encompassing all information is presented on a text-based screen aspects of the end-user’s interaction with a com- and commands are typed by the user. A GUI rep- puter system, program, or Web site. In order to resents and displays a visual metaphor (such as a achieve a high-quality user experience, there must desktop) for a computer operating system or be a seamless merging of multiple disciplines, in- application. cluding engineering, marketing, graphical design, human–computer interface (HCI) See Interface. and interface design. human factors The discipline devoted to under- world wide web consortium (W3C) The industry standing and improving how humans interact with group responsible for establishing guidelines and the world around them. Research in human cog- standards for Web accessibility. nitive and social psychology, perception, and phys- world wide web (WWW) A vast network of computer ical and biological characteristics is used to apply systems. Also called the Web and the Internet. that information to the design, operation, and use WYSIWYG An acronym meaning “what you see is of products or systems for optimizing human per- what you get.” WYSIWYG refers to the technology formance, health, and safety. (syn. ergonomics.) that enables users to see images on-screen exactly interface The place where two independent systems as they will appear when printed out. As screen and meet and communicate. The presentation, naviga- printer fonts have become more sophisticated, and tion, and interaction of information between a as GUIs have improved their display, people have computer system and a user. come to expect everything to be WYSIWYG. Un- intranet A controlled, private network of computer fortunately, this is not always the case. systems for use by employees within a corporation. object-oriented user interface (OOUI) A graphical user interface that also represents objects the user THE GROWTH of the personal computer and work- works with and the behaviors and interactions users station computer markets has meant that sales of com- have with those objects. puters and software, as well as sales of services and usability The ability of a product to be used in an ef- products over the World Wide Web, are more directly fective and meaningful way by the intended user. tied to the quality of their interfaces than ever in the Encyclopedia of Information Systems, Volume Four Copyright © 2002 by Academic Press. All rights of reproduction in any form reserved. 256-1 9902.ch256 1/8/02 2:10 PM Page 2 PROOF 256-2 User/System Interface Design past. The result has been the gradual evolution of a tools, machines, systems, tasks, jobs, and an environ- standardized interface architecture, from hardware ment for productive, safe, comfortable, and effective support of mice to shared window systems to “appli- human use. cation management layers.” Along with these changes, The field of ergonomics arose from studies of how researchers, designers and developers have begun to humans interact with their environment, especially in develop specification, design, and testing techniques the workplace. The concerns of ergonomics tend to for the production of usable interfaces. be at the sensory-motor level, but with an additional User/system interface design is a complex disci- physiological flavor and an emphasis on stress. Er- pline that draws from a number of fields. In simple gonomic studies of computers and the workplace in- terms, the basic goals are to design and build systems vestigate the relationship between humans and the that are effective, are intuitive, and meet the goals of work setting, including the effects of stress, routine a set of users. By definition, a user, system, interface, work tasks, sitting posture, keyboard use, mouse us- and designer are involved. age, height and distance of computer monitors, and any other factors involved in the work environment. • User: He or she uses the system to accomplish Human–computer interaction (HCI; also com- tasks and achieve goals. puter–human interaction, CHI) is the discipline con- • System: A set of connected things or parts that cerned with the design, evaluation, and implementa- form a whole or work together. Specifically, a tion of interactive computing systems for human use (computer) program designed to provide (both hardware and software) and with the study of information and functionality to the user. human interaction with computers. HCI is a subset of • Interface: The presentation, communication, and the HF discipline, focusing on computer hardware interaction between the user and the system. and software as the “system” as defined above. • Designer: The person responsible for building the The term interface is used commonly in the HF field system based on his or her understanding of users and should be more clearly defined. An interface is and their tasks, goals, abilities, and motivations. the place at which independent systems meet and act on or communicate with each other. Narrowly de- Because user/system interface design studies a human fined, the user interface (UI) is composed of input and a machine in communication, it draws from dis- and output devices, as well as the information that ciplines on both the human and the machine side. On users see and interact with on the computer screen. the human side, relevant disciplines include cognitive More broadly defined, the UI includes everything that psychology, information architecture, communication shapes users’ involvement with the systems, informa- theory, graphic design, industrial design, linguistics, tion, and humans as they perform tasks using com- social sciences, and human performance. On the ma- puters. This includes on-line and hardcopy product chine side, the fields of computer science, computer documentation, additional documentation, training, graphics, operating systems, programming languages, personal and remote technical support, and other and development environments are relevant. tools needed to perform the task. A more encom- passing description of the computer–user interface is I. DEFINITIONS the term “user experience.” Usability guru Jakob Nielsen defines user experience on his Web site (www.nngroup.com/about/userexperience.html) as, The human race spends a great deal of time sitting down, whether working in an office, studying in a li- User experience encompasses all aspects of the end- brary, commuting by bus, car, or airplane, or eating user’s interaction with the company, its services, and in a restaurant. Some seats are far more comfortable its products. The first requirement for an exemplary than others. user experience is to meet the exact needs of the cus- tomer, without fuss or bother. Next comes simplicity Barry H. Kantowitz and Robert D. Sorkin (1983) and elegance that produce products that are a joy to own, a joy to use. True user experience goes far be- User/system interface design addresses a wide range yond giving customers what they say they want, or of both users and systems. Human factors (HF) is the providing checklist features. In order to achieve high- discipline that tries to optimize the relationship be- quality user experience in a company’s offerings there tween technology and humans. HF discovers and ap- must be a seamless merging of the services of multi- plies information about human behaviors, abilities, ple disciplines, including engineering, marketing, limitations, and other characteristics to the design of graphical and industrial design, and interface design. 9902.ch256 1/8/02 2:10 PM Page 3 PROOF User/System Interface Design 256-3 Perhaps the most common interface term used today for the ball mouse in 1974 by Xerox. The idea came is the acronym GUI. A graphical user interface (GUI) suddenly to Ron Rider, “I suggested that they turn a utilizes intuitive or familiar symbols (pictures and trackball upside down, make it small, and use it as a icons) to display system programs and files that users mouse instead. Easiest patent I ever got. It took me directly manipulate to perform user tasks and system five minutes to think of, half an hour to describe to functions. Today’s computer operating systems (Mi- the attorney, and I was done.” Apple Computer re- crosoft Windows and Apple Macintosh) are the most designed the mouse in 1979, using a rubber ball rather familiar examples of GUIs. than a metal one. Variations on the ball mouse are what GUI users mostly mouse with today. The first operating system designed around the II. HISTORY OF HUMAN–COMPUTER GUI was a Xerox in-house computer system called the INTERFACE AND GRAPHICAL USER INTERFACES Alto in the early 1970s. It had multiple, overlapping windows; used pop-up menus; and, of course, came HCI arose as a field from intertwined roots in com- with a mouse. Around 1976, icons were added to the puter graphics, operating systems, HF, ergonomics, on-screen desktop. The research and design of the industrial engineering, cognitive psychology, and com- Alto system led to the first commercial GUI product, puter science. The cognitive aspects of users will be the Xerox Star, in 1981.