Task-Centered User Interface Design
A Practical Introduction
by Clayton Lewis and John Rieman
Copyright ©1993, 1994: Please see the "shareware notice" at the front of the book.
Contents | Foreword | ProcessUsers&Tasks | Design | Inspections |User-testing | Tools | Documentation |

3.1 Working Within Existing Interface Frameworks
3.2 Making Use of Existing Applications
3.3 Copying Interaction Techniques From Other Systems
3.4 When You Need to Invent
3.5 Graphic Design Principles


3.3 Copying Interaction Techniques From Other Systems


Another kind of borrowing is copying specific interaction techniques from existing systems. If the style guides were good enough you might not have to do this, but the fact is the only way to get an adequate feel for how various interface features should be used, and how different kinds of information should be handled in an interface, is to look at what other applications are doing. The success of the Macintosh in developing a consistent interface style early in its life was based on the early release of a few programs whose interfaces served as models of good practice. An analogous consensus for the IBM PC doesn't really exist even today, but as it forms it is forming around prominent Windows applications like Excel or Word.


It follows from the need to borrow from other applications that you can't be a good designer without becoming familiar with leading applications. You have to seek them out, use them, and analyze them.


The key to "intelligent" borrowing, as contrasted with borrowing pure and simple, is knowing WHY things are done the way they are. If you know why an application used a tool palette rather than a menu of functions, then you have a chance of figuring out whether you want to have a palette or a menu. If you don't know why, you don't know whether the same or a different choice makes sense for you.


Bill Atkinson's MacPaint program was one of the standard- setting early Macintosh programs, and it used a tool palette, a box on the side of the window containing icons. The icons on the palette stand for various functions like "enter text", "move view window", "draw a rectangle", and the like. Why was this a good design choice, rather than just listing these functions in a pull-down menu? In fact, some similar functions are listed in a pulldown menu called "goodies". So should you have a palette for what you are doing or not?


Here are some of the considerations:


So... this tells you that you should use a tool palette in your application if you have operations that are often repeated consecutively, and you can think of good icons for them, and they require mouse interaction after the selection of the operation to specify fully what the operation does.


Depending on the style guide you are using, you may or may not find a good, full discussion of matters like this. One of the places where experience will pay off the most for you, and where talking with more experienced designers will be most helpful, is working out this kind of rationale for the use of various interface features in different situations.

HyperTopic: Some Kinds of Why's

Analyzing the why's of interface features is complicated and detailed, as the example showed. But it's possible to identify some broad kinds of arguments that crop up often.


Geometrical and Movement Arguments


Small targets are harder (and slower) to hit with a mouse than big targets; long mouse movements are slower than short ones; icons pack differently from text strings; more keystrokes take longer to type; switching between mouse and keyboard is slow.


Memory Arguments


It is easier to recognize something when you see it (for example on a menu) than it is to recall it from scratch (for example in typing in a command); it is hard to remember much information from one step in a process to another (so, for example, having help information available at the same time as the user carries out an operation is a good idea; more generally, information that is used together should be presented together); the interface should present key information, such as the current mode, rather than requiring the user to remember it.


Problem-Solving Arguments


Interface features should help the user to select operations that are relevant to their goals, by labelling the operations in ways that match the way the user thinks about his or her task; the user needs to know what an operation has actually done (the UNIX approach of saying nothing unless something goes wrong is useless if you are a learner and do not already know what the commands do); users will make mistakes, especially if they are exploring options, so give them a way to back out.


Attention Arguments


Information presented with a big change in the display is more likely to be read; information presented close to where the user is looking is more likely to be read; auditory signals cannot be ignored as easily as visual signals (this is a two-edged sword; sometimes you want to be able to ignore things).


Convention Arguments


If you do things the way your users are familiar with, they will be happier; conventional ways of using features have stood the test of time, but any innovation you make has not and thus may suffer from hard-to-anticipate problems.


Diversity Arguments


Different users have different preferences for interaction styles, and some users have physical limitations that make it difficult or impossible to use certain features. A blind user, for example, can work with textual menus using a device that translates on-screen text to audible speech, but graphical icons can't be translated by the device. A person with impaired motor control may be able to type but may not have the fine hand control needed to use the mouse, while a person with the use of only one hand might have problems with two-key combinations and prefer the mouse and pulldown menus. For all of these users, providing more than one access to a function may be essential.


All of these statements are abstract. It can be hard to see how or whether they apply to a given design problem without some experience in applying them. Spend some time looking at a good interface and seeing if you can make sense of its features in terms of these ideas.

Example: Copying in the Traffic Modelling System.

We did all of the above kinds of copying in the traffic modelling system. To begin with we incorporated a statistics package called S+ bodily: users needed to do statistical treatments and plots, and S+ already had implemented more than they would need. We were working in UNIX so it was fairly easy to run S+ as a separate process, send requests to it and bring back answers from it or have it present its output directly to users. We also adapted an existing package for diagram building called AgentSheets so that users could build their model in diagram form by pointing and clicking on graphical model elements. This was not a simple copy because AgentSheets needed to be extended slightly.


AgentSheets is implemented in LISP, and we proposed to do other development in LISP, so we needed LISP-compatible software for other interface features that AgentSheets did not provide. We chose Garnet, a LISP-based user interface support package developed at Carnegie-Mellon University (CMU). Garnet is intended to provide very flexible support for people who want to create their own interface features, rather than adopting an existing framework like MOTIF. Since we didn't really need to create any new features it was not really a good choice for our purposes, but at the time we were doing the work we did not have LISP support for other options.


Our experience with Garnet is a good example of the costs of not copying enough. We had to implement interface features in Garnet that would be provided as standard parts of a system like MOTIF today. (Of course this is not a reflection on Garnet but on us: we were trying to use it for purposes for which it was not intended. Garnet was and is a very powerful tool for exploring new interface techniques such as demonstrational interfaces.)


Since Garnet was not intended to support any particular interface style it did not have a style guide. This was not a problem, because we simply copied stylistic features from other systems, especially the Macintosh. Our users (we knew exactly who they were) had no experience with ANY graphical user interface, so we considered ourselves free to use Mac- style interaction even though we were implementing on a UNIX platform. But this was probably a bad copying decision, which we would not have made had it been clearer at the time how much acceptance MOTIF would get. One of the ways designers today are fortunate is that these choices have become clearer.


Against all of this background we could concentrate on a few areas of the design for which we did not find a clear precedent. One was allowing users to specify model inputs by typing in numbers or by designating a prepared file; another was how to control the execution of the model so as to explore various possible combinations of input values (recall the speed-limit study mentioned in the previous chapter); another was how to capture model results in a form that could be fed into further processing, so as to prepare a graph comparing results from different runs, for example.


We didn't need to do anything very clever about these things. We represented data, whether model input or output, as graphical objects that could be connected to other model elements. These objects could be opened, exposing their contents for editing, and the opened object contained a file browser that could be used optionally to select a file from which values could be read or into which values could be placed for later use. Execution control was done by specifying input parameters and values to be used for them, along with other specifications of a run, in a dialog box.



Copyright © 1993,1994 Lewis & Rieman
Contents | Foreword | ProcessUsers&Tasks | Design | Inspections |User-testing | Tools | Documentation |