A Pattern Approach to Interaction Design Jan O. Borchers Department of Computer Science Darmstadt University of Technology Alexanderstr. 6, 64283 Darmstadt, Germany [email protected] ABSTRACT perts need to work together very closely with team members To create successful interactive systems, user interface de- from other disciplines. Most notably, they need to coop- signers need to cooperate with developers and application erate with application domain experts to identify the con- domain experts in an interdisciplinary team. These groups, cepts, tasks, and terminology of the product environment, however, usually miss a common terminology to exchange and with the development team to make sure the internal ideas, opinions, and values. system design supports the interaction techniques required. This paper presents an approach that uses pattern languages However, these disciplines lack a common language: It is to capture this knowledge in software development, HCI, difficult for the user interface designer to explain his guide- and the application domain. A formal, domain-independent lines and concerns to the other groups. It is often even definition of design patterns allows for computer support more problematic to extract application domain concepts without sacrificing readability, and pattern use is integrated from the user representative in a usable form. And it is into the usability engineering life cycle. hard for HCI people, and for application domain experts even more so, to understand the architectural and techno- As an example, experience from building an award-winning logical constraints and rules that guide the systems engineer interactive music exhibit was turned into a pattern language, in her design process. In general, people within a discipline which was then used to inform follow-up projects and sup- often have trouble communicating what they know to out- port HCI education. siders, but to work together well, disciplines must learn to appreciate each other’s language, tradition, and values [23]. Categories and Subject Descriptors H.5.2 [Information Interfaces and Presentation (e.g., 1.1 Pattern Languages as lingua franca HCI)]: User Interfaces—style guides; theory and methods; Simply stated, a pattern is a proven solution to a recurring training, help, and documentation; user-centered design; design problem. It pays special attention to the context in H.5.5 [Information Interfaces and Presentation (e.g., which it is applicable, to the competing “forces” it needs to HCI)]: Sound and Music Computing—modeling, systems; balance, and to the positive and negative consequences of D.2.2 [Software Engineering]: Design Tools and Tech- its application. It references higher-level patterns describ- niques—user interfaces ing the context in which it can be applied, and lower-level patterns that could be used after the current one to further General Terms refine the solution. This hierarchy structures a comprehen- Design, Human Factors, Documentation sive collection of patterns into a pattern language. Keywords The central idea presented here is that HCI, software engi- Pattern languages, design methodologies, interdisciplinary neering, and application domain experts in a project team design, music, exhibits, education each express their expertise in the form of a pattern lan- guage. This makes their knowledge and assumptions more explicit, and easier for the other disciplines to understand 1. INTRODUCTION and refer to. Such a common vocabulary can greatly im- To design systems that fulfil today’s high expectations con- prove communication within the team, and also serve as a cerning usability, human-computer interaction (HCI) ex- corporate memory of design expertise. The next section briefly explains the concept and history of pattern languages. A critical component of these languages, however, are the cross-references that help readers find their To appear in Proceedings of the DIS 2000 International Con- way through the material. To facilitate creating and navi- ference on Designing Interactive Systems (August 16–19, gating through patterns, possibly with computer support, a 2000, New York), ACM Press, New York, 2000. See the conference formal syntactic definition of patterns and their relations is proceedings, online at http://www.acm.org/dl/, for the definitive version. presented that is independent of the domain they address. Copyright ACM. Posted by permission. Do not redistribute. It is also shown where in the usability engineering life cycle patterns can be applied. 1 The final section shows a pattern language for interactive It must be stressed that Alexandrian patterns are, above music exhibits as an example, and summarizes some initial all, a didactic medium for human readers, even (and espe- empirical studies about the usefulness of pattern languages cially) for non-architects. This quality must not be lost in a in HCI courses. more formal representation or extension of the idea to other domains. 2. A BRIEF HISTORY OF PATTERN LAN- 2.2 Patterns in Software Engineering GUAGES Around 1987, software engineering picked up the pattern This section briefly outlines where the pattern idea comes idea. At the OOPSLA conference on object-orientation, from, and how it has been adapted to other disciplines. Beck et al. [8] reported on an experiment where application domain experts without prior Smalltalk experience success- 2.1 Patterns in Urban Architecture fully designed their own Smalltalk user interfaces after they The original concept of pattern languages was conceived by had been introduced to basic Smalltalk UI concepts using a architect Christopher Alexander in the 1970’s. In [2], he pattern language. It is interesting to note that this first soft- explains how a hierarchical collection of architectural de- ware pattern experiment actually dealt with user interface sign patterns can be identified to make future buildings and design, and user participation. urban environments more usable and pleasing for their in- habitants. In [3], he presents 253 such patterns of “user- The workshop started a vivid exchange about software de- friendly” solutions to recurring problems in urban architec- sign patterns. An influential collection of patterns for ture. They range from large-scale issues (“community of object-oriented software design was published by Gamma 7000”, “identifiable neighbourhood”), via smaller-scale et al. [18]. The annual Pattern Languages of Programming patterns (“promenade”, “street cafe”) down to patterns (PLoP) conferences have established an entirely new forum for the design of single buildings (“cascade of roofs”, to exchange proven, generalized solutions to recurring soft- “intimacy gradient”). Finally, in [4], the architect uses ware design problems. his pattern language to define a new planning process for the University of Oregon as an example. The overall format of a pattern has not changed very much from Alexander to, e.g., Gamma et al. [18]: Name, context, It is less known that Alexander’s goal in publishing this pat- problem, solution, examples, diagrams, and cross-references tern language was to allow not architects, but the inhabi- are still the essential constituents of each pattern. tants (that is, the users) themselves to design their environ- ments. This is strikingly similar to the ideas of user-centered The goals, however, have changed in an important way, and participatory design, which aim to involve end users in without many noticing: Software design patterns are con- all stages of the software development cycle. sidered a useful language for communication among soft- ware developers, and a practical vehicle for introducing less Pattern languages essentially aim to provide laymen with a experienced developers into the field. The idea of end users vocabulary to express their ideas and designs, and to discuss designing their own (software) architectures, has not been them with professionals. This idea of creating a vocabulary taken over. On the one hand, this makes sense, because implements well-known results from psychological research people do not live as intensely “in” their software applica- about verbal recoding : “When there is a story or an argu- tions as they live in their environments. On the other hand, ment or an idea that we want to remember [ ... ], we make though, a good chance to push the concept of participatory a verbal description of the event and then remember our design forward by introducing patterns has not been taken verbalization” [24]. The idea can be recalled when its short advantage of. This was one of the reasons why, at OOP- name is remembered. SLA’99, the authors of that book were put before a mock “trial” for their work. (See the article by Tidwell [31] for an Each of Alexander’s patterns is presented as several pages of interesting comment.) illustrated text, using a very uniform structure and layout with the following components [3, p. x]: 2.3 Patterns in HCI The pattern idea has been referenced by HCI research earlier A meaningful, concise name identifies the pattern, a ranking than most people expect. Norman and Draper [28] mention indicates the validity of the pattern, a picture gives a “sen- Alexander’s work, and in his classic Psychology of Everyday sitizing” and easily understood example of the pattern ap- Things [27, p. 229], Norman states that he was influenced plied, and the context explains which larger patterns it helps particularly by it. Apple’s Human Interface Guidelines [5] to implement. Next, a short problem statement summarizes quote Alexander’s books as seminal in the field of environ- the competing “forces”, or design tradeoffs, and a more ex- mental design, and the Utrecht School of Arts uses patterns tensive problem description gives empirical background in- as a basis for their interaction design curriculum [6]. formation, and shows existing solutions. But only recently a first workshop dedicated to pattern lan- The following solution is the central pattern component. It guages for interaction design took place within the HCI com- generalizes the examples into a clear, but generic set of in- munity. It showed that the ideas about adopting the pat- structions that can be applied in varying situations.