TU/e
technische universiteit eindhoven
Hypermedia Presentation
Adaptation
on the Semantic Web
Flavius Frasincar
Geert-Jan Houben
http://wwwis.win.tue.nl/~hera
TU/e
technische universiteit eindhoven
Overview
•
•
•
•
•
•
•
Motivation and Goals
HERA Design Methodology
Conceptual Design
Application Design
Adaptation Design
Prototype and Rendering
Conclusion
TU/e
Motivation: WIS Engineering
technische universiteit eindhoven
• 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
TU/e
Motivation: Adaptation
technische universiteit eindhoven
• Presentations must be adaptable to different
users/user platforms
• Devices (PC, PDA, WAP Phone, WebTV etc.)
• Device capabilities (display size, memory size,
network speed, etc.)
• User preferences (desired layout, navigation
patterns, etc.)
• User browsing history
TU/e
technische universiteit eindhoven
Goals
• Develop a methodology for automated
hypermedia presentation design (generation) that
– is intended for Web-based information systems (WIS)
– integrates heterogeneous data sources
– facilitates presentation (server/client-side) adaptation
to device capabilities and user preferences
– enables semi-structured data queries
TU/e
technische universiteit eindhoven
HERA Architecture
Object-Oriented
Database
Relational
Database
ODB-XML
Wrapper
RDB-XML
Wrapper
User/Platform
Adaptation
Mediator/
Integrator
Query
Logical
Presentation
XML
Database
…
Information Retrieval
Hypermedia Presentation
Logical-HTML
Presentation
Logical-WML
Presentation
Logical-SMIL
Presentation
HTML
Presentation
WML
Presentation
SMIL
Presentation
…
TU/e
Hera Design Methodology
technische universiteit eindhoven
• Originates from RMM (Relationship Management
Methodology)
• Suggests a sequence of design steps to be taken
when designing a web application
• Supports
– integration of heterogeneous information
– automated presentation design
– user/platform adaptation
TU/e
Hera Design Methodology
technische universiteit eindhoven
Semantic Layer
Application Layer
Presentation Layer
Design Methodology
Requirements
Analysis
Conceptual
Design
Conceptual
Model
Integration
Design
Integration
Model
Application
Design
Adaptation
Design
Application
Model
User
Model
Presentation
Design
Presentation
Model
Hera Suite
Integration
Engine
info
request
(meta) data
(Search)
Agent
RQL / RDF
Application
Engine
Adaptation
Engine
info request
(slice)
presentation
Cuypers
Engine
XSLT / XML
Presentation
Engine
info request
HTML/WML
End User
TU/e
Conceptual Model (CM)
technische universiteit eindhoven
• 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
• Encoded in RDF(S)
TU/e
Conceptual Model Example
technische universiteit eindhoven
TU/e
CM Example RDF(S) Syntax
technische universiteit eindhoven
<rdfs:Class rdf:ID="Artifact"/>
<rdf:Property rdf:ID="picture">
<rdfs:Class rdf:ID="Painting">
<rdfs:domain rdf:resource="#Painting"/>
<rdfs:subClassOf rdf:resource="#Artifact"/> <rdfs:range rdf:resource="#Image"/>
</rdfs:Class>
</rdf:Property>
<rdf:Property rdf:ID="name">
<rdf:Property rdf:ID="created_by">
<rdfs:domain rdf:resource="#Artifact"/>
<sys:cardinality rdf:resource="#single"/>
<rdfs:range rdf:resource="#String"/>
<sys:inverse rdf:resource="#creates"/>
</rdf:Property>
<rdfs:domain rdf:resource="#Artifact"/>
<rdf:Property rdf:ID="year">
<rdfs:range rdf:resource="#Creator"/>
<rdfs:domain rdf:resource="#Artifact"/>
</rdf:Property>
<rdfs:range rdf:resource="#Integer"/>
...
</rdf:Property>
TU/e
Application Model (AM)
technische universiteit eindhoven
• Captures navigational view over CM, describing
hypermedia aspects
• Slices are meaningful presentation units:
– Associated to concepts from CM
– Containing properties/attributes and possibly other
slices
• Slices are linked together with slice relationships:
– Aggregation relationships: index, tour, indexed guided
tour etc.
– Reference relationships: link with an anchor specified
• Encoded in RDF(S)
TU/e
Application Model Example
technische universiteit eindhoven
TU/e
AM Example RDF(S) Syntax
technische universiteit eindhoven
<rdfs:Class rdf:ID="Slice.technique.main">
<rdfs:subClassOf rdf:resource="#Slice"/>
</rdfs:Class>
<rdfs:Class rdf:ID="Slice.painting.main">
<rdfs:subClassOf rdf:resource="#Slice"/>
</rdfs:Class>
<rdfs:Class rdf:ID="Link_exemplified_by"
rdfs:subClassOf="#Link">
</rdfs:Class>
<rdf:Property rdf:ID="source">
<rdfs:domain rdf:resource="#Link_exemplified_by"/>
<rdfs:range rdf:resource="#Image"/>
</rdf:Property>
<rdf:Property rdf:ID="destination">
<rdfs:domain rdf:resource="#Link_exemplified_by"/>
<rdfs:range rdf:resource="#Slice.painting.main"/>
</rdf:Property>
<rdf:Property rdf:ID="slice.painting.main">
<rdfs:domain rdf:resource="#Painting"/>
<rdfs:range rdf:resource="#Slice.painting.main"/>
</rdf:Property>
TU/e
technische universiteit eindhoven
Adaptation
• WIS are accessed through multitude of devices
and by different users
– Device capabilities
– User preferences
– Browsing history
• Adaptation based on conditioning the appearance
of slices in AM
TU/e
Adaptation/User Model
technische universiteit eindhoven
• Captures two kinds of adaptation
• Adaptability takes into account the situation in which the
user will use the presentation (e.g. the browsing platform)
• Adaptivity means that the presentation changes itself
according to the “state of the user’s mind” while being
browsed
• Consists of
• Device/User Profile captures “static” visual and platform
preferences encoded in CC/PP
• User Session represents the dynamic user’s state, e.g. did the
user visit (learn) this slice (concept)
• Application and Update Rules describe the behavior of the
presentation (e.g. conditional slices in AM) and keep the User
Session up-to-date (AHAM rules)
TU/e
Adaptation Model Example
technische universiteit eindhoven
TU/e
Adaptation Model Syntax
technische universiteit eindhoven
Adaptability Condition
<rdfs:Class rdf:ID=“Slice.painting.picture”
slice:condition=“prf:ImageCapable=Yes”>
<rdf:subClassOf rdf:resource=“#Slice”/>
</rdfs:Class>
Adaptivity Condition
<rdfs:Class rdf:ID=“Slice.painter.main”
slice:condition=“us:Biography =false”>
<rdf:subClassOf rdf:resource=“#Slice”/>
</rdfs:Class>
<rdfs:Class rdf:ID=“Slice.painting.main”
slice:condition=“us:Painter > 10”>
<rdf:subClassOf rdf:resource=“#Slice”/>
</rdfs:Class>
TU/e
technische universiteit eindhoven
Profile Example
Device/User Profile (CC/PP encoding)
• Screen size: 100x80
• Preferred language: English
<rdf:Description rdf:about=“Profile”>
<ccpp:component>
<prf:HardwarePlatform>
<prf:ImageCapable>No</prf:ImageCapable>
<prf:ScreenSize>100x80</prf:ScreenSize>
…
</prf:HardwarePlatform>
</ccpp:component>
<ccpp:component>
<up:UserPreferences>
<up:Language>English</up:Language>
…
</up:UserPreferences>
</ccpp:component>
</rdf:Description>
TU/e
Update Rule (AHA) Example
technische universiteit eindhoven
Update the Biography record in the User
Session table to true after the user visited
“Slice.painter.main”.
<us:Slice.painter.main”>
<aha:updatelist>
<aha:SetOfConcepts>
<aha:item><us:Biography
aha:update=“true”/></aha:item>
…
</aha:SetOfConcepts>
</aha:updatelist>
</us:Slice.painter.main>
US
us.Biography(“Rembrandt”)
…
Value
false
…
US
us.Biography(“Rembrandt”)
…
Value
true
…
TU/e
Update Rule (AHA) Example
technische universiteit eindhoven
<us:Slice.painter.main”>
<aha:updatelist>
<aha:SetOfConcepts>
<aha:item><us:Painting
aha:update=“+80”/></aha:item>
<aha:item><us:Painter
aha:update=“+40”/></aha:item>
…
</aha:SetOfConcepts>
</aha:updatelist>
</us:Slice.painter.main>
US
us.Painter(“Rembrandt”)
…
US
us.Painter(“Rembrandt”)
…
Value
0
…
(<10)
Value
40%x35=14
(>10)
…
TU/e
technische universiteit eindhoven
Presentation Model
• Based on the concept of region which contains
attributes and possibly other regions
• Each region has a rectangular area associated
• Slices are translated to regions, one slice can be
mapped to several regions
• Slice relationships are materialized with:
– Navigational relationships
– Spatial relationships
– Temporal relationships
TU/e
Presentation Model Example
technische universiteit eindhoven
Region
bookcase
shelf
painting
0
Attribute
P.picture
P.picture
(Associated to a
certain painting P)
P.name
1
…
right
2
0
xy
below
Navigational
Relationship
Bookcase regions
Spatial
Relationship
P1
P2
P3
P1
‘Stone Bridge’
1638
P4
P5
P7
…
P6
Screen rendering
…
Priority
(Priority 0 is always
fulfilled)
TU/e
technische universiteit eindhoven
Prototype
• XSLT code generation
• Two code generators:
– HTML for PC Web browsers
– WML code for WAP phone browsers
HTML
<xsl:template match=“slice-instance”>
<TABLE>
<xsl:apply-templates select=“*”/>
XSL
XSL
WML
<xsl:template match=“slice-instance”>
<CARD id=“{@id}”>
<xsl:apply-templates select=“*”/>
</TABLE>
</CARD>
</xsl:template>
</xsl:template>
TU/e
technische universiteit eindhoven
Rendering
TU/e
technische universiteit eindhoven
Rendering
TU/e
technische universiteit eindhoven
Summary
• Hera methodology originated from RMM,
suggests a sequence of design steps
• Our framework supports
– integration of heterogeneous information (CM
populated from several heterogeneous data sources)
– automated presentation design: AM serves as a
presentation blue print from which a concrete
presentation is derived (w.r.t. a query)
– user/platform adaptation (adaptability and adaptivity)
TU/e
technische universiteit eindhoven
Future Work
• Adaptation in all design steps including the
Conceptual Model and Integration Model
• Experiment with higher ontology languages (e.g.
DAML+OIL) as the basis for the CM
• Further development of tools for presentation
rendering
• Authoring tools that would help the designer to
build specification models in all design steps