Pattern-Based UI Design: Adding Rigor with User and Context Variables

  • Homa Javahery
  • Daniel Sinnig
  • Ahmed Seffah
  • Peter Forbrig
  • T. Radhakrishnan
Part of the Lecture Notes in Computer Science book series (LNCS, volume 4385)


In current practice, user interface development is often based on a vague and undocumented design process, relying solely on the designer’s experience. This paper defines a pattern-based design process, which adds rigor to user interface design. The process is based on the notion of user variables to capture user requirements in a formal manner – based on discrete values that are amenable for tool support and automated analysis. Other context of use information is captured as context variables. Using these values as input, design patterns are selected to leverage best design practices directly into user interface development. Pattern-Oriented Design is then employed to derive a conceptual design, or early prototype, of the user interface. A case study with a Bioinformatics information site exemplifies the feasibility and applicability of this process.


HCI patterns pattern-oriented design persona user variables design methodology context 


Unable to display preview. Download preview PDF.

Unable to display preview. Download preview PDF.


  1. 1.
    Abi-Aad, R., et al.: CoU: Context of Use Model for User Interface Design. In: Proceedings of HCI International 2003, vol. 4, Greece, June 2003, pp. 8–12. LEA, Mahwah (2003)Google Scholar
  2. 2.
    Marucci, L., Paternò, F., Santoro, C.: Supporting Interactions with Multiple Platforms Through User and Task Models. In: Seffah, A., Javahery, H. (eds.) Multiple User Interfaces, Cross-Platform Applications and Context-Aware Interfaces, pp. 217–238. Wiley, London (2003)Google Scholar
  3. 3.
    da Silva, P.: User Interface Declarative Models and Development Environments: A Survey. In: Palanque, P., Paternó, F. (eds.) DSV-IS 2000. LNCS, vol. 1946, pp. 207–226. Springer, Heidelberg (2001)CrossRefGoogle Scholar
  4. 4.
    Vanderdonckt, J., Limbourg, Q., Florins, M.: Deriving the Navigational Structure of a User Interface. In: Proceedings of INTERACT 2003, Zuerich, Sep. 2003, pp. 455–462. IOS Press, Amsterdam (2003)Google Scholar
  5. 5.
    Szekely, P.: Retrospective and Challenges for Model-Based Interface Development. In: Proceedings of DSV-IS 1996, Vienna, Austria, pp. 1–27 (1996)Google Scholar
  6. 6.
    Molina, P., Trætteberg, H.: Analysis & Design of Model-based User Interfaces. In: Proceedings of CADUI 2004, Funchal, Protugal, 13-16 Jan. 2004, pp. 211–222 (2004)Google Scholar
  7. 7.
    Sinnig, D., et al.: Patterns in Model-based Engineering. In: Proceedings of CADUI 2004 jointly organized with ACM-IUI 2004, Funchal, Protugal, 13-16 Jan. 2004, pp. 197–210 (2004)Google Scholar
  8. 8.
    Javahery, H., Seffah, A.: A Model for Usability Pattern-Oriented Design. In: Proceedings of TAMODIA (2002)Google Scholar
  9. 9.
    Alexander, C., Ishikawa, S., Silverstein, M.: A Pattern Language: Towns, Buildings, Construction. Oxford University Press, New York (1977)Google Scholar
  10. 10.
    Gamma, E., et al.: Design Patterns: Elements of Object-Oriented Software. Addison-Wesley, Reading (1995)Google Scholar
  11. 11.
    Fowler, M.: Patterns of Enterprise Application Architecture. Addison-Wesley, Reading (2003)Google Scholar
  12. 12.
    Welie, M.: Patterns in Interaction Design. Available from (Accessed February 2006)
  13. 13.
    Tidwell, J.: UI Patterns and Techniques. Available from (Accessed February 2006)
  14. 14.
    Cooper, A.: The inmates are running the asylum. SAMS Publishing, Indianapolis (1999)Google Scholar
  15. 15.
    Pruitt, J., Grudin, J.: Personas: practice and theory. In: Proceedings of DUX 2003, ACM Press, New York (2003)Google Scholar
  16. 16.
    Scapin, D.L., Bastien, J.M.C.: Ergonomic criteria for evaluating the ergonomic quality of interactive systems. Behaviour & Information Technology 16(4-5), 220–231 (1997)CrossRefGoogle Scholar
  17. 17.
    Landay, J.A., Myers, B.A.: Sketching Interfaces: Toward More Human Interface Design. IEEE Computer 34(3) (2001)Google Scholar
  18. 18.
    Zimmer, W.: Relationships between design patterns. ACM Press, New York (1995)Google Scholar
  19. 19.
    Duyne, D., Landay, J., Hong, J.: The Design of Sites. Addison-Wesley, Reading (2002)Google Scholar
  20. 20.
    Yacoub, S., Ammar, H.: Composition of Design Patterns. Addison Wesley Professional, München (2003)Google Scholar
  21. 21.
    Javahery, H., Seffah, A., Radhakrishnan, T.: Beyond power: making bioinformatics tools user-centered. Communications of the ACM 47(11) (2004)Google Scholar

Copyright information

© Springer-Verlag Berlin Heidelberg 2007

Authors and Affiliations

  • Homa Javahery
    • 1
  • Daniel Sinnig
    • 1
  • Ahmed Seffah
    • 1
  • Peter Forbrig
    • 2
  • T. Radhakrishnan
    • 1
  1. 1.Department of Computer Science and Software Engineering, Concordia University, Montreal, QC, H3G 1M8Canada
  2. 2.Department of Computer Science University of Rostock, Albert-Einstein-Str.21, 18051, RostockGermany

Personalised recommendations