User interface modeling is a development technique used by computer application programmers. Today's user interfaces (UIs) are complex software components, which play an essential role in the usability of an application. The development of UIs requires therefore, not only guidelines and best practice reports, but also a development process including the elaboration of visual models and a standardized notation for this visualization.
The term ''user interface modeling'' is mostly used in an
information technology
Information technology (IT) is the use of computers to create, process, store, retrieve, and exchange all kinds of data . and information. IT forms part of information and communications technology (ICT). An information technology system ...
context. A
user interface
In the industrial design field of human–computer interaction, a user interface (UI) is the space where interactions between humans and machines occur. The goal of this interaction is to allow effective operation and control of the machine f ...
model
A model is an informative representation of an object, person or system. The term originally denoted the plans of a building in late 16th-century English, and derived via French and Italian ultimately from Latin ''modulus'', a measure.
Models c ...
is a representation of how the end user(s) interact with a computer program or another device and also how the system responds. The modeling task is then to show all the "''directly experienced'' aspects of a thing or device"
rætteberg2002
Modeling user interfaces is a well-established discipline in its own right. For example, modeling techniques can describe interaction objects, tasks, and lower-level dialogs in user interfaces. Using models as part of user interface development can help capture user requirements, avoid premature commitment to specific layouts and widgets, and make the relationships between an interface’s different parts and their roles explicit.
ilvaPaton2003
Languages
MARIA
MARIA XML
MARIA (Model-based lAnguage foR Interactive Applications) is a universal, declarative, multiple abstraction level, XML
Extensible Markup Language (XML) is a markup language and file format for storing, transmitting, and reconstructing arbit ...
(Model-based lAnguage foR Interactive Applications) is a universal, declarative, multiple abstraction level, XML-based user interface markup language for modelling interactive applications in ubiquitous environments.
UML
Some aspects of user interface modeling can be realized using
UML
The Unified Modeling Language (UML) is a general-purpose, developmental modeling language in the field of software engineering that is intended to provide a standard way to visualize the design of a system.
The creation of UML was originally ...
. However, the language is not mainly intended for this kind of modeling, which may render the models somewhat synthetic.
UMLi
UMLi
The Unified Modeling Language for Interactive Systems (UMLi) is a conservative extension of the Unified Modeling Language for user interface design. UMLi was developed in the period between 1998 and 2002 as part of Paulo Pinheiro
Paulo Pinheir ...
is an extension of
UML
The Unified Modeling Language (UML) is a general-purpose, developmental modeling language in the field of software engineering that is intended to provide a standard way to visualize the design of a system.
The creation of UML was originally ...
, and adds support for representation commonly occurring in user interfaces.
Because application models in UML describe few aspects of user interfaces,
and because the model-based user interface development environments (MB-UIDE)
lack ability for modeling applications, the University of Manchester started the research project UMLi in 1998.
UMLi aims to address this problem of designing and implementing user interfaces using a combination of
UML
The Unified Modeling Language (UML) is a general-purpose, developmental modeling language in the field of software engineering that is intended to provide a standard way to visualize the design of a system.
The creation of UML was originally ...
and MB-UIDE.
UsiXML
UsiXML UsiXML (USer Interface eXtensible Markup Language) is an XML-based markup language for defining user interfaces on computers.
UsiXML is a specification language for user interface design. It allows the designer to describe a user interface at dif ...
(USer Interface eXtensible Markup Language) is an XML-based specification language for user interface design.
It supports the description of UI for multiple contexts of use such as Character User Interfaces (CUIs), Graphical
User Interfaces (GUIs), Auditory User Interfaces, and
Multimodal User Interfaces.
DiaMODL
DiaMODL combines a dataflow-oriented language (Pisa interactor abstraction) with UML Statecharts which has focus on behavior. It is capable of modeling the dataflow as well as the behavior of interaction objects. It may be used for documenting the function and structure of concrete user interfaces.
Himalia
Himalia combines the Hypermedia Models with the control/composite paradigm. It is a full user interface language, it may be used for specifying but also for running it, because of this the designer tool can categorized as a guilde
Model types
The different aspects of a user interface requires different model types. Some of the models that may be considered for UI-modeling are:
*
Domain model
In software engineering, a domain model is a conceptual model of the domain that incorporates both behavior and data.Fowler, Martin. ''Patterns of Enterprise Application Architecture''. Addison Wesley, 2003, p. 116. In ontology engineering, a d ...
, including data model (defines the objects that a user can view, access and manipulate through the user interface)
*
Navigation model, defines how the objects that a user view could be navigated through the user interface
*
Task model
Task may refer to:
* Task (computing), in computing, a program execution context
* Task (language instruction) refers to a certain type of activity used in language instruction
* Task (project management), an activity that needs to be accomplished ...
. (describes the tasks an end user performs and dictates what interaction capabilities must be designed)
*
User model (represents the different characteristics of end users and the roles they are playing within the organization)
*
Platform model (used to model the physical devices that are intended to host the application and how they interact with each other)
*
Dialogue model
Dialogue (sometimes spelled dialog in American English) is a written or spoken conversational exchange between two or more people, and a literary and theatrical form that depicts such an exchange. As a philosophical or didactic device, it is c ...
(how users can interact with the objects presentation (as push buttons, commands, etc.), with interaction media (as voice input, touch screen, etc.) and the reactions that the user interface communicates via these objects)
*
Presentation model
A presentation conveys information from a speaker to an audience. Presentations are typically demonstrations, introduction, lecture, or speech meant to inform, persuade, inspire, motivate, build goodwill, or present a new idea/product. Present ...
(application appearance, representation of the visual, haptic and auditory elements that the user interface offers to its users)
*
Application model
Application may refer to:
Mathematics and computing
* Application software, computer software designed to help the user to perform specific tasks
** Application layer, an abstraction layer that specifies protocols and interface methods used in a c ...
(commands and data the application provides)
UML can be used for several of the models mentioned above with varying degree of success, but it lacks support for user modeling, platform modeling and presentation model.
Approaches
There exist several approaches to modeling a user interface.
Usage-centered design
In usage-centered design, the modeling task is to show how the actual presentation of a planned system and how the user interaction is supposed to happen. This is probably the most praised approach, and it has been used successfully on a variety of small and large-scale projects. Its strengths are in complex problems.
Alternative approaches to model-based UIs
The known issues of model-based approaches include information restatement and lack of mechanisms to effectively to solve cross-cutting concerns
erny2013 Model-based solutions can work well on their own, but integration with alternative approaches brings complexity in development and maintenance efforts.
Code-inspection based
These approaches are based on existing general purpose language (GPL) code bases
erny2012 Erny may refer to:
People
* Elizabeth Erny Foote (born 1953), American lawyer
* Ernie Colón
* Erny Brenner (1931–2016), Luxembourgish football player
* Erny Kirchen (born 1949), Luxembourgish cyclist
* Erny Pinckert (1908–1977), American Amer ...
They inspect the code through meta-programming and assemble a structural model that is transformed to the UI. This approach addresses information restatement. These approaches does not fit to adaptive and context-aware UIs.
Generative programming
These approaches connect domain methods with GPL
enerative programming Cross-cutting concerns are addressed at compile-time, which does not directly accommodate future adaptive UIs needing runtime information.
Aspect-based UIs
Aspect-based solution suggested by
erny2013Cerny2013a]
spectFacesintegrates advantages of code-inspection based and generative programming approaches. It inspects existing code and applies aspect oriented methods to address cross-cutting concerns. It works at runtime, reduces information restatement and at the same time separates UI concerns which allows to reuse each independent of others. In the study at
erny2013authors reduce UI code by 32% through aspect-based UI approach applied to a production system. Main advantages are templating for adjusting the presentation, separate definitions of concerns and mostly generic transformation rules applicable across various data.
Content models
Models of this kind show the contents of a user interface and its different components. Aesthetics and behavior details are not included in this kind of model as it is a form of usage-centered design model.
See also
*
Cognitive ergonomics
Cognitive ergonomics is a scientific discipline that studies, evaluates, and designs tasks, jobs, products, environments and systems and how they interact with humans and their cognitive abilities. It is defined by the International Ergonomic ...
References
*
aternò 2005&ndash
F Paternò, Model-based tools for pervasive usability, Interacting with Computers 17 (3), 291-315*
rætteberg2002&ndash
H. Trætteberg, Model-based User Interface Design, Doctoral thesis, Norwegian University of Science and Technology, 2002*
ilvaPaton2003– P. Pinheiro da Silva, N. W. Paton, User Interface Modeling in UMLi, Stanford University / University of Manchester, 2003
*
arkopoulos1997– P. Markopoulos, A compositional model for the formal specification of user interface software, Doctoral thesis, Queen Mary and Westfield College University of London, 1997
*
revisan2003– D. Trevisan, J. Vanderdonck, B. Macq, Model-Based Approach and Augmented Reality Systems, Université catholique de Louvain, 1348 Louvain-la-Neuve, Belgium, 2003
*
wwUMLi&ndash
The Unified Modeling Language for Interactive Applications*
erny2013– Černý, T. - Čemus, K. - Donahoo, M.J. - Song, M.J.
Aspect-driven, Data-reflective and Context-aware User Interfaces Design (page 53). In: ACM SIGAPP Applied Computing Review [online 2013, vol. 13, no. 4, p. 53-65, .
* [Cerny2013a">nline">Aspect-driven, Data-reflective and Context-aware User Interfaces Design (page 53). In: ACM SIGAPP Applied Computing Review [online
2013, vol. 13, no. 4, p. 53-65, .
* [Cerny2013a– Černý, T. - Donahoo, M.J. - Song, E.:
Towards Effective Adaptive User Interfaces Design Proceedings of the 2013 Research in Applied Computation Symposium (RACS 2013), Montreal: ACM, 2013, .
*
spectFaces– {{cite web , url=http://www.aspectfaces.com/overview , title=AspectFaces , archive-url=https://web.archive.org/web/20190202175033/http://www.aspectfaces.com/overview , archive-date=2 Feb 2019 , publisher=Coding Crayons s.r.o. , url-status=usurped
* [Cerny2012] – T. Cerny and E. Song
Model-driven Rich Form Generation Information: An International Interdisciplinary Journal, 15(7, SI):2695--2714, JUL 2012.
*
enerative programming– Krzysztof Czarnecki and Ulrich W. Eisenecker. 2000
Generative Programming: Methods, Tools, and Applications ACM Press/Addison-Wesley Publ. Co., New York, NY, USA.
User interface markup languages
Graphical user interfaces