Presentation is loading. Please wait.

Presentation is loading. Please wait.

Web Engineering Geert-Jan Houben.

Similar presentations

Presentation on theme: "Web Engineering Geert-Jan Houben."— Presentation transcript:

1 Web Engineering Geert-Jan Houben

2 Contents Web Information System (WIS) Evolution in WIS WIS Engineering

3 Web Information System (WIS)

4 Information system Exchanges information with Object System (= business process) Stores and manages information: data-intensive Requires careful engineering of information exchange Requires careful engineering and modeling of object system Traditionally database-oriented

5 Web Information System
Information System based on Web technology (Web-based, Web-aware, Web-enabled etc.) Web technology can be used as front-end, e.g. application is available on the Web (or Intranet) via a browser Enables easy use and maintenance of (personalized) end-user access Web metaphor is appealing for end-users Requires different techniques for engineering the system’s interfaces

6 Web Information System
Web technology can also be used in back-end of information system Organize (connect) the data inside the system using Web technology Use World Wide Web as provider of data (or Intranet) Typically highly volatile information (distributed and heterogeneous) Requires different techniques for engineering the implementation

7 Examples Real-estate sales Employee databases Museum databases
Digital libraries Mail order catalogs Reservation systems Auctions, virtual marketplaces EPG (Electronic TV Program Guide) Ref: Special section on Web Information Systems in Communications of the ACM, July 1998, Vol. 41, No. 7

8 Research In WIS how to (automatically) generate hypermedia access to the information? Hypermedia access: navigation Personalization, customization: adaptation Information integration: (logistics of) information retrieval from available, heterogeneous sources Interoperability: for e-business, business rules, service integration Querying and transforming (data and metadata) Ref:

9 Evolution in WIS

10 Hypermedia Hypertext + multimedia
Information objects (text, images, animations, audio, video) Not possible to show everything at once: Layout Timing Navigation Design (generate) presentation for WWW, WAP, PDA’s, etc. W3C expects that majority of surfers will not be using a PC

11 Evolution in hypermedia
First: standalone special-purpose systems Now: Web-based From authoring to designing to generating From static to dynamic (generated from database query result) From single site to portals (integrated access service) From read-only to interactive and often collaborative (read-write)

12 Three Generations of Web
HTML written by author Easy, uniform interface Large effort for maintenance Not suited for changing information Automatically generating information First, using templates (and databases) Later, using XML and XSLT transformations Automatic processing of information Explicit metadata (RDF) Agreement on meaning (ontologies)

13 Future developments Semantic Web research aims at even further developments in Web applications From human-readable via machine-readable to machine-processable

14 “Layer Cake”

15 Web-based IS Web-browser as front-end
Data repository (data base) as back-end Design: Data (content) structures: ER-modeling Navigation Presentation: layout Implementation: On-line (direct database access) Off-line (generated from database)

16 WebML View A Web-enabled software system whose main purpose is to publish and maintain large amounts of data Interfaces directed to general public exploratory browsing-oriented personalized (1 to 1) Data stored by means of DBMS technology Possibly pre-existing the Web application Normally volatile With severe “freshness” requirements May be distributed and heterogeneous

17 OOHDM View (1) Object-Oriented Hypermedia Design Method
WWW brought new generation of IS: navigation through heterogeneous information space operations querying or affecting that information Introduced hypertext (hypermedia) paradigm Applications are constantly modified, enriched with new services, and new navigation and interface features are added

18 OOHDM View (2) Web-based application, first good hypermedia applications Traditional (SE) methodologies have no notion of linking: little is said about incorporating hypertext into interface Size and complexity imply systematic approach for evolution and reuse of design knowledge

19 RMM’s View History: graphics designers + programmers
Experience: central information architecture and shared, common mechanisms/services helpful for coping with problems of scalability and “information anarchy”

20 Nielsen’s View “On the Web, the only constant is change. A site that works perfectly as long as its stays the same will quickly die.” Healthy navigation structure key to success Building interface is also complex, connecting interface objects to rest of application

21 WIS Engineering

22 WIS Engineering Methodology
Design of WIS requires careful engineering of information exchange between IS and OS Implies engineering of front-end (interface) and back-end (storage & retrieval) Professional applications: “from art to engineering” well-founded (software) engineering methodologies model-driven

23 More engineering issues
Personalization (1-1) Multiple output devices Development and maintenance costs e.g. documentation

24 Modeling Presentation level Storage level Logical level
“Network” of Web pages Storage level HTML pages, report and scripts, graphics, animation Logical level E-R diagram (for storage) Application diagram (M-)slices (for presentation)

25 RMM Relationship Management Methodology Entity-Relationship modeling
Transformation from data model to data+navigation model RMDM: Relationship Management Data Model represents objects and navigational relationships (navigational design of application) Design method for Web (hypermedia) applications Ref: RMM: A Methodology for Structured Hypermedia Design, by Isakowitz, Stohr and Balasubramanian et al in Comm. ACM, Vol 38, No 8

26 RMM methodology Requirements analysis E-R diagram
Application diagram (top-down) Slice design Application diagram (bottom-up) User interface design Implementation

27 RMDM (Application) domain model primitives
Entities Attributes Relationships Slices: from large objects (with many attributes) to smaller units (with coherent attributes, possibly from different objects) From semantical aspect to navigational (presentation) aspect (w.r.t. complexity and size)

28 RMDM Schema

29 Hera motivation Methodologies exist for manual hypermedia presentation design, Hera targets automated presentation Automated presentation is important for databased content (the ‘deep web’) as opposed to manually crafted content (the ‘surface web’): most WIS are data driven Presentations must be adaptable to different users/user platforms

30 Hera Methodology Model-driven methodology, defines design phases:
Conceptual Design that results in Conceptual Model (CM, describes data content used for generation of hypermedia presentations) construction Application Design that results in Application Model (AM, describes the navigation structure and functionality) construction Presentation Design that results in Presentation Model (PM, describes spatial layout and rendering of hypermedia presentations) construction

31 Hera Models Fully specify dynamic hypermedia applications; hence, there is no need of additional programming Are used by a generic Hera engine for generation of hypermedia application pages (by on-demand instantiations of model subsets)

32 Conceptual Model Provides a uniform semantic view over different data sources that are integrated within a given Web application. Consists of hierarchies of concepts relevant within the given domain, their properties, and relations.

33 Conceptual Model Defines the data content in terms of RDFS (concepts, attributes, properties)

34 Application Model Navigation structure of a hypermedia application on top of CM Hypermedia dynamics (navigation structure updates and application functionality) of a hypermedia application

35 Navigation Structure in Application Model
Navigation nodes (pages) specification in terms of slices (collections of concepts’ attributes to be displayed) Node composition in terms of slice aggregation relationships Navigation edges (hyperlinks) in terms of slice references

36 Slices Meaningful collection of attributes of one or more related concepts Represent a presentation page or its part

37 Dynamics in Application Model
User input specification in terms of Input Forms Application context (state) specification in terms of Application Context Model Context manipulation specification in terms of queries

38 Input Forms Specify user data entries; contain sets of input fields with: Input method (selection from offered items, text input, etc.) How the offered items are created (for selections) Determine data manipulation operation associated with a form (form processing)

39 Application Context Model
Extends CM with additional data structures needed for application functionality (to store application/navigation state, user inputs, user model, etc.) Example: storing the user selection (shopping basket)

40 AM Example

41 Data Manipulations Update application context information
Defined as SeRQL queries Used for processing forms (handle user input) Q1 creates instances of SelectedPainting according to the SelectForm form content CONSTRUCT {P}<rdf:type>{acm:SelectedPainting>} FROM {P}<rdf:type>{cm:Painting}; <cm:aname>{Paname} WHERE Paname IN SELECT Faname FROM {SF}<form:aname>{Faname}, {SF}<rdf:ID>{FormName} WHERE FormName = “SelectForm” creates

42 Hera Architecture Defines how the models are used for automatic generation of hypermedia presentation

43 Hera Implementation HPG 2.0 (Hera Presentation Generator, dynamic version) implemented in Java as a servlet Uses RDF API HP Jena for RDF data transformations based on RDFS models (CM, AM) Can use XForms processor Uses Sesame as main content repository and application context repository; uses SeRQL/RQL as query languages Set of graphical tools for designers for CM and AM based on Visio

44 Device Adaptation HTML SMIL WML

45 OOHDM Object-Oriented Hypermedia Design Method
Modeling/analysis, design, implementation, testing, and maintenance Conceptual Design + Navigation Design + Abstract Interface Design + Implementation navigation objects are views of conceptual objects abstractions to organize the navigation space, e.g. navigational contexts separation of interface issues from navigation issues some design decisions must only be made at implementation time

46 Other Methodologies UWE: UML-based Web Engineering WSDM
Conceptual, navigation, presentation model Storyboarding and presentation flow WSDM Information modeling, functional modeling and navigation design WebML: Web Modeling Language Structural model, derivation model (extend to adapt), hypertext model (composition and navigation), presentation model (XSL) OO-H: Object Oriented Hypermedia Navigational access diagram, abstract presentation diagram

47 WIS Engineering and Adaptation
adaptation (and personalization) is a design aspect that gained much more attention, but still is lightly supported in methodologies difficult to specify not many tools difficult combination with other aspects examples: My-portals, device-dependency

48 Adaptation Model


Download ppt "Web Engineering Geert-Jan Houben."

Similar presentations

Ads by Google