Folien zur Demo von mediaglobe auf dem Workshop "Interaktion und Visualisierung im Daten-Web" (IVDW 2011), auf der INFORMATIK 2011, 6. Oktober 2011, TU Berlin.

1. Sneak Preview?
Wie man sofort weiß, was einen
bei facettierter Videosuche erwartet
Instantly Know What To Expect In Faceted Video Searching
Johannes Osterhoff, Jörg Waitelonis,
Joscha Jäger und Harald Sack
Interaktion und Visualisierung im Daten-Web (IVDW),
Workshop im Rahmen der INFORMATIK 2011,
6. Oktober 2011 in Berlin

2. — Das HPI wurde im Oktober 1998 im Rahmen
einer Public-Private-Partnerschaft gegründet
— Forschung und Lehre am HPI ist dem
„IT Systems Engineering“ gewidmet
— 10 Professoren und ca. 100 Mitarbeiter
in Forschung und Lehre
— aktuell 450 Studenten in universitären
Studiengängen „IT Systems Engineering“
— CHE-Ranking 2010 sieht HPI auf Top-Rang
IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

3. Forschungsgruppe „Semantic Web“
— Forschungsgruppe von Dr. Harald Sack
— Themen:
— Semantic Web Technologies
— Information Retrieval
— Multimedia Analysis & Retrieval
— Social Networking
— Data/Information Visualization
— Forschungsprojekte:
„Der einzige D
esigner (FH)
am HPI“
3 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

4. 1 — mediaglobe
2 — Facettierte Suche
3 — Interface Design
4 — Demo
5 — Zusammenfassung

5. mediaglobe
— Das Projekt mediaglobe begleitet Medienarchive in die
digitale Zukunft.
— Ziele:
— den wachsenden Bestand der audiovisuellen
Dokumente zur Zeitgeschichte digital auffindbar
und nutzbar zu machen.
— web-basierter Zugang zu umfassenden digitalen
AV-Inhalten in Medienarchiven.
— Automatisierte Verfahren zur Analyse von
audiovisuellen Daten.
— Der Einsatz semantischer Technologien verbessert
die Ergebnisse der Multimedia-Suche.
— Laufzeit des Projekts: zweieinhalb Jahre
Projektpartner:
5 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

6. mediaglobe
Ein erster Blick …
Fischerei Rostock
Angela Merkel Japan Chile Alaska
Admiral Bildung Bundesrepublik
Produktion Weltwirtschaftskrise
6 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

7. 1 — mediaglobe
2 — Facettierte Suche
3 — Interface Design
4 — Demo
5 — Zusammenfassung

8. Def. Facettierte Suche
Facettierte Suche
ermöglicht das
inhaltsbasierte Filtern
extrem großer
Ergebnismengen.
Meist erfolgt eine Aktualisierung der Ergebnismenge
nach Klick auf einen Link (mit Zahl)
8 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

9. Facettierte Suche
Beispiele
Ein populärer
Online-
Buchhändler
IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

10. Facettierte Suche
Beispiele
Ein populärer
Online-
Buchhändler
IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

11. Facettierte Suche
Beispiele
Ein populärer
Online-
Buchhändler
IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

12. Facettierte Suche
Beispiele
Flamenco
Search
Interface
Marti Hearst
et al.
2002
IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011 http://orange.sims.berkeley.edu/cgi-bin/flamenco.cgi/famuseum/Flamenco

13. Facettierte Suche
Beispiele
Flamenco
Search
Interface
Marti Hearst
et al.
2002
IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011 http://orange.sims.berkeley.edu/cgi-bin/flamenco.cgi/famuseum/Flamenco

14. Facettierte Suche
Beispiele Semaplorer Schenk, Saathoff, Staab, Scherp 2009
IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011 http://vimeo.com/2057249 http://btc.isweb.uni-koblenz.de/

15. Facettierte Suche
Beispiele Semaplorer Schenk, Saathoff, Staab, Scherp 2009
IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011 http://vimeo.com/2057249 http://btc.isweb.uni-koblenz.de/

16. Facettierte Suche
Beispiele
Exhibit
Framework
U.S. Presidents
Example
David
Karger et al.
2007
IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011 http://www.simile-widgets.org/exhibit/examples/presidents/presidents.html

17. Facettierte Suche
Beispiele
Exhibit
Framework
U.S. Presidents
Example
David
Karger et al.
2007
IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011 http://www.simile-widgets.org/exhibit/examples/presidents/presidents.html

18. Facet Link (2342)

20. Another Facet Link (523)

22. And Another Facet Link (42)

24. Eigentlich möchte man …
… den Ergebnisraum
der bisherigen Suche nicht
verlassen, ohne mehrere
Möglichkeiten zu kennen.
24 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

25. Eigentlich fragt man sich:
„Wie verändert sich
meine Ergebnismenge
nach dem Klick?“
25 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

26. Eigentlich möchte man …
… einen ersten Einblick in
die dargestellten Medien.
… einen Überblick über den
gesamten Datenbestand.
26 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

27. Und natürlich möchte man …
… nicht warten.…
27 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

28. Prominenter Such-Anbieter

29. Prominenter Such-Anbieter

30. 1 — mediaglobe
2 — Facettierte Suche
3 — Interface Design
4 — Demo
5 — Zusammenfassung

31. Interface Design
Anforderungen
Bei der Auswahl eine Facette möchte
man den Ergebnisraum in die
richtige Richtung einschränken.
Dadurch: größere Auswahl, größere
Sicherheit, keine Fehlversuche.
31 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

32. Interface Design
Anforderungen
Der Benutzer soll
einen visuellen
Überblick über die
Suchergebnisse
erhalten, der über
die ten blue links
hinausgeht.
32 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

33. Interface Design
Anforderungen
Das …
33 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

34. Interface Design
Anforderungen
Das … Paradigma …
34 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

35. Interface Design
Anforderungen
Das … Paradigma … der …
35 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

36. Interface Design
Anforderungen
Das … Paradigma … der …
nacheinander …
36 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

37. Interface Design
Anforderungen
Das … Paradigma … der …
nacheinander … geladenen …
37 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

38. Interface Design
Anforderungen
Das … Paradigma … der …
nacheinander … geladenen …
Seiten …
38 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

39. Interface Design
Anforderungen
Das … Paradigma … der …
nacheinander … geladenen …
Seiten … soll …
39 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

40. Interface Design
Anforderungen
Das … Paradigma … der …
nacheinander … geladenen …
Seiten … soll … für …
40 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

41. Interface Design
Anforderungen
Das … Paradigma … der …
nacheinander … geladenen …
Seiten … soll … für … ein …
41 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

42. Interface Design
Anforderungen
Das … Paradigma … der …
nacheinander … geladenen …
Seiten … soll … für … ein …
leichtgängiges …
42 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

43. Interface Design
Anforderungen
Das … Paradigma … der …
nacheinander … geladenen …
Seiten … soll … für … ein …
leichtgängiges … Filtern …
43 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

44. Interface Design
Anforderungen
Das … Paradigma … der …
nacheinander … geladenen …
Seiten … soll … für … ein …
leichtgängiges … Filtern … der …
44 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

45. Interface Design
Anforderungen
Das … Paradigma … der …
nacheinander … geladenen …
Seiten … soll … für … ein …
leichtgängiges … Filtern … der …
Suchergebnisse …
45 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

46. Interface Design
Anforderungen
Das … Paradigma … der …
nacheinander … geladenen …
Seiten … soll … für … ein …
leichtgängiges … Filtern … der …
Suchergebnisse … aufgegeben …
46 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

47. Interface Design
Anforderungen
Das … Paradigma … der …
nacheinander … geladenen …
Seiten … soll … für … ein …
leichtgängiges … Filtern … der …
Suchergebnisse … aufgegeben …
werden …
47 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

48. Interface Design
Anforderungen
Das … Paradigma … der …
nacheinander … geladenen …
Seiten … soll … für … ein …
leichtgängiges … Filtern … der …
Suchergebnisse … aufgegeben …
werden … :)
48 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

49. Interface Design
Lösung
„Linking & Brushing“
Richard A. Becker and William S. Cleveland.
Brushing scatterplots. Technometrics, 29:127–142, May 1987.

50. Interface Design
Lösung

51. Interface Design
Lösung

52. Interface Design
Lösung
„Linking & Brushing“
ermöglicht den mehrstufiger
Prozess einer wirklichen
explorativen Suche – und
macht sie leichtgängig.

53. Interface Design
Folgen
Sofortiges visuelles
Feedback, wie eine
ausgewählte Facette
die Ergebnismenge
beeinflussen wird.
53 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

54. Interface Design
Folgen
Der Suchvorgang wird
schneller und präziser
im Vergleich zu anderen
Systemen, die nach jeder
Facettierung eine neue
Suche auslösen.
54 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

55. Interface Design
Folgen
Das System reagiert
sofort auf den Input des
Benutzers – es
kommt zu keinem Bruch
des Suchkontexts.
55 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

56. Interface Design
Die einzelnen Elemente
Fischerei Rostock
Angela Merkel Japan Chile Alaska
Admiral Bildung Bundesrepublik
Produktion Weltwirtschaftskrise
56 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

57. Interface Design
Elemente
Fischerei Rostock
Sucheingabe mit
Angela Merkel Japan Chile Alaska
Disambiguierung
Admiral Bildung Bundesrepublik
Produktion Weltwirtschaftskrise
57 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

58. Interface Design
Elemente
Fischerei Rostock
Sucheingabe mit
Angela Merkel Japan Chile Alaska
Disambiguierung
Admiral Bildung Bundesrepublik
Produktion Weltwirtschaftskrise
Vorschläge mit
Entitäten
Facettenfilter
58 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

59. Interface Design
Elemente Bestätigte
Facetten
Fischerei Rostock
Sucheingabe mit
Angela Merkel Japan Chile Alaska
Disambiguierung
Suchergebnisse
Admiral Bildung Bundesrepublik
Produktion Weltwirtschaftskrise
Vorschläge mit
Entitäten
Facettenfilter
Visuelle Paginierung
59 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

60. Interface Design
Verschränkung mit Link & Brush
Fischerei Rostock
Angela Merkel Japan Chile Alaska
Suchergebnisse
Admiral Bildung Bundesrepublik
Produktion Weltwirtschaftskrise
Facettenfilter
Visuelle Paginierung
60 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

61. Interface Design
Verschränkung mit Link & Brush
Fischerei Rostock
Angela Merkel Japan Chile Alaska
Suchergebnisse
Admiral Bildung Bundesrepublik
Produktion Weltwirtschaftskrise
Vorschläge mit
Entitäten
Visuelle Paginierung
61 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

62. 1 — mediaglobe
2 — Facettierte Suche
3 — Interface Design
4 — Demo
5 — Zusammenfassung

63. Demo.
http://www.mediaglobe.yovisto.com:8080/mggui-dev
Der Demonstrator ist aus rechtlichen Gründen
leider nicht öffentlich zugänglich.
Adresse des Screencasts: http://bit.ly/mediaglobe
63 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

64. 1 — mediaglobe
2 — Facettierte Suche
3 — Interface Design
4 — Demo
5 — Zusammenfassung

65. Zusammenfassung
„Linking & Brushing“
verbessert und vereinfacht
die facettierte Suche
65 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

66. Zusammenfassung
„Linking & Brushing“
verbessert und vereinfacht
die facettierte Suche bzgl.
— Ergebnisraum,
66 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

67. Zusammenfassung
„Linking & Brushing“
verbessert und vereinfacht
die facettierte Suche bzgl.
— Ergebnisraum,
— Geschwindindigkeit
67 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

68. Zusammenfassung
„Linking & Brushing“
verbessert und vereinfacht
die facettierte Suche bzgl.
— Ergebnisraum,
— Geschwindindigkeit
— Explorative Suche
68 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

69. Zusammenfassung
Future Work
Welche weiteren Interface-
Elemente können sinnvoll mit
„Linking & Brushing“
verbunden werden und wie?
69 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

70. Zusammenfassung
Future Work
Neben der schnellen
Vorschau wäre auch auch ein
mit „Linking & Brushing“
verschalteter Blick in die Videos
wünschenswert.
70 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011

71. Vielen Dank für Ihre Aufmerksamkeit!
Johannes P Osterhoff, M.A.
johannes.osterhoff at hpi.uni-potsdam dot de
Hasso-Plattner-Institut für Softwaresystemtechnik GmbH
Prof.-Dr.-Helmert-Str. 2-3 14482 Potsdam
johannes-p-osterhoff.com
71 IVDW @ Informatik 2011 | Johannes Osterhoff | 6. Oktober 2011