sparks o3 browser: augmenting the web with semantic overlays

10
Sparks O 3 Browser Augmenting the Web with Semantic Overlays Grégoire Burel 1 , Amparo E. Cano 1 and Vitaveska Lanfranchi 1 1 OAK Group, Department of Computer Science, University of Sheffield {G.Burel, A.Cano,V.Lanfranchi}@dcs.shef.ac.uk ESWC09, 5th Workshop on Scripting and Development for the Semantic Web

Upload: gregoire-burel

Post on 30-Nov-2014

2.848 views

Category:

Technology


7 download

DESCRIPTION

This presentation presents Ozone Browser (OB), a JavaScript tool that uses the semantics embedded in Web documents for improving the user interaction experience. Ozone won the second prize at sfsw2009.This work as been done by:Grégoire Burel, Amparo E. Cano,Vitaveska Lanfranchi.

TRANSCRIPT

Page 1: Sparks O3 Browser: Augmenting the Web with Semantic Overlays

Sparks O3 BrowserAugmenting the Web with Semantic Overlays

Grégoire Burel1, Amparo E. Cano1 and Vitaveska Lanfranchi1

1OAK Group, Department of Computer Science, University of Sheffield

{G.Burel, A.Cano,V.Lanfranchi}@dcs.shef.ac.uk

ESWC09, 5th Workshop on Scripting and Development for the Semantic Web – 31st May 2009

Page 2: Sparks O3 Browser: Augmenting the Web with Semantic Overlays

RDFa: Semantic Web for Human Beings ?

• Pro:- Everything is in one place.- Human/Machine information

correspondence.- Consumption of semantic data

by third party applications.

• Cons:- Semantics are still “hidden”

from the reader.

RDFa is creating a bridge between the Semantic Web and the Syntactic Web by embedding semantics into Web documents.

Grégoire Burel, Amparo E. Cano and Vitaveska Lanfranchi

Page 3: Sparks O3 Browser: Augmenting the Web with Semantic Overlays

Semantic Overlays: Semantic Web for Human Beings !

• Semantic Overlays:- Visual and interactive layers

rendering semantics displayed on the top of Web documents containing semantics.

• Bookmarklet:- Script provided as a browser

bookmark that can be applied on the fly on any web content for modifying its content and behavior.

Augmenting visually a document and its behavior by making use of “hidden” knowledge inside and outside a document.

Grégoire Burel, Amparo E. Cano and Vitaveska Lanfranchi

Page 4: Sparks O3 Browser: Augmenting the Web with Semantic Overlays

Sparks

• Functionalities:– Semantic Data management:

– Client/Server Triple Synchronization and Manipulation.– RDFa Parser /SPARQL Processor / “Client-Side” Triple Store (rdfquery). – Support for JSON/JSONP SPARQL Endpoints.

– Semantic Data Presentation and Interaction:– Unobtrusive JavaScript. ✓– Interaction Patterns.– Graphical Libraries (SVG/VML via Raphael, YUI). ✓

A JavaScript Framework designed for managing Semantic Overlays and Semantic Data.

Grégoire Burel, Amparo E. Cano and Vitaveska Lanfranchi

Page 5: Sparks O3 Browser: Augmenting the Web with Semantic Overlays

Sparks

• Functionalities:– Semantic Data management:

– Client/Server Triple Synchronization and Manipulation.– RDFa Parser /SPARQL Processor / “Client-Side” Triple Store (rdfquery). – Support for JSON/JSONP SPARQL Endpoints.

– Semantic Data Presentation and Interaction:– Unobtrusive JavaScript. – Interaction Patterns.– Graphical Libraries (SVG/VML via Raphael, YUI).

A JavaScript Framework designed for managing Semantic Overlays and Semantic Data.

Grégoire Burel, Amparo E. Cano and Vitaveska Lanfranchi

Page 6: Sparks O3 Browser: Augmenting the Web with Semantic Overlays

Sparks

• Functionalities:– Semantic Data management:

– Client/Server Triple Synchronization and Manipulation.– RDFa Parser /SPARQL Processor / “Client-Side” Triple Store (rdfquery). ✓– Support for JSON/JSONP SPARQL Endpoints. ✓

– Semantic Data Presentation and Interaction:– Unobtrusive JavaScript. ✓– Interaction Patterns.– Graphical Libraries (SVG/VML via Raphael, YUI). ✓

A JavaScript Framework designed for managing Semantic Overlays and Semantic Data.

Grégoire Burel, Amparo E. Cano and Vitaveska Lanfranchi

Page 7: Sparks O3 Browser: Augmenting the Web with Semantic Overlays

Sparks 03 BrowserA JavaScript Framework designed for managing A JavaScript Semantics.

• Highlights:- Bookmarklet + Semantic Overlay.- Dynamic Visualization Plug-ins (Twitter, GeoEvents…).- Visualization of the related concepts.- “Developer view” (triples view, SPARQL queries).

Bringing the contextual knowledge into a document and improving its perception/understanding.

A JavaScript tool that uses the semantics embedded in Web documents for improving the understanding of a document

by a user.

Grégoire Burel, Amparo E. Cano and Vitaveska Lanfranchi

Page 8: Sparks O3 Browser: Augmenting the Web with Semantic Overlays

Sparks 03 BrowserA JavaScript Framework designed for managing A JavaScript Semantics.

• Highlights:- Bookmarklet + Semantic Overlay.- Dynamic Visualization Plug-ins (Twitter, GeoEvents…).- Visualization of the related concepts.- “Developer view” (triples view, SPARQL queries).

Bringing the contextual knowledge into a document and improving its perception/understanding.

A JavaScript tool that uses the semantics embedded in Web documents for improving the understanding of a document

by a user.

Grégoire Burel, Amparo E. Cano and Vitaveska Lanfranchi

Page 9: Sparks O3 Browser: Augmenting the Web with Semantic Overlays

Sparks 03 Browser

Grégoire Burel, Amparo E. Cano and Vitaveska Lanfranchi

Page 10: Sparks O3 Browser: Augmenting the Web with Semantic Overlays

Demo / QuestionsSparks O3 Browser

Augmenting the Web with Semantic Overlays

Grégoire Burel1, Amparo E. Cano1 and Vitaveska Lanfranchi1

1OAK Group, Department of Computer Science, University of Sheffield

{G.Burel, A.Cano,V.Lanfranchi}@dcs.shef.ac.uk

Web Page / Code to be released soon:http://oak.dcs.shef.ac.uk/sparks/

Grégoire Burel, Amparo E. Cano and Vitaveska Lanfranchi