CC-BY

Annotation et lecture active

Olivier Aubert - www.olivieraubert.net
Cours INFO GCN - 29/11/2017

Plan du cours

  • Annotations - Cadre d'analyse
  • Mise en oeuvre - standards
  • Annotation de texte
  • Annotations de médias audiovisuels

Questions

  • qui prend des notes dans la marge des livres/articles qu'il lit ?
  • qui a déjà utilisé des outils (numériques ou non) d'annotation ?
  • qui a déjà essayé d'annoter un film ? une piste audio (soundcloud) ?

Historique

Marginalia

Annotation - une des fondations du travail intellectuel

marginalia.jpg

Page of the Codex Oxoniensis Clarkianus 39 (Clarke Plato). Dialogue Gorgias. Public Domain

Post-its

postit.jpg

CC Public Domain

Memex

Vannevar Bush As we may think (1945)

Associative trails: « This is the essential feature of the memex. The process of tying two items together is the important thing. »

memex.png

Image source: Hypothes.is Animated Intro CC-BY

Xanadu

Ted Nelson Complex information processing: a file structure for the complex, the changing and the indeterminate (1960)

  • "digital repository scheme for world-wide electronic publishing"
  • let the reader choose his own path through an electronic document
  • Liens bidirectionnels, provenance, gestion de versions…

WWW

WWW - proposition de Tim Berners Lee (1989)

NCSA Mosaic - fonctionnalité d'annotation (1993)

Anciens systèmes

Cadre d'analyse

Annotation et lecture active

Différentes dimensions de l'annotation

(Marshall 1998)

  • usage
  • informel/formel
    • du texte libre à l'ontologie
  • tacite/explicite
    • auto-suffisance, contexte
  • intensité (hyperextensif/extensif/intensif)
  • audience
  • durabilité (provisoire/permanent)

Dimensions de l'annotation - usage

(Marshall 1998)

  • commentaire
  • marquage de texte
  • trace de lecture
  • définition de liens
  • construction de chemin de lecture
  • décentrage d'autorité
  • interprétation (individuelle/collective)
  • mémoire communautaire

Dimensions de l'annotation - partage

  • personnel / groupe / institutionnel / global
  • enjeu de surcharge informationnelle - comment sélectionner le bon niveau de partage pour éviter la surcharge?
  • enjeu de qualification - comment sélectionner les annotations appropriées (niveau de confiance)?
  • enjeu de modération - comment/faut-il/peut-on modérer les annotations?

Contenus

  • Texte libre (approche exploratoire, lecture active…)
  • Contenu arbitraire (autres ressources) - image, texte, son…
  • Information sémantique (possiblement extraite), raisonnement

Structuration des annotations

Ajout d'une structuration supplémentaire des contenus dépendant de l'usage/des possibilités logicielles

  • Texte libre
  • Thesaurus
  • Taxonomie / Folksonomie
  • Ontologie

Origine des annotations

  • Manuelle
  • Extraction automatique (feature extraction, entity extraction)
  • Croisement de sources

Cycle de vie

Comment gérer la modification de la ressource?

  • robustesse des ancres
  • mécanisme de vérification

Comment gérer la disparition de la ressource?

Traces d'utilisation

  • Annotations implicites, témoins de l'activité sur le document
  • Source possible d'enrichissement des documents consultés

Enjeux éthiques/légaux

Mise en oeuvre des annotations

  • Modèles
  • Formats
  • Protocoles
  • Architecture

WebAnnotation working group

Annotation at W3C:

Modèle WebAnnotation

intro_model.png

Source

Formalisation RDF

annotation.png

Source

Ancrage

  • Annotation - type spécifique de métadonnée car ancrage intra-document
  • Multiplicité des formats
  • Enjeux
    • généricité
    • précision
    • robustesse

Les sélecteurs dans WebAnnotation

svgSelector.png

Ancrage textuel

(Auparavant TEI, RFC 5147…)

Ancrage image et audio/vidéo

Utilise la recommandation MediaFragment

fragmentSelector.png

MediaFragment

  • dimension temporelle #t=begin,end
t=10,20             # => results in the time interval [10,20)
t=npt:,121.5        # => results in the time interval [0,121.5)
t=0:02:00,121.5     # => results in the time interval [120,121.5)
t=npt:120,0:02:01.5 # => also results in the time interval [120,121.5)
  • dimension spatiale #xywh=x,y,w,h
xywh=160,120,320,240        # => results in a 320x240 box at x=160 and y=120
xywh=pixel:160,120,320,240  # => results in a 320x240 box at x=160 and y=120
xywh=percent:25,25,50,50    # => results in a 50%x50% box at x=25% and y=25%

Formats

TEI, AnnotationGraph, Annodex, MPEG7, OpenAnnotation

Serialisation WebAnnotation

JSON-LD: sérialisation standard JSON de données RDF

{ "@context": "http://www.w3.org/ns/anno.jsonld",
  "id": "http://example.org/anno20",
  "type": "Annotation",
  "body": "http://example.net/note1",
  "target": {
     "source": "http://example.com/page1.html",
     "selector": {
        "type": "CssSelector",
        "value": "#elemid > .elemclass + p"
     }
  }
}

Protocole

Protocole WebAnnotation basé sur la spécification LDP (Linked Data Platform)

  • API REST basée sur HTTP: GET / HEAD / OPTIONS / PUT / POST / DELETE
  • Conteneurs pour gérer les annotations
  • Gestion de la pagination

Architecture

  • Client-based: stockage en local
  • Server-based: contenus et annotations liées
  • Proxy-based: injection des annotations dans des contenus

Quelques exemples d'applications

Texte

Images

Video annotation

Définition WebAnnotation

annotation - information body (free text, constrained vocabulary, structured data, image, graphic…) linked to a target document through a selector

Sorry, your browser does not support SVG.

video annotation - selector = (spatio)temporal fragment of a video, defined by a MediaFragment URI

Diverses communautés pour l'annotation vidéo

sous-titrage
Amara - AegisSub

media studies
Advene - Mediascope - Lignes de Temps

musique
Travis, MusiqueLab

linguistique
Anvil - ELAN - Exmeralda - Transcriber

éthologie/étude comportementales
BORIS - VCode - Noldus/Observer - NVivo

pédagogie
COCoNotes - Travis-Go - Lacuna stories - Mediathread

annotations sociales
SoundCloud - Vialogues - TurboNote - Reclipped

traitement de l'image
vatic - LabelMe

sports
LongoMatch - Powerchalk - CoachLogic - SportsCode

Lecture active

Sorry, your browser does not support SVG.

Hypervidéo

hypervideo.png

Projet Advene

Annotate Digital Video, Exchange on the NEt

to be added to something or become a part of it, though inessential (Webster, 1913)

Créér, utiliser, échanger des analyses de documents audiovisuels sous forme d'hypervidéos

  • Lancé en 2002 avec Yannick Prié et P.A. Champin
  • Logiciel libre (GPL), application multi-plateformes.
  • www.advene.org

Anecdote

Mulholland Drive (2001) by David Lynch

  • Interprétations, discussions, indices…
  • Mais…
    • comment peut-on exprimer nos analyses ?
    • comment peut-on les valider ?
    • comment peut-on les partager ?

Besoin d'un logiciel approprié.

Motivation scientifique

  • Ingénierie des connaissances
  • Ingénierie documentaire
  • IHM
  • Visualisation
  • Analyse des usages
  • Traces d'activité

Principe

Sorry, your browser does not support SVG.

Interface

screenshot_advene.png

Fonctionnalités

  • Annotation de tout format vidéo (fichier, DVD, stream)
  • Structure et visualisations définies par l'utilisateur
  • Préservation des informations structurées autant que possible
  • Recueils (annotations, structure d'annotation, vues, requêtes) indépendants de la vidéo
  • Travail hors-ligne possible
  • Moddèle de données simple et générique
    • import/intégration de données externes
    • pas de contraintes fortes
  • Flexible et extensible (plugins)

Différents niveaux de flexibilité

  • Objectif: accompagner l'analyse exploratoire
  • Variété d'interfaces de création d'annotations
    • Annotation manuelle (avec assistants)
    • Import d'annotations générées
  • Flexibilité de la structure d'annotation
    • (Re)structuration dynamique
    • Autoriser (mais signaler) les données non-conformes
  • Flexibilité dans les visualisations d'annotations

Advene - Exemples d'applications

  • Analyse d'interview : Museographie
  • Enrichissement de conférence : Tim Berners Lee
  • Analyse filmique : Nosferatu, Il caso Mattei
  • Analyse d'expérimentation : eLabBench
  • Accessibilité

Exemple: Museographie

Objectif : étudier la perception des visiteurs de musée à travers l'analyse de leurs interviews

remind.jpg

  • visiteurs interviewés lors du rejeu de l'enregistrement subjectif de leur visite
  • 40+ vidéos annotées
  • publication en ligne des vues et des données
  • visualisations dédiées

Exemple: Museographie

Processus d'analyse

  • Transcrire l'interview
  • Identifier les signes hexadiques (issus du cours d'action)
  • Utiliser les relations pour exprimer les cours d'expérience
  • Générer des visualisations via des templates
  • Écrire les analyses
  • Publier en ligne

Exemple: Muséographie

Transcription

museographie1.png

Exemple: Muséographie

museographie2.png

Exemple: Muséographie

museographie3.png

Exemple: Muséographie

museographie4.png

Exemple: Muséographie

museographie5.png

Exemple: Muséographie

Structuration exploratoire
Publication des analyses en tant qu'hypervidéos

screenshot_museographie.png

Exemple: Tim Berners Lee TED talk enrichi

Visualisation - export sémantique

tbl_ted.png

Exemple: Nosferatu

Publication d'hypervidéo

screenshot_nosferatu.png

Exemple: Nosferatu - scènes cauchemardesques

Annotation graphique

screenshot_nosferatu_nightmare.png

Exemple: Il caso Mattei

Travail avec Livia Giunti, doctorat sur l'utilisation d'outils numériques pour l'analyse filmique et l'analyse du temps dans les films

  • Comparaison de différents outils
  • Étude de la structuration des annotations
  • Définition de vues dédiées à la temporalité (durée des plans, temps diégétique vs chronologique)

Exemple: Il caso Mattei

Visualisations dédiées

screenshot_mattei.png

Exemple: Analyse d'expérimentation

A Case Study of Object and Occlusion Management on the eLabBench, a Mixed Physical/Digital Tabletop (Aurélien Tabard - University Lyon 1/CNRS)

  • Annotation graphique d'une capture vidéo d'une paillasse numérique
  • Étude du comportement de l'utilisateur

Exemple: Analyse d'expérimentation

occlusion-video.png

Exemple: Analyse d'expérimentation

Sorry, your browser does not support SVG.

Exemple: Analyse d'expérimentation

Traitement quantitatif d'annotations graphiques

occlusion-heatmap.png

Exemple: accessibilité

Rendu dynamique d'annotations via une plage Braille

screenshot_advene_brltty.png

Autres domaines

Pédagogie

COCONotes

screenshot_coconotes.png

Pédagogie des langues

Visu

screenshot_visu.png

Conclusion?

  • Les annotations sont précieuses
  • Besoins de multiples modalités d'interaction et visualisation
  • Les formats

Sources

  • Lecture active de documents et annotations (Cours) - Yannick Prié (2007)
  • Toward an ecology of hypertext annotation - Catherine Marshall (1998)
  • Rob Sanderson (W3C) (2017)
  • Emmanuel Desmontils
  • Marc Jajah

Unsorted links