Model-Based Approaches to Reengineering Web Pages
•Download as PPTX, PDF•
1 like•976 views
Today's web sites are increasingly being accessed through a wide variety of computing platforms ranging from the workstation to a laptop and through multiple access devices such as Internet Screen Phone, TV Set Top box, PDA, and cellular phones. Web sites are rarely de-signed and developed to fit such a large variety of contexts of use as each context (e.g., each computing platform, each device) has its own set of constraints. This pa-per describes a model-based approach for reengineering web pages into a presentation and a dialog model stored with XIML, a model-based user-interface specification language. These models are then further exploited to reengineer other user interfaces either for the same context of use (by changing presentation design options) or for different contexts of use (by changing properties of computing platform model). For this purpose, three key elements of the presentation model (i.e. presentation units, logical windows, and abstract interaction objects) and two key elements of the dialog model (i.e., navigational structure and transition) were defined.
Report
Share
More Related Content
Similar to Model-Based Approaches to Reengineering Web Pages
Similar to Model-Based Approaches to Reengineering Web Pages (20)
More from Jean Vanderdonckt
More from Jean Vanderdonckt (20)
Recently uploaded
Recently uploaded (20)
Model-Based Approaches to Reengineering Web Pages
- 1. Université catholique de Louvain (UCL) Louvain Interaction Lab (LiLab) Place des Doyens, 1 B-1348 Louvain-la-Neuve (Belgium) Model-based Approches to Reengineering Web Pages by Laurent Bouillon, Jean Vanderdonckt & Jacob Eisenstein
- 2. Introduction: the needs (1/2) Need to access the same web site from different HTML access devices => other presentations A presentation model of a web page can be reverse engineered to migrate it to another environment
- 3. Introduction: the needs (2/2) Need to adapt Web contents to different appliances – Tag-based language: WML, cHTML, VoiceXML – Programming language: C, C++, Java – Design time vs Run-time Need to migrate legacy systems from old platforms to new platforms without loosing effort Wish to support context-sensitivity
- 4. Traditional approaches used Forward engineering Interactive application Domain model Semantic core code User inter-face code UI Integration Application modeling and development Application model Data model Semantic core component Presentation model Dialog model Domain modeling User interface modeling and generation Application modeling and development Scenario Interactive application Task model Domain model User model Semantic core code User inter-face code UI Integration Application model Data model Semantic core component Presentation model Dialog model User-task elicitation User interface modeling and generation
- 5. Example of forward engineering Multiple UI model-based approach - Atomica
- 6. Reverse engineering Interactive application Semantic core code UI Extraction User inter-face code Presentation model Dialog model User interface reverse engineering
- 7. Reengineering Combination of reverse and forward Interactive application Semantic core code UI Extraction User inter-face code Presentation model Dialog model New UI code User interface reverse engineering and forward engineering New UI Integration New interactive application
- 8. Redocumentation Same as re-engineering with platform Interactive application Semantic core code UI Extraction User inter-face code Presentation model Dialog model New UI code User interface reverse engineering and redocumentation New UI Integration New interactive application Platform model (1) (2)
- 9. Design recovery More « intelligence » required Interactive application Semantic core code UI Extraction User inter-face code Application reverse engineering User interface reverse engineering Task model Domain model User model Application model Data model Semantic core component Presentation model Dialog model User, task, and domain reverse engineering Log files Predictive models Design heuristics Usability guidelines
- 10. Vaquita VAQUITA (reVerse engineering of Applications by Questions, Information Selection, and Transformation Alternatives) http://www.isys.ucl.ac.be/ bchi/research/vaquita.htm
- 11. The algorithm Presentation and dialog Inclusion/exclusion of presentation elements Initialization of the Web pages pool Web pages pool empty? Selection of an individual Web page Identification of Concrete Interaction Objects Transformation of Concrete Interaction Objects into Abstract Interaction Objects Selection of Logical Window Hierarchy building for LWs and PUs Update vectors of links and Web pages pool Identification of links Abstraction of links into Windows Transitions Identification of Navigation Structures Building of presentation model Building of dialog model yes no
- 12. The RE process in Vaquita Web page extraction HTML Page Tidy Msxml3.dll XML File XIML Presentation model .RES Resource file Detection Structuration Manual modification VAQUITA Translation New DOM writing User Interface Generator WML, VoiceXML, HTM files Reverse Engineering Forward Engineering
- 13. The Target : a presentation model Presentation Unit 1-n Logical Window 1-n Composite AIO 1-n Simple AIO = can be composed = is-a 0-n 0-n 0-n 1-n 1-n 0-n Presentation AIO Control AIO
- 14. The Means : RE options Flexible usage of mapping tables 2 types of options: - Objects and attributes options - Alternative heuristic options (folding, Table mapping …)
- 15. XIML * Presentation stored in XIML (http://www.ximl.org) * Two types of relationships: - hierarchical relationship - spatial relationships (layout)
- 16. Options
- 18. Conclusion Vaquita allows flexible reverse engineering and so permits multiple presentation models. Part of a larger migration process, results will be used with other tools. Can be used for iterative redesigning of a web page. The reverse engineering is limited to a static analysis. A dynamic analysis may improve the redesign of a web page for another context of use.