eswc2011 summer school: front-end to the semantic web

105
“interface is the message” on the path to a usable & personal Semantic Web Lora Aroyo VU University Amsterdam @laroyo 1 Wednesday, June 1, 2011

Upload: lora-aroyo

Post on 27-Jan-2015

104 views

Category:

Technology


0 download

DESCRIPTION

This talk was given by Lora Aroyo at the ESWC2011 Summer School

TRANSCRIPT

Page 1: ESWC2011 Summer School: Front-end to the Semantic Web

“interface is the message”

on the path to a usable & personal Semantic Web

Lora AroyoVU University Amsterdam

@laroyo

1Wednesday, June 1, 2011

Page 2: ESWC2011 Summer School: Front-end to the Semantic Web

front-end to semantics: how do we interact with SemWeb Apps?

personalization: what do we need to adapt to users?

example applications: what good & bad is out there?

evaluation: why is continuous evaluation so important?

outline

2Wednesday, June 1, 2011

Page 3: ESWC2011 Summer School: Front-end to the Semantic Web

invisible computers

multitude of interaction modes

context-sensitive apps

networked devices: bridges between virtual & physical worlds

GUI become central

constantly increasing competition

why interfaces?

3Wednesday, June 1, 2011

Page 4: ESWC2011 Summer School: Front-end to the Semantic Web

combine content semantics with user context

integrate seamlessly physical & web worlds

identify relevance to user to rank & select information to present

continuous feedback cycle: to and from user

you need to deal with GUI on configuration level

perform continuous user testing

use real world data

take home message

4Wednesday, June 1, 2011

Page 5: ESWC2011 Summer School: Front-end to the Semantic Web

“interface is the message”

Aaron Koblin: Artfully visualizing our humanity, TED Talk, 2011

5Wednesday, June 1, 2011

Page 6: ESWC2011 Summer School: Front-end to the Semantic Web

FRONT-END TO SEMANTICShow do we interact with the SemWeb Apps?

6Wednesday, June 1, 2011

Page 7: ESWC2011 Summer School: Front-end to the Semantic Web

do SemWeb apps really differ?

7Wednesday, June 1, 2011

Page 8: ESWC2011 Summer School: Front-end to the Semantic Web

explicit semantics (often from open sources, e.g. LOD) used for system decisions and results

use facetted presentation, searching and browsing of information

use typically classifications, typologies or other structures of concepts

integrate data from different sources

aggregate data

semantics: what’s special?

8Wednesday, June 1, 2011

Page 9: ESWC2011 Summer School: Front-end to the Semantic Web

credits: Dan Brickley

9Wednesday, June 1, 2011

Page 10: ESWC2011 Summer School: Front-end to the Semantic Web

RDF data

10Wednesday, June 1, 2011

Page 11: ESWC2011 Summer School: Front-end to the Semantic Web

interaction with semantics

11Wednesday, June 1, 2011

Page 12: ESWC2011 Summer School: Front-end to the Semantic Web

©  BBC  MMVIIIhttp://twitpic.com/il1w/full

12Wednesday, June 1, 2011

Page 13: ESWC2011 Summer School: Front-end to the Semantic Web

http://www.bbc.co.uk/programmes/b00c06n2.rdf

13Wednesday, June 1, 2011

Page 14: ESWC2011 Summer School: Front-end to the Semantic Web

converting vocabularies

14Wednesday, June 1, 2011

Page 15: ESWC2011 Summer School: Front-end to the Semantic Web

PERSONALIZATIONwhat do we need to adapt to us?

15Wednesday, June 1, 2011

Page 16: ESWC2011 Summer School: Front-end to the Semantic Web

when we consider interaction & interfaces, then the user plays a key role

for good interface design, a good characterization of the user is needed

first, some concept from theory and literature

the user matters

16Wednesday, June 1, 2011

Page 17: ESWC2011 Summer School: Front-end to the Semantic Web

Definition: A ‘user profile’ is a data structure that represents a characterization of a user (u) at a particular moment of time (t)

So, a user profile represents what (from a given (system) perspective) there is to know about a user.The data in a user profile can be explicitly given by the user or have been derived.

user profile

17Wednesday, June 1, 2011

Page 18: ESWC2011 Summer School: Front-end to the Semantic Web

Personal dataFriend and relationsExperienceSystem accessBrowsing historyKnowledge (learning)Device dataLocation dataPreferences

user characteristics

18Wednesday, June 1, 2011

Page 19: ESWC2011 Summer School: Front-end to the Semantic Web

Definition: The ‘user model’ contains the definitions and rules for the interpretation of observations about the user and about the translation of that interpretation into the characteristics in a user profile.

So, a user model is the recipe for obtaining and interpreting user profiles.

user model

19Wednesday, June 1, 2011

Page 20: ESWC2011 Summer School: Front-end to the Semantic Web

Definition: ‘user modeling’ is the process of creating user profiles following the definitions and rules of the user model. This includes the derivation of new user profile characteristics from observations about the user and the old user profile based on the user model.

So, user modeling is the process of representing the user.

user modeling

20Wednesday, June 1, 2011

Page 21: ESWC2011 Summer School: Front-end to the Semantic Web

Stereotyping is one example of user modeling.

A user is considered to be part of a group of similar people, the stereotype.

Question: What could be stereotypes for conference participants (when we design the conference website)?

stereotyping

21Wednesday, June 1, 2011

Page 22: ESWC2011 Summer School: Front-end to the Semantic Web

Definition: A ‘user-adaptive system’ is a system that adapts itself to a specific user.

Often, a user-adaptive system (or adaptive system, in short) uses user profiles to base its adaptation on.So, designing an adaptive system implies designing the user modeling.

user-adaptive system

22Wednesday, June 1, 2011

Page 23: ESWC2011 Summer School: Front-end to the Semantic Web

User-adaptation is often used for personalization, i.e. making a system appear to function in a personalized way.

Question: What user profile characteristics would be useful in personalizing the conference’s registration site?Question: How would you obtain those characteristics?

user adaptation

23Wednesday, June 1, 2011

Page 24: ESWC2011 Summer School: Front-end to the Semantic Web

Device-dependenceAccessibility (disabilities)Location-dependenceAdaptive workflow

Question: Can you give concrete examples for interface adaptation, both the adaptation effect as the prior user modeling necessary?

examples: user adaptation

24Wednesday, June 1, 2011

Page 25: ESWC2011 Summer School: Front-end to the Semantic Web

Well-studied example of adaptation is ‘adaptive hypermedia’: a hypertext’s content and navigation are then adapted to the user’s browsing of the hypertext.

adaptive hypermedia

25Wednesday, June 1, 2011

Page 26: ESWC2011 Summer School: Front-end to the Semantic Web

DESIGNING INTERFACES

26Wednesday, June 1, 2011

Page 27: ESWC2011 Summer School: Front-end to the Semantic Web

Be cooperativeBe informativeBe truthfulBe relevantBe perspicuous (be clear)

dialog principles [Grice]

27Wednesday, June 1, 2011

Page 28: ESWC2011 Summer School: Front-end to the Semantic Web

Strive for consistencyEnable frequent users to use shortcutsOffer informative feedbackDesign dialog to yield closureOffer simple error handlingPermit easy reversal of actionsSupport internal locus of controlReduce short-term memory load

UI principles [Shneidermann]

28Wednesday, June 1, 2011

Page 29: ESWC2011 Summer School: Front-end to the Semantic Web

Visibility of system statusMatch between system and real worldUser control and freedomConsistency and standardsError preventionRecognition rather than recallFlexibility and efficiency of useAesthetic and minimalist designHelp users recognize, diagnose and recover from errorsHelp and documentation

usability heuristics [Nielsen]

29Wednesday, June 1, 2011

Page 30: ESWC2011 Summer School: Front-end to the Semantic Web

modeling the user: what are user’s preferences, interests, history, activities, etc.

modeling the user’s context: e.g. location, time, device

which of all the data available is relevant for this user in this context

also called context-aware

all about the user’s perspective

30Wednesday, June 1, 2011

Page 31: ESWC2011 Summer School: Front-end to the Semantic Web

switching between one context and another

doing things not only for him/herself, e.g. buying present for a girlfriend

user’s context distributed

31Wednesday, June 1, 2011

Page 32: ESWC2011 Summer School: Front-end to the Semantic Web

PERSONALIZED INTERACTIONs

32Wednesday, June 1, 2011

Page 33: ESWC2011 Summer School: Front-end to the Semantic Web

search, e.g. keyword, faceted

browse, story lines, narratives through collections

annotations of multimedia, e.g. (collaborative) tagging, professional annotation of text, images and video, tagging games

explanations, hints, user feedback, e.g. explanation of recommendation results, explanation of autocompletion suggestions

interaction modes

33Wednesday, June 1, 2011

Page 34: ESWC2011 Summer School: Front-end to the Semantic Web

recommendation systems, e.g. movies, music, art

user statistics and analysis, e.g. user usage data, profile, group profiles, etc.

social networking

typical examples

34Wednesday, June 1, 2011

Page 35: ESWC2011 Summer School: Front-end to the Semantic Web

Definition: A ‘recommender system’ is a system that recommends to a user, based on her individual interests, items that the user could find interesting.

Examples: music, movies, people, restaurantsTypes: collaborative (reason about similar users), content-based (reason about similar items)Problems: new users, new items, sparsity, gray sheep

recommender systems

35Wednesday, June 1, 2011

Page 36: ESWC2011 Summer School: Front-end to the Semantic Web

movies & TV programs, e.g. Netflix, MovieLens, TiVo, personalized TV guides

music, e.g. LastFM, Pandora, iTunes Genius

food & tourism, e.g. guides adapted to location, current time, preferences

news, e.g. Google reader, news filters

e-shopping, e.g. Amazon’s recommendations

advertisement, e.g. Facebook personalized ads

art, museums, e.g. personalized search, personalized museum guides

recommender systems

36Wednesday, June 1, 2011

Page 37: ESWC2011 Summer School: Front-end to the Semantic Web

Collection of activities/context/attention data

Derive interests from this data

Recommender-specific problems, e.g. cold start, over-specialization

Surface items of interest in the ‘long tail’

Cross-domain recommendations

Multi-person recommending

Granular control for users

considerations

37Wednesday, June 1, 2011

Page 38: ESWC2011 Summer School: Front-end to the Semantic Web

overview of user preferences, e.g. settings, privacy

overview of user interests, e.g. ranking of interests, links to content

overview of user/group activities, e.g. per topics, per activity, per date, over a period, overall

comparative views between users, e.g. LastFM, livingSocial movies user similarity, Twitter similar users to you

different views/visualization over the same set of user data

user profiles & stats

38Wednesday, June 1, 2011

Page 39: ESWC2011 Summer School: Front-end to the Semantic Web

39Wednesday, June 1, 2011

Page 40: ESWC2011 Summer School: Front-end to the Semantic Web

40Wednesday, June 1, 2011

Page 41: ESWC2011 Summer School: Front-end to the Semantic Web

professional networks & events, e.g. LinkedIn, Mendeley

people, organizations, e.g. Facebook, MySpace

Twitter

social bookmarking, e.g. Delicious, StumbleUpon, Diggit

GetGlue

Books, e.g. LibabryThing

social networking

41Wednesday, June 1, 2011

Page 42: ESWC2011 Summer School: Front-end to the Semantic Web

EXAMPLE APPLICATIONSInterfaces & Personalization on SemWeb

42Wednesday, June 1, 2011

Page 43: ESWC2011 Summer School: Front-end to the Semantic Web

the big guys

43Wednesday, June 1, 2011

Page 44: ESWC2011 Summer School: Front-end to the Semantic Web

44Wednesday, June 1, 2011

Page 45: ESWC2011 Summer School: Front-end to the Semantic Web

45Wednesday, June 1, 2011

Page 46: ESWC2011 Summer School: Front-end to the Semantic Web

46Wednesday, June 1, 2011

Page 47: ESWC2011 Summer School: Front-end to the Semantic Web

47Wednesday, June 1, 2011

Page 48: ESWC2011 Summer School: Front-end to the Semantic Web

The Recommendation and Like plugins let users share any content they like back to their profile.

48Wednesday, June 1, 2011

Page 49: ESWC2011 Summer School: Front-end to the Semantic Web

The Activity Feed plugin shows users what their friends are doing on your site through likes and comments.

49Wednesday, June 1, 2011

Page 50: ESWC2011 Summer School: Front-end to the Semantic Web

50Wednesday, June 1, 2011

Page 51: ESWC2011 Summer School: Front-end to the Semantic Web

activity streams

http://xmlns.notu.be/aair/

51Wednesday, June 1, 2011

Page 52: ESWC2011 Summer School: Front-end to the Semantic Web

weighted interest

http://xmlns.notu.be/wi

52Wednesday, June 1, 2011

Page 53: ESWC2011 Summer School: Front-end to the Semantic Web

53Wednesday, June 1, 2011

Page 54: ESWC2011 Summer School: Front-end to the Semantic Web

EXAMPLE 1what do Gerrit Dou and Rembrandt have in common?

http://www.chip-project.org

54Wednesday, June 1, 2011

Page 55: ESWC2011 Summer School: Front-end to the Semantic Web

enriched Rijksmuseum collection

55Wednesday, June 1, 2011

Page 56: ESWC2011 Summer School: Front-end to the Semantic Web

style:  Baroque

teacher  of:  Gerrit  Dou

teacher  of:  Nicolaes  Maes

teacher  of:  Ferdinand  Bol  

self-­‐portrait

mili<a

place:  Amsterdam,  

1625  to  1650

56Wednesday, June 1, 2011

Page 57: ESWC2011 Summer School: Front-end to the Semantic Web

goal & central role of UM

57Wednesday, June 1, 2011

Page 58: ESWC2011 Summer School: Front-end to the Semantic Web

Personalized  Web  Access Online  Tour  Wizard

personalized experiencePersonalized  Mobile  Tour

Interactive user modeling

Recommendations of artworks & art topics

Semantic Search

Museum tour maps

Historic timeline

Interactive tours

On-the-fly adaptation

Synchronized user profile

58Wednesday, June 1, 2011

Page 59: ESWC2011 Summer School: Front-end to the Semantic Web

semantic recommendations

59Wednesday, June 1, 2011

Page 60: ESWC2011 Summer School: Front-end to the Semantic Web

semantic recommendations

60Wednesday, June 1, 2011

Page 61: ESWC2011 Summer School: Front-end to the Semantic Web

semantic recommendations

60Wednesday, June 1, 2011

Page 62: ESWC2011 Summer School: Front-end to the Semantic Web

semantic recommendations

61Wednesday, June 1, 2011

Page 63: ESWC2011 Summer School: Front-end to the Semantic Web

semantic recommendations

61Wednesday, June 1, 2011

Page 64: ESWC2011 Summer School: Front-end to the Semantic Web

personalized tours

62Wednesday, June 1, 2011

Page 65: ESWC2011 Summer School: Front-end to the Semantic Web

personalized tours

62Wednesday, June 1, 2011

Page 66: ESWC2011 Summer School: Front-end to the Semantic Web

Interactive Museum Guide

h"p://chip-­‐project.org  63Wednesday, June 1, 2011

Page 67: ESWC2011 Summer School: Front-end to the Semantic Web

Interactive Museum Guide

64Wednesday, June 1, 2011

Page 68: ESWC2011 Summer School: Front-end to the Semantic Web

event-based browsing

65Wednesday, June 1, 2011

Page 69: ESWC2011 Summer School: Front-end to the Semantic Web

dynamic adaptationFor each artwork in the museum:

Related works

Include in the tour ( & recalculate the map/tour)

Indicate relevance in terms of e.g. personal interest, position, recommended by friends, by Rijks, on view

Rate to indicate interest

At any point of the tour:

Include/exclude artworks

Adjust tour length

Change navigation in and outside of the tour

Save for other tours

66Wednesday, June 1, 2011

Page 70: ESWC2011 Summer School: Front-end to the Semantic Web

EXAMPLE 2professionals vs. lay users on Web 2.0

semantic annotation of Rijksmuseum printshttp://e-culture.multimedian.nl/pk/annotate?

semantic tagging: http://waisda.nl

67Wednesday, June 1, 2011

Page 71: ESWC2011 Summer School: Front-end to the Semantic Web

Autocompletion with multiple vocabularies

http://slashfacet.semanticweb.org/autocomplete/demos/

http://slashfacet.semanticweb.org/wordnet/search

68Wednesday, June 1, 2011

Page 72: ESWC2011 Summer School: Front-end to the Semantic Web

69Wednesday, June 1, 2011

Page 73: ESWC2011 Summer School: Front-end to the Semantic Web

70Wednesday, June 1, 2011

Page 74: ESWC2011 Summer School: Front-end to the Semantic Web

70Wednesday, June 1, 2011

Page 75: ESWC2011 Summer School: Front-end to the Semantic Web

71Wednesday, June 1, 2011

Page 76: ESWC2011 Summer School: Front-end to the Semantic Web

71Wednesday, June 1, 2011

Page 77: ESWC2011 Summer School: Front-end to the Semantic Web

72Wednesday, June 1, 2011

Page 78: ESWC2011 Summer School: Front-end to the Semantic Web

72Wednesday, June 1, 2011

Page 79: ESWC2011 Summer School: Front-end to the Semantic Web

EXAMPLE 3semantic television

http://notube.tv

73Wednesday, June 1, 2011

Page 80: ESWC2011 Summer School: Front-end to the Semantic Web

74Wednesday, June 1, 2011

Page 81: ESWC2011 Summer School: Front-end to the Semantic Web

75Wednesday, June 1, 2011

Page 82: ESWC2011 Summer School: Front-end to the Semantic Web

76Wednesday, June 1, 2011

Page 83: ESWC2011 Summer School: Front-end to the Semantic Web

77Wednesday, June 1, 2011

Page 84: ESWC2011 Summer School: Front-end to the Semantic Web

watching TV in a group

for more details check out our blog at http://notube.tv

78Wednesday, June 1, 2011

Page 85: ESWC2011 Summer School: Front-end to the Semantic Web

watching TV in a group

for more details check out our blog at http://notube.tv

79Wednesday, June 1, 2011

Page 86: ESWC2011 Summer School: Front-end to the Semantic Web

watching TV in a group

80Wednesday, June 1, 2011

Page 87: ESWC2011 Summer School: Front-end to the Semantic Web

watching TV in a groupEnvironment

Interact with the second screen as a group         Friend interaction at homeWatching as a group

SynchronizationTV & Second Screenbetween second screens                                       between second screens & TV show content provider

Age15 - 35 years old

Type of Activitiesquiz and betting gameschange camera viewinformation regarding the content of the program textual captions

Type of ProgramSports

81Wednesday, June 1, 2011

Page 88: ESWC2011 Summer School: Front-end to the Semantic Web

observations

for more details check out our blog at http://notube.tv

82Wednesday, June 1, 2011

Page 89: ESWC2011 Summer School: Front-end to the Semantic Web

observations

for more details check out our blog at http://notube.tv

83Wednesday, June 1, 2011

Page 90: ESWC2011 Summer School: Front-end to the Semantic Web

second screen & TV functionalities

shared virtual space voice dubbing subtitles related information quizzes voting & bettingscene-grab & share social interaction live-chat parental advisory uncensored version different camera views

synchronization with second screen“overlay” on top of the main TV-picturecensoringdifferent camera viewsgroup alerts

84Wednesday, June 1, 2011

Page 91: ESWC2011 Summer School: Front-end to the Semantic Web

CONTINUOUS EVALUATION

85Wednesday, June 1, 2011

Page 92: ESWC2011 Summer School: Front-end to the Semantic Web

Target users’ characteristics

small groups with 2-4 persons and a male taking the leading role (67%)

middle-aged people in 30-60 years old (75%)

higher-educated (62%)

no prior knowledge about the Rijksmuseum collection (62%)

visit the museum for education (98%)

CHIP users

86Wednesday, June 1, 2011

Page 93: ESWC2011 Summer School: Front-end to the Semantic Web

87Wednesday, June 1, 2011

Page 94: ESWC2011 Summer School: Front-end to the Semantic Web

Define familiarity with the domain

Define familiarity with collections/vocabularies

Identify use cases

Identify navigation patterns

Identify requirements for user groups

Validate

Contextual observations

User interviews

Model user’s tasks

contextual analysis

88Wednesday, June 1, 2011

Page 95: ESWC2011 Summer School: Front-end to the Semantic Web

domain exploration

89Wednesday, June 1, 2011

Page 96: ESWC2011 Summer School: Front-end to the Semantic Web

usability testing

90Wednesday, June 1, 2011

Page 97: ESWC2011 Summer School: Front-end to the Semantic Web

91Wednesday, June 1, 2011

Page 98: ESWC2011 Summer School: Front-end to the Semantic Web

91Wednesday, June 1, 2011

Page 99: ESWC2011 Summer School: Front-end to the Semantic Web

92Wednesday, June 1, 2011

Page 100: ESWC2011 Summer School: Front-end to the Semantic Web

93Wednesday, June 1, 2011

Page 101: ESWC2011 Summer School: Front-end to the Semantic Web

results

94Wednesday, June 1, 2011

Page 102: ESWC2011 Summer School: Front-end to the Semantic Web

95Wednesday, June 1, 2011

Page 103: ESWC2011 Summer School: Front-end to the Semantic Web

95Wednesday, June 1, 2011

Page 104: ESWC2011 Summer School: Front-end to the Semantic Web

http://www.cs.vu.nl/intertain/

96Wednesday, June 1, 2011

Page 105: ESWC2011 Summer School: Front-end to the Semantic Web

combine content semantics with user context

integrate seamlessly physical & web worlds

identify relevance to user to rank & select information to present

continuous feedback cycle: to and from user

you need to deal with GUI on configuration level

perform continuous user testing

use real world data

take home message

97Wednesday, June 1, 2011