IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)

Vous êtes nouveau sur Developpez.com ? Créez votre compte ou connectez-vous afin de pouvoir participer !

Vous devez avoir un compte Developpez.com et être connecté pour pouvoir participer aux discussions.

Vous n'avez pas encore de compte Developpez.com ? Créez-en un en quelques instants, c'est entièrement gratuit !

Si vous disposez déjà d'un compte et qu'il est bien activé, connectez-vous à l'aide du formulaire ci-dessous.

Identifiez-vous
Identifiant
Mot de passe
Mot de passe oublié ?
Créer un compte

L'inscription est gratuite et ne vous prendra que quelques instants !

Je m'inscris !

WebGazer.js : détecter le regard des visiteurs de votre site Web
Grâce à cette bibliothèque JavaScript

Le , par vermine

10PARTAGES

4  1 
WebGazer.js est une bibliothèque JavaScript qui utilise la webcam pour détecter la direction du regard des visiteurs sur le site Web. L'objectif est de déterminer les éléments que les visiteurs parcourent des yeux.

Conçu par Brown HCI, une équipe qui étudie l’interaction des utilisateurs avec les ordinateurs, l'outil est entièrement écrit en JavaScript et, avec seulement quelques lignes de code, il peut être intégré dans n’importe quel site Web. Il s’exécute entièrement dans le navigateur client, donc aucune donnée vidéo ne doit être envoyée à un serveur.

La bibliothèque utilise l'API getUserMedia/Stream et est ainsi compatible avec les navigateurs principaux sans qu'un matériel particulier ne soit nécessaire.

Fort heureusement, et c'est de toute façon en partie géré par les navigateurs consciencieux, WebGazer.js s’exécute uniquement si l’utilisateur consent à donner accès à sa webcam. Quoi qu'il en soit, l'API, elle, n'est pas du tout nouvelle. Et l'accès à la webcam depuis du code JavaScript ne date pas d'hier même si ça fait encore débat aujourd'hui.

Voici quelques caractéristiques :

  • calibration automatique selon les mouvements du curseur et les clics ;
  • facile à intégrer dans votre code ;
  • des composants pour la détection des yeux ;
  • des modèles de prévisions sur le mouvement du regard ;
  • la sauvegarde des informations entre sessions via le localstorage ;
  • la possibilité de faire une pause en plein milieu du traçage (en cas de problème de performance sur certaines de vos pages, par exemple).


WebGazer.js peut ouvrir d'autres possibilités d'utilisation. Sur la page d'exemples, il y a même un petit jeu où vos yeux doivent guider une balle !

Mais bon, dès qu'on parle de manipulation de webcam, une partie de la communauté se révolte, par peur, par crainte, par conviction. Gardons à l'esprit que comme toujours, ce ne sont pas les outils qu'on nous donne qui posent problème, c'est ce que nous en faisons.

Le site officiel.

Et vous ?

Que pensez-vous de ce genre d'outils ? En connaissez-vous d'autres ?

Retrouver les cours et tutoriels sur les frameworks JavaScript.

Une erreur dans cette actualité ? Signalez-nous-la !

Avatar de timouneu
Candidat au Club https://www.developpez.com
Le 28/05/2016 à 14:46
au-delà de la nouvelle expérience il faut bien penser que tout le monde ne peut pas bouger ses deux bras, comme par exemple les malades de la maladie de charcot.

Avoir une solution gratuite et facile à utiliser sur un site web (et pas seulement finalement) c'est tout simplement génial pour ces profils.
N'oubliez pas qu'il n'y a pas que des gens valident sur terre
2  0 
Avatar de SpaceFrog
Rédacteur/Modérateur https://www.developpez.com
Le 03/06/2016 à 12:52
et si je louche ?
1  0 
Avatar de MaximeCh
Membre éprouvé https://www.developpez.com
Le 27/05/2016 à 15:33
Je trouve ça sinistre et ai, comme le patron du FBI, une carte de visite pour masquer ma cam...
0  0 
Avatar de sekaijin
Expert éminent https://www.developpez.com
Le 27/05/2016 à 16:10
la mienne est au cas ou tournée vers le jardin.

A+JYT
0  0 
Avatar de Nicokroox
Candidat au Club https://www.developpez.com
Le 27/05/2016 à 17:22
la mienne est....

ah c'est vrai j'en ai pas !
0  0 
Avatar de daimebag
Membre du Club https://www.developpez.com
Le 27/05/2016 à 23:14
Réjouissant!
0  0 
Avatar de GilbertLatranche
Membre averti https://www.developpez.com
Le 27/05/2016 à 23:24
Citation Envoyé par Metalman Voir le message
...!
But it's webscale !!
0  0 
Avatar de zecreator
Membre expert https://www.developpez.com
Le 28/05/2016 à 11:23
Je trouve cela sympa de proposer ce genre d'interaction. Après, c'est très adapté au PC. Sur mobile, cela me semble difficile. Comme pour tout, il ne faut pas en abuser. Faire tout un site utilisant ce procédé ne me semble pas pertinent.

Citation Envoyé par Metalman Voir le message
Mais mais mais... bousiller les perf' de la navigation web avec du JS et du Flash partout ne suffit leur toujours pas ?!... 2Go de RAM consommés juste pour faire de la pub "efficace", des interactions "MODERNES" avec l'utilisateur (qui déconnent dans 80% des cas), la détection du device pour encore plus déformer les pages et cacher la moitié des options normalement dispos sur PC mais pas sur smartphone, ... ce n'est pas suffisant non...
Il faut ENCORE plus ralentir tout ça en analysant la webcam (bravo l'API qui va bouffer mes I/O encore plus et mon CPU pour analyser n'importe quoi), et surtout en uploadant ces résultats...

MAIS ON VA OU ?!
Je ne sais pas quel type de contenu web tu développes, mais je pense qu'il ne faut pas se braquer sur ce genre de truc. Je trouve ça plutôt bien de proposer une autre expérience web. Pour ma part, depuis que je propose des contenus VR et 3D sur certains de mes sites, j'ai 26% de visites en plus. De même, j'ai mis en place quelques écrans en réalité augmentée (en plaçant des cartes devant la web cam), mais ça marche moins bien. Ce dont tu parles, les problèmes de performances, ne viennent pas QUE des API et moteurs qui sont développés, mais aussi des navigateurs. Certains sont justes bons à afficher du HTML4 de base. Pour exemple, du contenu WebGL a tendance à lagger sur Firefox (qui plante de plus en plus à mesure que l'on avance dans les versions), alors que sous Edge ou Chrome, ça tourne très bien, sans consommation de CPU et de RAM exagérée.

Captures d'écrans, avec la consommation CPU et RAM lors du lancement de la demo sous Firefox. Mon PC : Windows 8.1 Pro, 8 Go de RAM.

0  0 
Avatar de rsuinux
Membre habitué https://www.developpez.com
Le 30/05/2016 à 10:27
@timoneu:
Votre remarque est tout à fait pertinente.
Il reste à trouver l'inverse: entrer des données, quelle qu'elles soient, par ce biais!
0  0 
Avatar de zecreator
Membre expert https://www.developpez.com
Le 30/05/2016 à 14:07
Citation Envoyé par timouneu Voir le message
au-delà de la nouvelle expérience il faut bien penser que tout le monde ne peut pas bouger ses deux bras, comme par exemple les malades de la maladie de charcot.

Avoir une solution gratuite et facile à utiliser sur un site web (et pas seulement finalement) c'est tout simplement génial pour ces profils.
N'oubliez pas qu'il n'y a pas que des gens valident sur terre
Tout à fait vrai. Merci de l'avoir souligné.
0  0