Démonstration du Suivi Oculaire: SVG comme AOIs

Aperçu

Dans cette démonstration, notre objectif est de capturer des données de regard de suivi oculaire. Plus précisément, nous voulons capturer les données de regard associées à des Zones d'Intérêt spécifiques (AOIs) qui sont incluses dans l'étude sous forme d'objets SVG shape objects.

Un aperçu de la démonstration en action est montré ci-dessous, le cercle rouge fournissant un retour en indiquant l'emplacement du regard en temps réel :

• REMARQUE : L'enregistrement de la démonstration a été réalisé avec une option de calibration de 5,5 minutes ; le cercle rouge est un objet qui représente le regard des participants en temps réel et la configuration globale est expliquée plus bas.

Regardez cette vidéo rapide qui montre la démonstration en action, ainsi qu'un aperçu des données enregistrées à la fin :

Objets

Cette démonstration comprend une image de fond d'un quai sur lequel 4 objets SVG de personnes sont placés. Il y a également un objet de retour de regard (cercle rouge). Pour les besoins de cette démonstration, nous voulions représenter le regard en temps réel et ce cercle rouge le reflète.

Variables Personnalisées Créées

Pour enregistrer des données, des variables sont nécessaires. Une liste de toutes les variables personnalisées qui ont été créées pour cette démonstration est montrée ci-dessous, accessible via l'onglet ‘Variables’. L'image ci-dessous montre les détails et les paramètres des variables que cette démonstration utilise :

Voici une explication des variables et de leur utilité :

Nom de la variable	Description	Type d'enregistrement
All Gaze Data	Utilisé pour stocker le tableau de coordonnées x/y [X,Y], ainsi que le Temps de Capture [T] et le niveau de confiance [C] de la mesure.	Tous les changements / séries temporelles
AOI1_gaze_data	Utilisé pour stocker le tableau de [X,Y,T,C] lorsque le participant regarde l'objet SVG nommé AOI1.	Tous les changements / séries temporelles
SVG1_path	Enregistre le chemin du nœud SVG sur lequel le regard s'est arrêté d'AOI1 (expliqué plus bas).	Tous les changements / séries temporelles
AOI2_gaze_data	Utilisé pour stocker le tableau de [X,Y,T,C] lorsque le participant regarde l'objet SVG nommé AOI2.	Tous les changements / séries temporelles
SVG2_path	Enregistre le chemin du nœud SVG sur lequel le regard s'est arrêté d'AOI2.	Tous les changements / séries temporelles

Et ainsi de suite….

Événements Configurés

Puisque nous sommes intéressés à capturer des données de regard, les événements suivants sont utilisés :

1. Toutes les données de regard : Cet événement démarre dès que la tâche commence et enregistre en continu les données de regard du suivi oculaire.
2. Données de regard AOI : Cet événement démarre dès que le participant regarde une AOI spécifique (c'est-à-dire l'une des quatre personnes) et enregistre les valeurs liées au regard.
3. Terminer l'expérience : Un événement qui accepte / termine la session et enregistre les données lorsque le sujet clique sur le bouton ‘Terminer’.

Événement 1 : Toutes les données de regard

Pour le premier événement, nous voulons accomplir ce qui suit :

• enregistrer toutes les données de suivi oculaire tout au long de l'étude
• afficher l'emplacement détecté du regard sur l'écran en temps réel (afin que vous, en tant que chercheur, puissiez avoir un ressenti du suivi par la webcam lorsque vous essayez la démonstration)

Déclencheur

Ainsi, nous utilisons un déclencheur de regard de suivi oculaire pour initier cet événement.

Action

Une fois que le regard est détecté, les actions suivantes vont se produire : Tout d'abord, nous appelons la variable All Gaze Data que nous avons créée plus tôt dans une action Set / Record Variable afin d'enregistrer les données sous forme de tableau [X,Y,T,C].

Cela est accompli (comme montré ci-dessous) en cliquant sur le bouton vert, en sélectionnant la variable cible, puis en cliquant sur l'icône de crayon menu de sélection de valeur et en choisissant le tableau [X,Y,T,C] dans le menu spécifique au déclencheur (Eyetracking Gaze), comme montré ci-dessous :

Nous ajoutons également l'action Set Object Property afin de définir l'objet de cercle rouge (appelé ‘regard’) pour que sa propriété X soit égale à et la propriété Y définie sur les coordonnées X et Y, respectivement. En d'autres termes, nous définissons les valeurs x et y de l'objet pour qu'elles soient égales aux coordonnées x et y... en fin de compte, c'est ce qui rend l'objet mobile en temps réel.

REMARQUE : les options pour Coordinate X et Coordinate Y sont sélectionnées dans le menu spécifique au déclencheur (Eyetracking Gaze).

Événement 2 : Données de Regard AOI

Dans cet événement, nous voulons configurer les événements de manière à ce que :

• le regard soit également enregistré lorsque le regard est spécifiquement fixé sur les AOIs cibles (c'est-à-dire les objets SVG que nous avons téléchargés)
• les données spécifiques du nœud SVG de l'AOI soient rapportées

Déclencheur

Le déclencheur Eyetracking Gaze est également utilisé comme déclencheur ici. Mais dans ce contexte, nous indiquons que nous sommes uniquement intéressés par des éléments spécifiques en cliquant sur l'option respective et en sélectionnant les 4 objets SVG qui agissent comme Zones d'Intérêt (AOIs).

Action

Pour établir l'appel sur chaque AOI, nous avons besoin d'un Control Action → Requirement Action (If…Then). Essentiellement, nous voulons que Labvanced fasse ce qui suit…. “Si le participant regarde AOI1, alors nous voulons enregistrer les données spécifiques pour cela dans une variable spécifique, ainsi que le chemin SVG de ce regard”

Tout d'abord, nous cliquons sur le bouton + Requirement et les deux valeurs de l'icône de crayon apparaîtront.

• Première icône de crayon : Pour le premier champ que nous sélectionnons, dans le menu spécifique au déclencheur (Eyetracking Gaze), l'option Stimulus Name qui utilise le nom de l'objet du stimulus sur lequel le déclencheur (dans ce cas, le regard) était.
• Deuxième icône de crayon : Sélectionnez Constant Value puis sélectionnez l'option String et tapez le nom de l'objet (c'est-à-dire AOI1) :

Jusqu'à présent, nous avons établi que quand le déclencheur (regard) est sur le stimulus nommé AOI1... alors :

• La variable AOI_gaze_data que nous avons créée plus tôt enregistrera le tableau [X,Y,T,C].
• De plus, la variable SVG1_path sera enregistrée pour contenir le Stimulus Info qui, dans ce cas, puisque la cible d'intérêt (AOI1) est un SVG, l'info du stimulus contiendra les nœuds du SVG.

Pour spécifier la prochaine AOI, cliquez sur le bouton +Add Else If Case dans la boîte de dialogue et répétez ensuite la structure / la configuration tel qu'il a été montré ci-dessus, mais avec les principales différences d'avoir Stimulus Name comme AOI2 et d'appeler également les variables spécifiques pour stocker les données, c'est-à-dire AOI2_gaze_data et SVG2_Path comme montré ci-dessous :

Ensuite, pour AOI3, nous choisissons de Add Else If Case à nouveau et suivons la même structure mais avec les variables personnalisées que nous avons créées pour stocker les données pour cette AOI spécifique :

Encore une fois, pour AOI4, nous choisissons de Add Else If Case à nouveau et suivons la même structure mais avec les variables personnalisées que nous avons créées pour stocker les données pour cette AOI spécifique :

Événement 3 : Terminer l'Expérience / Enregistrer les Données

Enfin, pour que les données soient enregistrées et stockées, nous devons choisir le Jump Action pour Accept / End Session action une fois que le bouton Finish est cliqué (qui est le déclencheur), comme montré ci-dessous.

Déclencheur

Le déclencheur est spécifié pour se produire lorsque le 'Bouton Terminer' est utilisé :

Action

L'action qui se produira est que la session sera acceptée, ce qui, en conséquence, signifie que les données seront enregistrées.

Voyons comment les données enregistrées auront l'air dans la section suivante.

Données Enregistrées

Les données enregistrées incluent toutes les variables personnalisées ainsi que les valeurs spécifiques à l'expérience comme le numéro de tâche, le numéro de session, etc.

Dans l'exemple ci-dessous, l'onglet Dataview & Export montre à quoi ressemblent les données lorsqu'elles sont séparées par fichiers de séries temporelles. Chaque variable de série temporelle (c'est-à-dire les variables qui enregistrent tous les changements) est affichée avec son propre fichier CSV dans le panneau gauche ci-dessous. Cela peut être réalisé en spécifiant le paramètre pertinent en utilisant les Configure Export paramètres.

Lorsque le All Gaze Data.csv est sélectionné, de nombreuses variables sont enregistrées, y compris celles montrées ci-dessous. La colonne ‘valeur’ capture le tableau [X,Y,T,C] où les valeurs sont séparées par des virgules :

L'image ci-dessous montre un aperçu des tableaux qui ont été enregistrés spécifiquement lorsque le regard était sur AOI1, comme l'indique la colonne ‘valeur’ :

L'image ci-dessous montre un aperçu des chemins SVG qui ont été enregistrés spécifiquement lorsque le regard était sur AOI1, comme l'indique la colonne ‘valeur’ :

Conclusion

Cette démonstration vise à montrer comment enregistrer des données de regard et utiliser des objets SVG pour enregistrer le regard spécifiquement dans le contexte où le regard se produit sur une Zone d'Intérêt (AOI).

Si vous avez des questions, n'hésitez pas à nous contacter et à nous faire part des détails de votre expérience, surtout si vous devez effectuer une vérification de faisabilité !