RIA Interfaces Description Ontology

As a notation for the Semantic Hypermedia Design Method (SHDM), Moura [1] proposes an Abstract Widgets Ontology for the abstract interfaces design, a Concrete Widgets Ontology, which describes the interface elements available in the specific application environments, such as the elements of an HTML page, and a set of rules for mapping between the two ontologies. Thus, the designer of an application can automatically generate a concrete interface from an abstract interface description. It provides a formalism to express both the structure and the layout of an interface.

However, to express the interface objects’ behavior in reaction to external events, the SHDM method does not yet have a notation. To fill this gap, we propose an extended ontology, the RIA Interfaces Description Language, with enough expressiveness to model the UI controls present in Web 2.0 applications, and a compiler for this language: a tool that reads a high level description of the an interface’s operation and generates the executable code in the target platform.

Widgets Description

The RIA Interfaces Description Ontology aims to describe how the data objects (ADOs) will be presented, detailing the visible elements (ADVs) that will be available to the user. [3] Its main concepts are:

AbstractInterfaceElement: this class represents all the possible abstract widgets and is a generalization of the following subclasses:

• CompositeInterfaceElement: represents a composition of abstract elements;
• ElementExhibitor: represents elements that exhibit some type of content, such as a text or an image;
• IndefiniteVariable: represents elements that allow the user to enter data through the keyboard, for example, a text box on a form;
• PredefinedVariable: represents elements that allow the selection of a subset from a set of predefined values, such as buttons and check boxes;
• SimpleActivator: represents an element capable of reacting to external events, such as a link or an action button.
• AbstractInterface: this class represents the final composition of all elements of the abstract interface.

In the first abstraction level, the ontology concepts are only meant to classify the UI controls according to their functionality. To describe how they are going to be rendered, which is particular to each RIA technology, the following are used:

ConcreteInterfaceElement: this class represents the actual widgets in any platform. DHTMLInterfaceElement represents elements of an DHTML page. It has the following subclasses:

• DHTMLRichControl: UI controls that are written in HTML DOM + Javascript + CSS. They include represent third-party UI controls, such as Yahoo! User Interface Library (YUI);
• HTMLTag: UI controls that can be represented by HTML tags.

The mapsTo property allows AbstractInterfaceElement and AbstractInterface instances to be mapped into ConcreteInterfaceElement instances and enables automatic code generation for the modelled interface.

Rhetorical Description

Fialho [4] discusses the use of animation in computer systems interfaces as a way to enrich the user experience, and the use of visual rhetoric as a way to set the the effects presented by animation, as well their sequence and duration. In order to capture the dynamic aspects of a widget, the ontology should be able to define some concepts present in the formalism of the ADV-Charts (a generalization of StateCharts [5] and ObjectCharts [6]), such as states, transitions and events. Thus, the Abstract Widgets Ontology was extended to include the following classes:

• Transition: this class represents the changes of state in the interface.

• RhetoricalStructure: represents a set of semantically related decorations, which happens during a transition or in response to an event.

Decoration: a (possibly animated) change on the interface elements. It can be classified as:

• InsertElement: is an entrance decoration, for the insertion of an element belonging to the destination state. It indicates the emergence of a new element during the transition;
• RemoveElement: is an exit decoration, for the removal of an element belonging to the current state. It indicates the absence of the element in the destination state;
• MatchElements: is a maintenance decoration, which performs transformations to match the parameters of an element in the current state and another in the destination state. It indicates the presence of the element in the two states of a transition;
• TradeElements: is a substitution decoration, which performs the transformation of an element in the current state into another in the destination state. It indicates a relationship between the elements;
• EmphasizeElement: is an decoration to highlight an element, altering it as a way to indicate that an action is being performed.

ConcreteEffect: a decoration effect in the actual RIA platform.

DHTMLEffect represents the effects coded in Javascript, available to the DHTML interfaces.

While the Decoration subclasses categorize the decorations semantically, the ConcreteEffect instances describe how the visual rhetoric will actually take place. The hasEffect property indicates the decoration effect to be applied.

Event: the occurrence of an action on an interface element:

• onActivate: indicates that a SimpleActivator was activated;
• onBlur: indicates that a data entry element lost focus;
• onChange: indicates that a data entry element lost focus after its content has been modified;
• onFocus: indicates that a data entry element got focus;
• onHover: indicates that a mouse pointer was moved over an element;
• onSelect: indicates that the text in a data entry element was selected.

Mapping Data Objects into Abstract Widgets

The abstract interface design describes how users will perceive and interact with the application data objects. Therefore, the specification of abstract widgets must be able to express the mapping between corresponding elements in Model and View layers.

Based on the SHDM primitives, the ontology comprises the following properties:

• fromAction: indicates which action will be triggered when a SimpleActivator is activated or an Event occurs;
• fromClass: indicates which navigational class the object represented by a CompositeInterfaceElement belongs to;
• fromAttribute: indicates which navigation object's attribute the abstract widget represents.

Next, see Semantic Web User Interface Architecture.

References

[1] MOURA, S. S.; SCHWABE, D.; "Interface Development for Hypermedia Applications in the Semantic Web", Joint Conference 10th Brazilian Symposium on Multimedia and the Web & 2nd Latin American Web Congress, Ribeirao Preto, SP, Brazil pp 106-113, IEEE Computer Society, October 2004, ISBN: 0-7695-2237-8. (http://www.inf.puc-rio.br/~schwabe/papers/SSMoura_LAWEB2004_Final.pdf)

[2] LUNA, A. M. Geração de Interfaces RIA Dirigida por Ontologias. Rio de Janeiro, 2009. MSc Dissertation – Dept. of Informatics, Pontifícia Universidade Católica do Rio de Janeiro. (in Portuguese)

[3] SCHWABE, D.; ROSSI, G. An Object Oriented Approach to Web-Based Application Design, Theory and Practice of Object Systems. , v.4, 207-22, 1998 (http://www-di.inf.puc-rio.br/schwabe/papers/TAPOSRevised.pdf).

[4] FIALHO, A.; SCHWABE, D., "Enriching Hypermedia Application Interfaces", Proc. ICWE 2007, Como, Italy. LNCS 4607 Springer 2007, ISBN 978-3-540-73596-0. pp. 188-193 (http://www.springerlink.com/content/pv571486777424k1/fulltext.pdf)

[5] ANTUNES, D. C. Statecharts. Bate Byte Magazine, issue 36, Aug/Sep, 1994. http://www.batebyte.pr.gov.br/modules/conteudo/conteudo.php?conteudo=1433.

[6] COLEMAN, D.; HAYES, F.; BEAR, S. Introducing Objectcharts or How to Use Statecharts in Object-Oriented Design. IEEE Transactions on Software Engineering, volume 18, issue 1, p. 9–18, Jan, 1992.