InterState

Abstract

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.

Flex-ER

“…Broll et al [9] present a component based infrastructure to prototype interactive AR applications. Aside from data flows, the state machine approach plays an important role when defining interactions [3,6,49]. Flex-ER takes inspiration from these approaches, extending them to include experimental tasks.…”

Enact

“…Code-oriented artifacts can be enhanced with other representations such as notations, diagrams and test-cases. For example, InterState [49] combines constraints and state machines to facilitate reuse. InterState provides a live editor where developers can edit a program and visualize the states as they interact with the interface.…”

“…Enact uses a state machine [1,49] to specify the interaction behavior. When creating a new interaction, a default state machine is provided.…”

“…Previous work has demonstrated the power of state machines to describe interactions [1,49]. State machines also provide multiple viewpoints: the high-level logic of the state machine, described by its graph, and the low-level details of transitions and actions, programmed in code.…”

Fortunettes

“…Interaction designers and programmers often think in terms of states [29,39,50] instead of modules. With ConstraintJS [46] and InterState [47], Oney et al provide tools to model application logic in terms of states, and UI events are mapped onto transitions between those states. SwingStates add support for Finite State Machines (FSMs) to the widely used Java Swing Toolkit [4].…”