Patterns and Components for Enhancing Reusability and Systematic UI Development Daniel Sinnig 1 , Homa Javahery 2 , Peter Forbrig 1 and Ahmed Seffah 2 (1) Software Engineering Group University of Rostock, Albert-Einstein-Str.21 18051 Rostock, Germany {dasin, pforbrig}@informatik.uni-rostock.de (2) HCSE Group Concordia University, 1455 De Maisonneuve Blvd. H3G 1M8, Montreal, Canada {h_javahe,seffah}@cs.concordia.ca Abstract This paper focuses on unifying patterns and components into one process for user interface (UI) design. The Pattern- and Component-Based (PCB) process for systematic UI development concentrates on the reuse of design and implementation artifacts. It incorporates both patterns and components as its core constituents. Patterns are used as building blocks to establish conceptual UI design models. Components are introduced as a means to implement particular pattern instances. Two studies are employed to illustrate the applicability of the PCB process. Within the scope of first study, the UI of a web-based application is developed. The second study portrays the traceability and flexibility of the process for UI adaptation due to changed requirements. This can especially support the transfer of software to new platforms and devices. 1 Introduction Software applications, in general, have become more and more complex. User interfaces are no exception to this rule, and current trends in user interface (UI) design are rapidly evolving. The web, as a vital medium for information transfer, has had an impact on UI design. Although application logic development has become increasingly driven by engineering techniques and principles, the development of the UI has remained “ad-hoc” and thus has resulted – from a software engineering point of view – in applications of poor architectural quality, causing tremendous costs for maintenance and further evolution. Due to the lack of standards and the current diversity of technologies, no efficient concept for reuse of solutions and designs has been established yet (Gaedke, Segor & Gellersen, 2000). To support systematic UI development, a process incorporating a disciplined form of reuse is needed. The lack of methods in UI development motivated us to explore the combination of components and patterns as core constituents for a novel reuse approach. Patterns help in the reuse of well-known and proven design solutions, and play a significant role throughout the whole UI development process. Components embody reusable solutions at the implementation level. 2 Core constituents: Patterns and Components Patterns in UI development are an effective way to transmit experience about recurrent problems in the HCI domain. They have the potential to inherently promote the reuse of ideas and knowledge. From experiences with implementation reuse, it is known that an effective concept of reuse should include these three different dimensions: Encapsulation, Composition, and Customization. The concept of patterns addresses all three reuse dimensions. Naturally and by definition, patterns are encapsulations of solutions to problems in a specific context of use. In addition, the concept of pattern languages implies that patterns can be combined and nested depending on their relationships. Last but not least, patterns embody solutions, which occur over and over again in different situations. Therefore patterns are not static, and must be customized to the current context of use. A software component can be defined as a unit of composition with a clearly defined interface, enabling independent deployment and third-party reuse. As a result, it enables practical reuse across multiple applications