Interaction Design for the Semantic Web Lynda Hardman http://www.cwi.nl/~lynda/courses/usi08/ CWI, Interactive Information Access UvA, Institute for Informatics Presentation of Google results: text 2 1
Presentation of Google results: image 3 4 2
One size doesn t fit all 5 Reflection on development of different media types Image Text Audio Video 6 3
We had images Cave Chauvet-Pont-D Arc Jean Clottes 7 8 4
And then we developed text Dead Sea scrolls Newspapers 9 Recording sound Thomas Edison Phonograph, 1877 http://www.firstsounds.org/sounds/scott.php 10 5
Visual (moving images) 11 Visual (moving images) 12 6
Media types are flourishing Personal computers spreadsheet word processor Web browser Google link-based search algorithms Web 2.0 blogs facebook (linked data) 13 Why can t we design new technology? users unable to see beyond current technology technologists busy developing incremental, complex technology new technology enables new/unpredictable functionality don t know how to talk users about their real needs interface designers new solutions close to existing solutions (new media) artists random exploration of interaction space driven by novel/creative but not useful 14 7
The Problem The semantic web is new technology and is developing rapidly We don t know how users want to use it We don t know how to combine pieces of media and knowledge to help users 15 The Context Web open and linked is with us now Semantic Web open and richly linked is under development particularly for machine processing User s information seeking task 16 8
Interaction Design for the SW Long term goal to find and present information to end-users In a way that is useful to them You understand interfaces and how to design them by hand. How can machines help us with the details? We can capture semantics about information design for re-use. Not there yet. We can use information sources available on the SW and make them available to end-users. That s what much of this week is about. Then we need to deal with: Selecting a sub-set (semantic search) Grouping and ordering (linking to extra) for presentation. (Start with "data" based structuring and move to discourse based.) New search functionality beyond fact-finding And then we need to understand what good new interfaces are. Evaluating an existing interface is relatively easy 17 Overview of topics Dependencies in multimedia design Semantics for improving interaction NewsML 2.0: semantics of news media assets Vox Populi: creating argument structure with video fragments 18 9
19 Three ingredients Content 20 10
Content of example Clair-obscur (Frans) en chiaroscuro (Italiaans) betekenen 'licht-donker'. Beide termen worden gebruikt om sterke licht-donkercontrasten in schilderijen, tekeningen en prenten aan te duiden. Hoewel het effect al eerder werd toegepast, is de term pas sinds het einde van de 16de eeuw in zwang. De oorsprong van het woord ligt in Italië. De schilder Caravaggio (1573-1610) maakte het chiaroscuroeffect tot zijn handelsmerk. Hij was een meester in het schilderen van donkere taferelen met één felle lichtbundel. 21 Three ingredients Presentation structure Content 22 11
Presentation structure of example Chiaroscuro & Rembrandt Harmensz. Van Rijn title description examples Clair-obscur (Frans) en chiaroscuro (Italiaans) betekenen 'licht-donker'. Beide termen worden gebruikt om sterke licht-donkercontrasten in schilderijen, tekeningen en prenten aan te duiden. Hoewel het effect al eerder werd toegepast, is de term pas sinds het einde van de 16de eeuw in zwang. De oorsprong van het woord ligt in Italië. De schilder Caravaggio (1573-1610) maakte het chiaroscuroeffect tot zijn handelsmerk. Hij was een meester in het schilderen van donkere taferelen met één felle lichtbundel. 23 Three ingredients Presentation structure Aesthetics abcdefghij abcdefghijklmn ABCDEFGHIJK abcdefghijklm abcdefghijklm Content 24 12
Aesthetics of example Fonts Layout Colours 25 Design dependencies Presentation structure Aesthetics abcdefghij abcdefghijk ABCDEFGHIJK abcdefghijk abcdefghijk Content 26 13
Presentation Structure depends on Layout title title description description title title description examples description examples 27 Style Depends on Content Chiaroscuro & Rembrandt Chiaroscuro & Rembrandt The Stone Bridge (1638) The Stone Bridge (1638) 28 14
Presentation structure depends on content chiaroscuro Caravaggists 1623 1631 1628 1628 Rembrandt 1638 29 Example Presentation Structure Chiaroscuro Caravaggists Rembrandt 1623 1628 1628 1631 1638 30 15
Different presentation styles Large amount of information High interaction 31 32 16
33 34 17
35 36 18
Different presentation styles Entertainment rather than information Low interaction 37 38 19
39 40 20
41 Flexible interfaces to MM on SW Creating multimedia presentations requires understanding the message of the presentation knowing specifications of use context taking design dependencies into account The SW can help by making domain and design knowledge explicit deploying rules that use this knowledge to generate richly annotated hyper/multimedia presentations 42 21