Upload
aleah-nevil
View
221
Download
0
Embed Size (px)
Citation preview
TU/e technische universiteit eindhoven
Web Engineering
Geert-Jan Houben
TU/e technische universiteit eindhoven
Contents
• Web Information System (WIS)
• Evolution in WIS
• WIS Engineering
TU/e technische universiteit eindhoven
Web Information System (WIS)
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
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: wwwis.win.tue.nl/~hera
TU/e technische universiteit eindhoven
Evolution in WIS
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
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)
TU/e technische universiteit eindhoven
Three Generations of Web
1. HTML written by author– Easy, uniform interface– Large effort for maintenance– Not suited for changing information
2. Automatically generating information– First, using templates (and databases)– Later, using XML and XSLT transformations
3. Automatic processing of information– Explicit metadata (RDF)– Agreement on meaning (ontologies)
TU/e technische universiteit eindhoven
Future developments
• Semantic Web research aims at even further developments in Web applications
• From human-readable via machine-readable to machine-processable
TU/e technische universiteit eindhoven
“Layer Cake”
TU/e technische universiteit eindhoven
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)
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
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”
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
WIS Engineering
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
More engineering issues
• Personalization (1-1)
• Multiple output devices
• Development and maintenance costs– e.g. documentation
TU/e technische universiteit eindhoven
Modeling
• Presentation 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)
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
RMM methodology
• Requirements analysis• E-R diagram• Application diagram (top-down)• Slice design• Application diagram (bottom-up)• User interface design• Implementation
TU/e technische universiteit eindhoven
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)
TU/e technische universiteit eindhoven
RMDM Schema
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
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)
TU/e technische universiteit eindhoven
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.
TU/e technische universiteit eindhoven
Conceptual Model
• Defines the data content in terms of RDFS (concepts, attributes, properties)
T e ch n iq u e Artifa ct C re a to r
Pa in tin g Pa in te r
Str in g
Str in g Ima g e
Str in g In te g e r Str in g
Str in g
tn a me
d e scr ip tio n
e xe mp lifie s *
e xa mp lifie d _ b y
a n a me ye a r
cre a te s *
cre a te d _ b y
cn a me
b io g ra p h y
p ic tu re p a in ts *
p a in te d _ b y
TU/e technische universiteit eindhoven
Application Model
• Navigation structure of a hypermedia application on top of CM
• Hypermedia dynamics (navigation structure updates and application functionality) of a hypermedia application
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
Slices
• Meaningful collection of attributes of one or more related concepts
• Represent a presentation page or its part
T echnique P ainting
Main Main
Painter
Info
painted_by
Painting
exemplif ied_by
tname
Set
pic ture
desc ription
aname
y ear
O wner concep t
S lice
A ttribu tes
S ub-slices
Reference (link)
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
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)
Se le ctF o rm
sN a n a me
a n a me
Painting
C M p ro p e rty
F o rm Pro ce ss in g
M ulti-selectio n f ro ma list o f painting nam es
Form
Selec tForm
Str ing
aname
Fo rm M o del
TU/e technische universiteit eindhoven
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)
cm:Pa in ting
Se le cte d Pa in tin g O rde r Baske t
In te ge r
inc luded_ by *
inc ludes
quan tity
* con ta ins
con ta ined _by
TU/e technische universiteit eindhoven
AM ExampleT echnique
Main P ainte rs
Basket
Main
tname
desc ription
Pa in ting sF o rm
sN b n a me
b n a me
Pa in tingSet
exemplif ied_by
Q 1
initialize
Se le cte d Pa in tin g
aname
Set
S e lec tedP ainting
Main
pic ture
aname
Bu yF o rm
i q u a n tity
q ua n titya n a me
Pa in te r
painted_by
c name
Q 2
O rde r
Main
quantity
Se le cte d Pa in tin g
inc ludes
aname
B aske t
Main
c ontains
y ear
Order
Main
Set
TU/e technische universiteit eindhoven
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”
Se le cte d Pa in tin g
Pa in ting1 Pa in tingN...
ty pe ty pe
creates
TU/e technische universiteit eindhoven
Hera Architecture• Defines how the models are used for automatic
generation of hypermedia presentation
Semantic Layer
Application Layer
Presentation Layer
C M A M P M
Co n te n t CM I AM I Pre s. Brow se r
App. Conte xtData
Q u e ry/Co n te xtM an age r,
F o rm Pro ce sso r
Use r
C MVo ca b u la ry
(R D F S)
AMVo ca b u la ry
PMVo ca b u la ry
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
Device Adaptation
HTML SMIL WML
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
Other Methodologies• UWE: UML-based Web Engineering
– 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
TU/e technische universiteit eindhoven
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
TU/e technische universiteit eindhoven
Adaptation Model
um:ExpertiseLevel = Medium
technique
name
exemplified_by
description
Set
painting picture
painting
name
painter name
main main
painted_by
year
picture
pp:ImageCapable = Yes
context independent
context dependent
TU/e technische universiteit eindhoven