1 reverse engineering of declarative user interfaces examination committee: prof. bernard fortz,...

1

Reverse Engineering of Declarative User

Interfaces

Examination committee:Prof. Bernard Fortz, Université catholique de Louvain, Examiner

Prof. Jean-Luc Hainaut, Facultés Universitaires Notre-Dame de la Paix, Reader

Prof. Manuel Kolp, Université catholique de Louvain, ExaminerProf. Christophe Kolski, Université de Valenciennes et du Hainaut-

Cambrésis, ReaderProf. Jean Vanderdonckt, Université catholique de Louvain, Advisor

Louvain-la-Neuve, 21/6/2006

Laurent Bouillon

Ph.D. in Management SciencesInformation systems

2 Reverse engineering of declarative user interfaces – Thesis – Louvain-la-Neuve - 21/06/2006

Presentation Outline1. The reengineering problem 2. Objectives and working hypotheses 3. Reference framework4. Retargeting 5. Our notation for RE rules 6. Reverse engineering of

1. Web pages (HTML)2. Phone interfaces (WML & VoiceXML)3. Windows applications (resource files)

7. Results evaluation8. Conclusion


1.The Reengineering Problem

Interactive Software evolution: context of use =(U,P,E)

time

Platform

User

Environment

Language


1.The Reengineering Problem

Reengineering of information systems Focuses on reverse engineering

Forward engineering has been achieved in several other researches Centered on UI

It represents 50% of the total code of an information system Other aspects of information systems are already treated Less portable code which has most of time to be rewritten entirely

ReverseEngineering

Forward Engineering

Functional coreCommunication

Data BaseUser Interface

Source Information System Target Information System

Functional coreCommunication

Data BaseUser Interface

AbstractRepresentation Functional core

CommunicationData Base

User Interface


1. Shortcomings of Current Approaches

Lack of generality : approaches are generally dedicated to peculiar couples of languages or limited scope.

Lack of flexibility :RE rules and techniques are applied in a rigid way

Lack of controllability : designer can not control the process in the RE / non-explicit transformations


2.Objectives and Working Hypotheses

“The reverse engineering of UI at a higher level of abstraction than the code level supports UI reengineering with more flexibility while preserving predictability, more generality and controllability in the process than with code-to-code (transcoding) approaches or current reverse engineering approaches.”

Working Hypotheses Scope: declarative languages (HTML, WML, VoiceXML,

resources files) Methodology: model-based approach / model recovery Technique: static analysis Output language: XML compliant UI description language Context: focus on platform


3.Reference Framework for Multi-Context UIs

Task & Concepts

Abstract UI

Concrete UI

Final UI

Task & Concepts

Abstract UI

Concrete UI

Final UI

Source platform Target platform

Task & Concepts

Abstract UI

Concrete UI

Final UI

Task & Concepts

Abstract UI

Concrete UI

Final UI


textInput button button

Window

AICfacet=input

AICfacet=control

AICfacet=control

AbstractIndividualContainer

textInput button button

Window

AICfacet=input

AICfacet=control

AICfacet=control

AbstractIndividualContainer


4.Retargeting

Retargeting: RE rules tailored for a specific context of use.

Œ Task & Concepts

Abstract UI

Ž Concrete UI

Final UI

Task & Concepts

‘ Abstract UI

’ Concrete UI

“ Final UI


Œ Task & Concepts

Abstract UI

Ž Concrete UI

Final UI

Task & Concepts

‘ Abstract UI

’ Concrete UI

“ Final UI



Retargeting (2) Gain

Reduce the scope of possible results and translation operations: gain in efficiency

Benefits from code to refine RE and allows to remove code know as platform specific: gain in adequacy to the new context of use

Allow automated reengineering(no human intervention)

Loss Loss of generality and maintanability Loss of distinction of RE and translation Loss of the platform independence of the

produced model


5. Our notation for RE rules

Requirements Make explicit the reverse engineering

process Use of a common representation for rules

for various source (declarative) UIs Outline rules categories reusable for

several types of UIs. Other techniques were considered

(UML-OCL, TXL, graph transformation…)


5. Our notation for RE rules

Based on several notations and on graph / tree theories.

Notation consists of derivation rules (described thanks to sets of operations-functions) applied on tree reprensentation of UI.

Derivation rules consider the source language of the FUI and abstract it to another level, allowing to recover a CUI or AUI model thanks to a series of mappings between languages meta-models.

Set of basic operations Addnode(x), ModifyAttribute(x.a), DeleteArc(x,y)…

Set of functions ParentNode(x), IsLeaf(x), IsInPath(x)…

catch

event : string... help noinput nomatch error

initial

filled

mode : stringnamelist : string...

blockmenu

id : stringscope : stringdtmf : stringaccept : string

meta

name : stringcontent : stringhttp-equiv : string

metadata

rights : stringsubject : string...

property

name : string...value : string

+ Event handler

count : integer...cond : string

+ Executable content 0..n

1

0..n

1

form

id : stringscope : string...

field

type : stringslot : stringmodal : boolean...

transfer

dest : uridestexpr : stringbridge : booleanconnecttimeout : integer...maxtime : integertransferaudio : uriaai : stringaaiexpr : string

choice

dtmfacceptnext : uriexpr : urievent : stringeventexpr : stringmessage : stringmessageexpr : string

0..n

1

0..n

1

record

name : stringexpr : stringcond : stringmodal : booleanbeep : booleanmaxtime : integerfinalsilence : integerdtmfterm : booleantype : string

option

dtmf : stringaccept : stringvalue : string

0..n1

0..n1

vxmlversion : stringxmlnamespace : stringxml:base : stringxml:lang : stringapplication : string

0..n1

0..n1

0..n

1

0..n

1

0..n

0..1

0..n

0..1

+ Container

name : stringexpr : stringcond : stringfetchaudio : stringfetchhint : stringfetchtimeout : integermaxage : integermaxstale : integer

0..n 10..n 1

0..1

0..n

0..1

0..n

0..n

0..1

0..n

0..1

0..n

1

0..n

1

0..n

1

0..n

1

grammar

version : stringxml:lang : stringmode : stringroot : stringtag-format : stringxml:base : uriexprscopexmlnsweighttypesrcsrcexpr

0..n

0..1

0..n

0..1

0..n0..1

0..n0..1

0..1

0..1

0..1

0..1

0..10..1

0..10..1

0..10..1 0..10..1

0..1

0..1

0..1

0..1

link

next : uriexpr : urievent : stringeventexpr : stringmessage : stringmessageexpr : stringdtmf : stringfetchaudio : stringfetchhint : stringfetchtimeout : integermaxage : integermaxstale : integer

0..n

0..1

0..n

0..1

0..1

0..n

0..1

0..n

1

0..1

1

0..1

elseif

cond : string...

else

cond : string...

exit

expr : stringnamelist : string... clear

namelist : string...

log

label : string...expr : string

assign

expr : stringname : string...

disconnect

src : uricharset : stringfetchhint : stringfetchtimeout : integermaxage : integermaxstale : integer

goto

next : uriexpr : stringnextitem : stringexpritem : stringfetchaudio : stringfetchhint : stringfetchtimeout : integermaxage : integermaxstale : integer

return

event : stringeventexpr : stringmessage : stringmessageexpr : stringnamelist : string

reprompt

script

src : uricharset : stringfetchhint : stringfetchtimeout : integermaxage : integermaxstale : integer

submit

next : uriexpr : stringnamelist : stringmethod : stringenctype : stringfetchaudio : stringfetchhint : stringfetchtimeout : integermaxage : integermaxstale : integer

throw

event : stringeventexpr : stringmessage : stringmessageexpr : string

var

expr : stringname : string

object

classid : uricodebase : uricodetype : stringdata : uritype : stringarchive : string

param

value : stringvaluetype : stringtype : string

0..n

0..1

0..n

0..1

subdialog

namelistsrcsrcexprmethodenctype

0..n

0..1

0..n

0..1

descxml : lang

value

expr : string...

enumerate

audio

fetchhint : stringfetchtimeout : integermaxage : integermaxstale : integerexpr : string

1

0..n

1

0..n

if

cond : string...

0..n

0..1

0..n

0..1

0..n

1

0..n

1

0..n

1

0..n

1

0..1

0..1

0..1

0..1

0..n

0..1

0..n

0..1

0..n

0..1

0..n

0..1

0..1

0..n

0..1

0..n

0..1

1

0..1

1

0..1

1

0..1

1

0..1

1

0..1

1

0..1

0..1

0..1

0..1

0..1

0..1

0..1

0..1

0..1

0..n

0..1

0..n

0..1

0..1

0..1

0..10..1

0..1

0..1

0..1

0..1

0..n

0..1

0..n

0..1

0..n

0..1

0..n

sentencexml : lang

breaksizestrenghttime

pxml : lang

sxml : lang sub

alias

prosodycontourdurationpitchrangeratevolume

emphasislevelvoice

xml : langagegendernamevariant

say-asinterpret-asdetailformat

phonemephalphabet

lexiconuritype

prompt

bargein : booleanbargeintype : stringcond : stringcount : integertimeout : integerxml:lang : stringxml:base : uri

0..n

0..1

0..n

0..1

1

0..1

1

0..1

1

0..n

1

0..n

0..1

0..n

0..1

0..n

0..*

0..1

0..*

0..1

0..*0..*0..*

0..1

0..*

0..1

0..*0..*0..*

0..1

0..*

0..1

0..*

0..1

0..*

0..1

0..*0..1

0..*0..1

0..*

0..1

0..*

0..1

0..*

0..1

0..*

0..1

0..*

0..1

0..*

0..1

0..*

0..1

0..*

0..1


5.Example of Derivation Rules

Examples: For a textbox in HTML/WML

x Ts : x = input ٨ (x.type=“text” ٧ x.type=“password” ٧ x.type=NULL) Addnode (“textComponent”, idtext)

where idtext= NodeAmount(Tt)

For a table in HTML/WML

x Ts : x = table ٨ x.border>0 Addnode (“table”, idtable) where idtable = NodeAmount(Tt)

x Ts : x = table ٨ x.border=0 Addnode (“box”, idbox) where idbox = NodeAmount(Tt)

AddAttribute (idbox, “type”, “vertical”)

Input

Name=in1Maxlength=15Value=loginType=text

Element B

TextComponent

Name=in1Maxlength=15defaultContent=loginId=in1

Element Y


5.Derivation rules categories Rules can be classified into different

categories, outlining the common issues in a RE process for various source UIs. Element recovery Attribute detection Layout / temporal ordering analysis Dialog recuperation Hierarchy recovery Multi-model transformations Retargeting operations

Element 1 Element 2

Element 3

Horizontal box

Horizontal box

Ver

tical

box

Element 1 Element 2 Line Break Element 3

x Tt: x=bix ٨ ((rigthSibling(x)!=table ٧ rigthSibling(x)!=bix ٧ rigthSibling(x)!=cell ٧ rigthSibling(x)!=box) ٨ rigthSibling(x)!=NULL) CloneNode (rightSibling(x).id, idnew) ٨ RemoveNode (rightSibling(x), rightSibling(x).id) ٨ RemoveArc (ParentNode(rightSibling(x)), rightSibling(x)) ٨ AddArc(x.id, idnew) where idnew =∑ node Tt

Layout Analysis x to Tti ,y to Tt0: x = window ٨ (y=box ٧ y=window) ٨x.filename

=y.targetfile CloneNode(x.id, idnew, Tt0) where idnew =∑ node Tt0 ٨ RemoveNode(x, x.id) ٨ RemoveArc(ParentNode(x).id, x.id) ٨ z=root(Tti) ٨

Remove Node(z,z.id) ٨ AddArc(y.id, idnew) x to Tti ,y to Tt0: x = vocalGroup ٨ y=VocalGroup ٨x.filename =y.insertFile

CloneNode(x.id, idnew, Tt0) where idnew =∑ node Tt0 ٨ RemoveNode(x, x.id) ٨ RemoveArc(ParentNode(x).id, x.id) ٨

z=root(Tti) ٨ Remove Node(z,z.id) ٨AddArc(y.id, idnew) Multi-model transformations


6.1.RE of Web Pages:Vaquita

First RE study with the following major working hypotheses: Focus on presentational aspects No recovery of layout and dialog XIML presentation model as ouput Static flexible RE of Web Pages



Flexibility ensured thanks to reverse engineering options

- Implemented in VB 6- About 10,000 LOC- Local Web page as input


6.1.Reengineering with Envir3D

<Presentation_element Id="First(give_Label-8"><Name>a Label</Name><Features><Attribute_Statement Definition="LabelString">First (given) name:</Attribute_Statement><Attribute_Statement Definition="LabelSize">7</Attribute_Statement><Attribute_Statement Definition="LabelFont">sans-serif</Attribute_Statement><Attribute_Statement Definition="LabelColor">#000000</Attribute_Statement><Attribute_Statement Definition="LabelStyle">normal</Attribute_Statement><Attribute_Statement Definition="LabelJustif">Left</Attribute_Statement><Attribute_Statement Definition="Margin">0</Attribute_Statement></Features></Presentation_element>

HTML Page

Vaquita: reverse engineering

XIML Page

Envir3D: virtualisation of non-virtual user interface

VRML97/X3D file

VRML97-enabled browser


6.1.RE of Web Pages:ReversiXML

Shortcomings VaquitaShortcomings Vaquita Requirements ReversiMXLRequirements ReversiMXL

Licensed usage of XIML Free usage of UsiXML, open-source UIDL

Limited recovery of the presentation

Complete recovery of CUI (& AUI) including layout and dialog, (but not scripts or CSS)

Off-line process permitting no context awareness

On-line and off-line tool / on-line process allows the detection of the context of use

Interactive Interactive & batch

Almost no interoperability with other tools

Interoperability with several tools (IdealXML, QtkXML, GrafiXML…)

2nd reverse engineering tool to overcome shortcomings of Vaquita Modified working hypothesis:



2. Syntax Correction

1. Web Page Extraction

3.Selection of Options

Tidy

4. Global Scan

5. Local Scan

6. Layout Relations

7. Dialog Relations

8.Model Correction

9. Context Model

10. Save Model

ConfigurationDB

UI Model DB

WhoAmI

ContextDB

UI Model DB

Server TemporaryPages

Temporary Information



Written in php 5 On-line RE About 12,000 LOC Set of libraries


6.2.RE of Phone Interfaces

Major working hypotheses Static RE of WML 1.1 and voiceXML 2.0 up to the

CUI in USIXML 1.4.6 Recovery of the layout and hierarchy/temporal

ordering. Dialog-Navigation analyzed (but not scripts) No retargeting operations

Similar method to HTML applied for WML & VoiceXML reverse engineering Description of languages meta-models and

derivation rules.


6.2.RE of Phone Interfaces WML

Several derivation rules identical - or less constraining- to HTML (combined rules starts with TH/W)

RE prototype developed in [Cui05] VoiceXML

Derivation rules completely different from HTML and WML

Several losses due to ecmascripts integration (conditions, events…).


6.2.RE of WML Phone Interfaces

Example Prototype [Cui05] using XSLT + XPATH Local process allowing no design

alternatives

WML<p> Yahoo! ID:<input name="login" value="" format="*m" />Password:<input type="password" name= "passwd" value="" format="*m" /><anchor title="OK">Submit<go method="post" href="/raw?">

USIXML<textComponent id="textComponent_1" glueHorizontal="left“ isVisible="true" isEnabled="true" defaultContent="Yahoo! ID:<textComponent id="textComponent_2" glueHorizontal="left" defaultContent="" isEditable="true" isVisible="true"/>


6.3.RE of Windows Interfaces

Major working hypothesis Static RE of .RC files up to the CUI in USIXML 1.4.6 No recovery of dialog No layout, hierarchy and retargeting not covered

Resource file have to be modified in order to obtain a tree structure, so that derivation rules can be applied

Major difficulties Compact attribute specifications: shortcuts notations /

hexadecimal Layout expressed in absolute positions / overlapping

elements Hierarchy of elements not clearly defined Attributes values defined/modified in the functional core


7.Results of the Evaluation Theoretical validation of the HTML RE approach

Coverage 93% of HTML tags recovered

Coherence Coherent application of rules and, by analogy, of the entire rules

set Performance

20 web pages reverse engineered in a classical RE and with retargeting

25% (up to 65%) of size reduction thanks to retargeting and 20% of process time diminution

Correction Manual RE of 5 web pages Most important categories are always fully recovered Retargeting preserve correctness of models


7.Results of the Evaluation Exploratory Study

qualitative study achieved by 17 students of LINF2356 course

Case studies illustrating various HTML RE techniques

Study of reengineering of the Sedan-Bouillon Website thanks to two FE tools: Teresa and QtkXML


7.Results of the Evaluation

With Teresa RE applied without retargeting USIXML CUI model used as input in Teresa that

performs translations for another context of use Produces the Web site designed for Pocket PC

(XHTML)


7.Results of theEvaluation With QtkiXML

Original UIReengineered UI


8.Conclusion - Contributions

Conceptualization Development of a flexible method in a

model-based approach addressing the problem of declarative UI RE process[Boui2a]

Retargeting concept [Boui02b] Operationalization

2 HTML RE tools [RIHM,Boui02c, Boui03] Study of full reengineering with Teresa,

Envir3D[Boui04], QtkiXML


8.Conclusion - Contributions(2)

Test The validation against four criterion (coverage,

coherence, correction, performance) Exploratory study of the use of the tool and

RE/retargeting evaluation Generalization

Semi-formal notation for RE derivation rules Meta-models and derivation rules for XIML,

HTML, WML, VoiceXML, Windows resource files and identification of common RE subproblems [Boui05].


8.Conclusion - Projects Contributions

Cameleon (2002-2005): Approach for Web RE and tool support Contributions to USIXML

Similar (2005-2006): Extension of the approach to phone

UI and windows applications Extension of USIXML


8. Conclusion - limitations Dialog aspects of the UI (imperative

language). Static RE implies losses, dynamicity

needed to complete models. Retargeting concept. Notation for declarative UI with simple CF

and representable as a tree. Limited automated reengineering

(usability).


8.Perspectives Short term

Extend the coverage of the RE sub-problems for windows UI.

Implement two new tools to RE VoiceXML and Windows resources files.

Expand the existing implementation of ReversiXML.

Long term Widen scope of sources languages (Visual

Basic, Delphi…). RE of scripts to recover dialogue entirely.

Explore new RE techniques. Complete RE of context model. Study of RE to other languages (UIML…)


PerspectivesBegin VB.Form Calculator

BorderStyle = 1 'Fixed Single Caption = "Calculator" ClientHeight = 2970 ClientLeft = 2580 ClientTop = 1485 ClientWidth = 3270 ClipControls = 0 'False BeginProperty Font name = "System" charset = 1 weight = 700 size = 9.75 underline = 0 'False italic = 0 'False strikethrough = 0 'False EndProperty Height = 3375 Icon = "CALC.frx":0000 Left = 2520 LinkMode = 1 'Source LinkTopic = "Form1" MaxButton = 0 'False ScaleHeight = 2970 ScaleWidth = 3270 Top = 1140 Width = 3390 Begin VB.CommandButton Number Caption = "7" Height = 480 Index = 7 Left = 120

<Window id=“1” name=“1”isVisible=“true” isEnabled=“true”defaultBorderTitle=“Calculator” borderWidth=“1”height=“358” width=“309”> <Box id=“2” name=“2” type=“verticall” isVisible=“true” isEnabled=“true”><button isEnabled=“true”…

USIXML


The interactive systems of today are the legacy systems of tomorrow. Therefore, reverse engineering of information systems will never become an obsolete problem itself.

THANK YOU FOR YOUR THANK YOU FOR YOUR ATTENTIONATTENTION



Web page extraction

HTML Page

Tidy

Msxml3.dll

XML File

XIML Presentationmodel

.RESResource file

Detection

Structuration

Manual modification

VAQUITA

Translation

New DOM writing User Interface Generator

WML, VoiceXML,HTM files

ReverseEngineering

ForwardEngineering



14: GROUPBOX "Direction", -1, 135, 22, 60, 34, WS_GROUP

15: AUTORADIOBUTTON "&Up", 234, 140, 30, 45, 12, NOT WS_TABSTOP | WS_GROUP

16: AUTORADIOBUTTON "&Down", 235, 140, 42, 45, 12, NOT WS_TABSTOP

<Box id=“18” name=“18” type=“vertical” isVisible=“true” isEnabled=“true” height=“90” width=“55” defaultBorderTitle=“Direction”> <Box id=“19” name=“19” type=“horizontal” isVisible=“true” isEnabled=“true”><radtioButton id=“20” name=“234” isVisible=“true” isEnabled=“true” defaultMnemonic=“u” /><textComponent id=“21” name=“9” defaultContent=“Up” isVisible=“true” isEnabled=“true” textSize=“8” textFont=“Ms Shell Dlg” /> </box><Box id=“22” name=“22” type=“ horizontal” isVisible=“true” isEnabled=“true”><RadioButton id=“23” name=“235” isVisible=“true” isEnabled=“true” defaultMnemonic=“d” /><textComponent id=“24” name=“24” defaultContent=“Down” isVisible=“true” isEnabled=“true” textSize=“8” textFont=“Ms Shell Dlg” /> </box> </box><button id=“25” name=“205” isVisible=“true” isEnabled=“true” defaultMnemonic=“f” defaultContent=“Find Next” />



Windows .RCfile

Elements recovery

Attribute recuperation

Hierarchy detection

Layout deduction

Dialog relations

Save model USIXML CUI

KB of shortcutnotations

Windows .RES fileDecompilationUI detection


Architecture ReversiXML 1.0-1.1

ReversiXML

LAMP server

HTML page

Forward Engineering

tool

2

3

1

4

5

ReversiXML

LAMP server

HTML page

Forward Engineering

tool

3

5

11

9

6

1

2

Configuration DB

Web server

4

Reverse engineerdUI DB

TemporaryPages

7

12

10

8

1413


Architecture ReversiXML 1.2

ReversiXML

LAMP server

HTML page

Forward Engineering

tool

3

6

14

7

1

2

Configuration DB

Web server

Reverse engineerdUI DB

TemporaryPages

8

15

13

11

1716

HTML page

Archive.org

910

Context DB

User

Designer

5

4

12


UIML – other languages Valable car USIXML a des capacités d’expression

très similaire à UIML (+contexte). Peu de changement conceptuellement, les

principes restent les mêmes (détections éléments, attributs, layout…)

Différences majeures: UIML plus proche du FUI (incorporation de « code »). Plus grande séparation entre présentation et contenu -

(mais resource model en USIXML). Connections avec les autres parties de l’interface et

comportement des objets plus précis USIXML plus riche en termes de modèles, différents

niveaux d’abstraction et outils non-commerciaux.


ConclusionContributions categorized into four levels In the conceptualization:

The development of a flexible method thanks to a model-based approach addressing the problem of declarative UI RE process

The adaptation of the RE definitions to the UI domain and their positions in the conceptual framework (section 2.2).

The retargeting concept (section 2.3) and some retargeting rules (appendix G).

The constitution of a state of the art in RE (chapter 3) The identification of shortcomings of the output language

that led to modifications of the USIXML language. The specification of meta-models illustrating the

complete structure of XIML, HTML, WML, VoiceXML, Windows resources files in UML class diagrams (appendix A and B).


Conclusion (2) The development of derivation rules based on these meta-models

for HTML (6.3), WML (7.1.3), VoiceXML (7.2.3), Windows resource files (section 8.3) completed by appendix C. Derivation tables for HTML towards XIML presentation model were also described (5.3).

For the operationalization: Vaquita for the static flexible RE of HTML files into an XIML

presentation model. ReversiXML an online tool allowing the flexible RE of HTML files

into a CUI or AUI model expressed in USIXML. A prototype of RE tool able to extract a CUI model from WML files.

In the test phase: The validation against four criterion: coverage, correction,

coherence and performance(section 9.1)


Conclusion (3) An exploratory study describing a qualitative evaluation

of the produced models, the tool, and the advantages of using retargeting (section 9.2.1).

Three case studies of various complexities (section 9.2.2)

An investigation of the full reengineering by combining the results of ReversiXML with TeresaXML and QtkXML (section 9.2.2) and the reengineering in a virtualization process is also described in section 5.1.4.

For the last step of generalization: A semi-formal notation for RE derivation rules (chapter

4 and appendix C) for various source UI. A generalization of the reverse engineering method

thanks to an analysis of the process applied to a large scope of UI and the identification of common RE tasks to be achieved (section 4.4.8).


ReversiXML Shortcomings

CSS support Javascript RE Embedded components (flash, java...) Universal access Box reduction Use of statistics to refine RE Pursue implementation

Site RE Evolution to architecture 1.2 Context model & selection mechanism Complete the RE of AUI


6.2.RE of Phone InterfacesWML or

VoiceXML file

Elements & attribute recovery

Hierarchy/temporal sequence detection

Dialog relations

Model Correction

Model links

Save model USIXML CUI

Temporary Information


1.The Reengineering Problem Benefits of reengineering

Practical benefits Economical benefits Theoretical benefits

Importance of reengineering Amount of legacy systems (60%)

New needs for reengineering New context of use (internet enabled platforms)


Integration with other works

ŒTask & Concepts

Abstract UI

Ž Concrete UI

Final UI

Task & Concepts

‘ Abstract UI

’ Concrete UI

“ Final UI

Task & Concepts

Abstract UI

Concrete UI

Task & Concepts

Concrete UI

Final UI

Reverse engineeringand retargeting

Graceful Degration, TransformiXML

Grafixml

TransformiXML

Abstract UI

Final UI


7.Results Evaluation Exploratory Study

qualitative study achieved by 17 students of LINF2356 course

Aim: use ReversiXML and GrafiXML to produce previews of UI suited for mobile phones and pocket PC, by using:

retargeting operations manual modifications

Conclusion: Produces correct and expected results with various

configuration Flexible process/retargeting really important as it

allows to save time and efforts during the reengineering process


MDA compliance Models are expressed in a unified notation and form the

cornerstone to understanding software systems (semantics of the models are based on meta-models). UsiXML models are well-formed models based on XML schema. The semantics of the models are based on meta-models expressed in terms of UML diagrams, from which the XML schema is derived.

The building of software systems can be organized around a set of models by applying a series of transformations between models, organized into an architectural framework of layers and transformation. Model-to-model transformations are specified in UsiXML. Model-to-code transformations are ensured thanks to a set of forward engineering tools. Code-to-model transformations are achieved by derivation rules that are based on the mapping between the meta-model of the source language and the meta-model of UsiXML.


MDA Compliance (2) A formal underpinning for describing models in a set of meta-

models facilitates meaningful integration and transformation among models, and is the basis for automation All transformations are explicitly defined, based on a series of predefined semantic relationship and a set of the primitive ones (abstraction, reification and translation).

Acceptance and adoption of this model-driven approach requires industry standards to provide openness to consumers, and foster competition among vendors. The last principle is on the way, as the potential wide adoption of the above techniques will validate the principle.

Four levels of abstraction are almost similar with the various layers of MDA.


8.Conclusion: rules categories Elements and attributes

46 rules sets Layout / Temporal ordering

6 rules sets/ 10 rules sets Dialog

11 rules sets Hierarchy

6 rules sets Multi-Model transfomation

6 rules sets Retargeting

14 rules sets

3 drop down list boxes

Radio button

Table Extended edit box Edit box


MDE

MDE Attention focuses first on the application's

business functionality and behavior Same principle but focus on

processing/communication UML + MOF


UsiXML model:Abstract user

interface

UsiXML model:Concrete user

interface

Rendering

Final userinterface

UsiXMLmodels: task,

domainGenerative

programming

Graphtransformations

Graphtransformations

Derivation rules

IdealXML

ReversiXML

FlashiXML

VisualiXML

TransformiXML

GrafiXMLVisiXML

SketchiXMLFormiXML

KnowiXML


QVT

QVT UML to UML mappings Too complex for the objectives of our

notation Tools applies on UML diagrams, based

on UML meta-models, not on code based on UML meta-models

Open question, as released recently

1 reverse engineering of declarative user interfaces examination committee: prof. bernard fortz,...

Documents