Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

1 This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 Unported License.

Real-Time Metamodeling

in the Web Browser

Michael Derntl, Stephan Erdtmann, Petru Nicolaescu,

Ralf Klamma, Matthias Jarke

RWTH Aachen

Lehrstuhl Informatik 5 – Informationssysteme

lastname@dbis.rwth-aachen.de

Modellierung2014.org | 20 Mar 2014

This work has been funded with support from the European Commission. This presentation reflects

the views only of the authors, and the Commission cannot be held responsible for any use which

may be made of the information contained therein.

http://metis-project.org

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

2

Motivation

Conceptual modeling

– Key activity in many areas

– Social, creative process [FK98] – collaborative work [RKV08]

Typical collaboration: asynchronous

Availability of near real-time (NRT) collaborative modeling tools

– On desktop and on the web

– From highly domain-specific tools like Kanban Tool1…

– … to very generic ones like draw.io2

1 http://kanbantool.com2 http://www.draw.io

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

3

Near Real-Time Collaborative Editing

Synchronous editing independent of the location of the users– Propagation of user actions to collaborators

– Responsiveness similar to single-user applications

– Consistency maintenance

Inconsistencies caused by divergence or causality-violation [SE98]

Two approaches for consistency preservation– Conflict prevention [XZS00]

– Conflict resolution [SE98]

Architectures– Centralized architecture (client/server)

– Decentralized architecture (peer-to-peer)

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

4

Technology Study: SyncLD

NRT collaborative editor for models according to IMS

Learning Design specification

Conflict resolution using Operational Transformation [EG98]

Web-based, widget-based

Drawbacks:

- Domain-specific

- Single-widget GUI

- No awareness

- Unclear steps

[NDKl13]

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

5

Objectives

Functional

– Framework for NRT

collaborative modelling

– Meta model based

– Visual modeling

– Awareness

– Structured editing

support

Non-Functional

– Open source code

– Building on open

protocols

– Runs in the web browser

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

6

Related Tools & Frameworks

Platform Domain-

Indepen-

dent

Meta-

Modeling

based

RTC

Editor

RTC

Gener-

ator

Aware

ness

Brow-

ser

App

Open

Sourc

e

MetaEdit+ [TPK07] Smalltalk ✓ ✓ (✓)

ADOxx [FK13] Gecko/C++ ✓ ✓

DiaMeta [Mi07] Java / EMF ✓ ✓ ✓

[GBR12] Java / EMF ✓ ✓ ✓ ✓

Tiger [Eh05] Java / EMF ✓ ✓

AToM3 [LVA04] Python ✓ ✓ ✓

GenGED [BEW04] Java ✓ ✓

SyncLD [NDK13] Web-Based ✓ ✓ ✓

SyncMeta Web-Based ✓ ✓ ✓ ✓ ✓ ✓ ✓

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

7

Conceptual (Meta) Modeling

Model as abstraction of a part of the world

Consisting of objects and relationships between

objects

Modeling language specifies

- Abstract and concrete syntax definition

- Semantics definition

Metamodeling

- Definition of modeling language by (meta-)model

[Ol07]

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

8

Meta-Modeling Hierarchy

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

9

Real-time collaboration on both modeling layers

Meta-Modeling Framework:

Modeling Process & User Roles

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

10

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

11

Metamodel (partial)

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

12

Generator is special instance of Generic Editor

Uses special Export Widget for Editor Generation

GUI Architecture

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

13

Technical Realization

Communication protocol: XMPP

– Suitable protocol for NRT communication

– Multiple extensions available (publish subscribe, multi-user chat)

– Client and server support (Smack, Strophe, Openfire, ejabberd)

Open source ROLE SDK based on Apache Shindig

– User management

– Personal and collaborative widget space management

– XMPP based multi-user chat

Inter-widget communication (IWC) [GVD+11]

– Local IWC based on HTML5 Web Messaging API

– Remote IWC based on XMPP Publish Subscribe XEP

– Strophe.js (XMPP over BOSH and WebSockets)

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

14

Generic Editor - Functionality

Near real-time synchronization

Awareness

- Activity Pane

- Highlighting of nodes

User interaction to add nodes / edges

- Palette

- Context menu

Export of Model as JSON, PNG File

- Custom export widgets

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

15

End-User Evaluation

Goal

- Evaluation of usability and usefulness of Generic Editor

- Obtain feedback for improvement

Methodology

- Editor instance for i* modeling language [Yu95]

- Evaluation session in groups of two

- Participants could see and talk to each other, but were not

able to see each other‘s screen (Skype-like setting)

- Task: Jointly recreate a given i* model using the editor

- Rating using surveys with seven-point Likert scale items

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

16

End-User Evaluation (cont.)

Participants

- Ten group sessions with 20 participants in total

- Diverse expertise of conceptual modeling and the i*

modeling language (novices as well as experts)

- Regular to frequent usage of graphical editors

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

17

Evaluation:

Quantitative Results

Overall

– Very positive overall rating (M = 5.7; SD = 1.2)

– User interface and usability also good (M = 5.9 and 5.7,

respectively)

– Ratings independent of user experience (r = .32; p = .17)

User interaction

– For adding nodes resp. edges participants prefer the context

menu (M = 5.9 and 5.7, resp.) over palette (M = 5.3 each)

Awareness

– Node highlighting (M = 5.7; SD = 1.2) slightly higher than

activity pane (M = 5.5; SD = 1.4)

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

18

Evaluation:

Suggested Improvements

More highlighting of remote changes

Keyboard shortcuts

Multiselection of nodes

Automatic node arrangement

Drag & drop from palette

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

19

Conclusion and Future Work

Key points

- Browser-based Meta-Modeling Framework

- Generation of RTC Editors for Visual Modeling Languages

Different types of user interaction

Awareness

- Pilot case: i* editor; generally positive evaluation

Future work

- Definition and checking of modeling constraints

- Recommendations during modeling

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

20

THANK YOU FOR LISTENING

derntl@dbis.rwth-aachen.de

Lehrstuhl Informatik 5

(Information Systems)

Prof. Dr. M. Jarke

21

References

[BEW04] Bardohl, R.; Ermel, C.; Weinhold, I: GenGED–a visual definition tool for visual modeling environments. In Pfaltz, J. L.; Nagl, M.; Böhlen, B. (Hrsg.): Applications of Graph Transformations with Industrial Relevance. Springer, Berlin, 2004; p. 413–419.

[Eh05] Ehrig, K. et al.: Generation of visual editors as eclipse plug-ins. In: Proc. 20th IEEE/ACM Int. Conf. on Automated Software Engineering. ACM, New York, 2005; p. 134–143.

[FK98] Floyd, C.; Klischewski, R.: Modellierung - ein Handgriff zur Wirklichkeit. Zur sozialen Konstruktion und Wirksamkeit von Informatik-Modellen. In: Pohl, K.; Schürr, A.; Vossen, G. (Hrsg.): Modellierung '98. CEUR-WS.org, 1998.

[FK13] Fill, H.-G.; Karagiannis, D.: On the conceptualisation of modelling methods using the ADOxx meta modelling platform. In: Enterprise Modelling and Information Systems Architectures, 8(1), 2013.

[GBR12] Gallardo, J.; Bravo, C.; Redondo, M. A.: A model-driven development method for collaborative modeling tools. Journal of Network and Computer Applications, 35(3), 2012; p. 1086–1105.

[GVD+11] Govaerts, S.; Verbert, K.; Dahrendorf, D.; Ullrich, C.; Schmidt, M.; Werkle, M.; Chatterjee, A.; Nussbaumer, A.; Renzel, D.; Scheffel, M.; Friedrich, M.; Santos, J. L.; Duval, E.; Law, E.: Towards Responsive Open Learning Environments: The ROLE InteroperabilityFramework. In: Proc. EC-TEL 2011. Springer, Berlin, 2011; S. 125-138.

[LVA04] de Lara, J.; Vangheluwe, H.; Alfonseca, M.: Meta-modelling and graph grammars for multi-paradigm modelling in AToM³. Software and Systems Modeling, 3(3), 2004; p. 194–209.

[Mi07] Minas, M.: Generating meta-model-based freehand editors. Electronic Communi-cations of the EASST, 1, 2007.

[NDK13] Nicolaescu, P.; Derntl, M.; Klamma, R.: Browser-Based Collaborative Modeling in Near Real-Time. In: Proc. IEEE CollaborateCom2013. IEEE, Los Alamitos, 2013.

[Ol07] Olivé, A.: Conceptual modeling of information systems. Springer, 2007.

[RKV08] Renger, M.; Kolfschoten, G. L.; de Vreede, G.-J.: Challenges in Collaborative Modeling: A Literature Review. Lecture Notes in Business Information Processing, Volume 10, 2008; p. 61-77.

[SE98] Sun, C.; Ellis, C.: Operational transformation in real-time group editors: issues, algorithms, and achievements. In: Proc. 1998 ACM Conf. on Computer Supported Cooperative Work. ACM, New York, 1998; p. 59–68.

[TPK07] Tolvanen, J.-P.; Pohjonen, R.; Kelly, S.: Advanced tooling for domain-specific modeling: Metaedit+. In: Sprinkle, J.; Gray, J.; Rossi, M.; Tolvanen, J.-P. (Hrsg.): 7th OOPSLA Workshop on Domain-Specific Modeling, Finland, 2007.

[XZS00] Xue, L.; Zhang, K.; Sun, C.: Conflict control locking in distributed cooperative graphics editors. In: Proc. 1st Int. Conf. on Web Information Systems Engineering. IEEE, Los Alamitos, 2000; p. 401–408.