1 SVG for Process Visualization Johan Koolwaaij Peter Fennema Diederik van Leeuwen Telematica Instituut The Netherlands

2 Fundamental methods and techniques Generic telematics applications Market oriented projects ScienceBusiness parties Knowledge transfer Initiate applied research Telematica Instituut bridges the gap

3 Application areas CollaborateElectronic business Content engineering For fixed and mobile users

4 Challenge Visualize the process that is executed under the hood of an application For demonstration or instruction purposes (Not for management, debugging or tuning purposes) In a web-based environment For distributed applications In real time Lightweight Adaptable by (to) the (wishes of) viewer(s)

5 Demonstrator visualization: rationale 3G mobile network WASP application platform WASP applications 3 rd parties + services 3G platform End user User interface

6 Demonstrator visualization: example I

7 Demonstrator visualization: example II

8 Architecture

9 Features Topic subscription Web service API for event publication Pushing of XML events from router to subscriber Client-side JavaScript XML event parsing Mapping of XML events to graphical updates, Event queuing facilities to delay the event flow to show parallel events Sync between different views

10 Visualization SVG front-end Graphical expressiveness Highly dynamic nature Programmable through JavaScript Automatic generation Lightweight solution Different views Level of detail Process, actor or function view Aspects Fancy or plain

11 Process models Generate SVG from formal process models, e.g. ebXML BPSS UML / XMI RSD Studio Using XSLT style sheets Hooks for programmatic updates and/or simulation RSD supports extensible import and export facilities. Import for older RSD versions Export to SVG, BPSS, et cetera

12 Conceptual demo

13 Bottlenecks SVG design tools that allow structured SVG and roundtrip editing SVG controls (slider, switch, etc.) Version 1.0 shortcomings, e.g. text wrapping, z-layer, … Time consuming SVG DOM programming Difficult to avoid scripting in the XSLT that generates SVG A comprehensive and understandable process model/view Client-side dependence (scripting, fonts, SVG support in mobile devices)

14 Demonstrations B2B2ME: web service composition Impact: Electronic market places Uluru: mobile audio-visual services WASP: context aware mobile services

15 Thank you for your attention! Questions? More information Via Via internet: Available soon! Check it out!