Specifying and running rich graphical components with Loa

Beaudoux, Olivier; Clavreul, Mickael; Blouin, Arnaud; Yang, Mengqiang; Barais, Olivier; Jézéquel, Jean-Marc

doi:10.1145/2305484.2305513

Cited by 5 publications

(6 citation statements)

References 20 publications

Supporting

Mentioning

Contrasting

Order By: Relevance

“…Based on the work of [48], [51] propose an approach for developing interactive graphical objects. This approach proposes a DSL (Domain-Specific Language) embedded in Scala to develop interactors.…”

Section: Ui Event Processing Approachesmentioning

confidence: 99%

Interacto: A Modern User Interaction Processing Model

Blouin

Jézéquel

2022

IIEEE Trans. Software Eng.

Self Cite

View full text Add to dashboard Cite

Since most software systems provide their users with interactive features, building user interfaces (UI) is one of the core software engineering tasks. It consists in designing, implementing and testing ever more sophisticated and versatile ways for users to interact with software systems, and safely connecting these interactions with commands querying or modifying their state. However, most UI frameworks still rely on a low level model, the bare bone UI event processing model. This model was suitable for the rather simple UIs of the early 80's (menus, buttons, keyboards, mouse clicks), but now exhibits major software engineering flaws for modern, highly interactive UIs. These flaws include lack of separation of concerns, weak modularity and thus low reusability of code for advanced interactions, as well as low testability. To mitigate these flaws, we propose Interacto as a high level user interaction processing model. By reifying the concept of user interaction, Interacto makes it easy to design, implement and test modular and reusable advanced user interactions, and to connect them to commands with built-in undo/redo support. To demonstrate its applicability and generality, we briefly present two open source implementations of Interacto for Java/JavaFX and TypeScript/Angular. We evaluate Interacto interest (1) on a real world case study, where it has been used since 2013, and with (2) a controlled experiment with 44 master students, comparing it with traditionnal UI frameworks.Index Terms-user interface, user interaction, UI event processing, separation of concerns, undo/redo ! INTRODUCTION"Anytime you turn on a computer, you're dealing with a user interface" [1]. User Interfaces (UIs), and the user interactions they supply, pervade our daily lives by enabling users to interact with software systems. The user interactions provided by a UI form a dialect between a system and its users [2]: a given user interaction can be viewed as a sentence composed of predefined words, i.e. low-level UI events, such as mouse pressure or mouse move. For example, we can view the execution of a drag-and-drop interaction as a sentence emitted by a user to the system. This sentence is usually composed of the words pressure, move, and release, that are UI events assembled in this specific order. The humancomputer interaction community designs novel and complex user interactions. As explained by [3], "Human-Computer Interaction (HCI) researchers have created a variety of novel [user] interaction techniques and shown their effectiveness in the lab [...]. Software developers need models, methods, and tools that allow them to transfer these techniques to commercial applications." Currently, to use such novel user interactions in software systems developers must complete two software engineering tasks: (i) They must assemble low-level UI events to build the expected user interaction. For example, a developer must manually assemble the events pressure, move, and release to build a drag-and-drop. (ii) They have to code how to process suc...

show abstract

Section: Ui Event Processing Approachesmentioning

confidence: 99%

Interacto: A Modern User Interaction Processing Model

Blouin

Jézéquel

2022

IIEEE Trans. Software Eng.

Self Cite

View full text Add to dashboard Cite

show abstract

“…Other frameworks have explored alternative ways to declare GUI behaviors. Loa [2], for instance, combines data bindings, templates, and interactors. However, Loa's feature set, like ConstraintJS, was built to fit in with existing imperative languages.…”

Section: Uidls and Framework For Interactive Systemsmentioning

confidence: 99%

InterState

Oney

Myers

Brandt

2014

Proceedings of the 27th Annual ACM Symposium on User Interface Software and Technology

View full text Add to dashboard Cite

InterState is a new programming language and environment that addresses the challenges of writing and reusing user interface code. InterState represents interactive behaviors clearly and concisely using a combination of novel forms of state machines and constraints. It also introduces new language features that allow programmers to easily modularize and reuse behaviors. InterState uses a new visual notation that allows programmers to better understand and navigate their code. InterState also includes a live editor that immediately updates the running application in response to changes in the editor and vice versa to help programmers understand the state of their program. Finally, InterState can interface with code and widgets written in other languages, for example to create a user interface in InterState that communicates with a database. We evaluated the understandability of InterState's programming primitives in a comparative laboratory study. We found that participants were twice as fast at understanding and modifying GUI components when they were implemented with InterState than when they were implemented in a conventional textual event-callback style. We evaluated InterState's scalability with a series of benchmarks and example applications and found that it can scale to implement complex behaviors involving thousands of objects and constraints.

show abstract

“…We define the four orthogonal views of the Graf application using the constructs of the Loa DSL [9].…”

Section: Definition Of Views With Loamentioning

confidence: 99%

“…Other implementations target Java platforms [9]. The Loa DSL only imposes that the templates are written in XML.…”

Section: View 2: Graphical Templatesmentioning

confidence: 99%

Binding orthogonal views for user interface design

Beaudoux

Clavreul

Blouin

2013

Proceedings of the 1st Workshop on View-Based, Aspect-Oriented and Orthographic Software Modelling

Self Cite

View full text Add to dashboard Cite

The design of graphical user interfaces (GUI) is a complex activity that binds multiple concerns into meaningful interactive applications. While the definition of multiple orthogonal views greatly facilitates the design of such GUIs, existing GUI frameworks still lack a proper strategy for splitting and binding these views to build complete GUIs. This paper proposes a domain specific language (DSL) called Loa to unify both the definition of orthogonal views and the bindings between these views in the context of GUI development. We present the overall strategy for splitting and binding views based on the use of the Loa DSL and we illustrate the proposed approach on the design of a web-based application.

show abstract

Specifying and running rich graphical components with Loa

Cited by 5 publications

References 20 publications

Interacto: A Modern User Interaction Processing Model

Interacto: A Modern User Interaction Processing Model

InterState

Binding orthogonal views for user interface design

Contact Info

Product

Resources

About