# brownhci/webgazer

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/brownhci-webgazer).**

3,865 stars · 582 forks · HTML · NOASSERTION

## Links

- GitHub: https://github.com/brownhci/WebGazer
- Homepage: https://webgazer.cs.brown.edu
- awesome-repositories: https://awesome-repositories.com/repository/brownhci-webgazer.md

## Description

WebGazer is a JavaScript eye tracking library and browser-based computer vision tool that predicts a user's gaze coordinates on a screen in real time using a standard webcam. It functions as a client-side biometric tracker and accessibility input framework, mapping eye gaze to screen interactions to enable hands-free navigation and user interaction research.

The system performs all video processing and gaze analysis locally within the web browser, removing the need for external servers. It employs regression-based mapping models to translate eye coordinates into screen pixels, utilizing a training process that records mouse movements and click events to refine prediction accuracy.

The library includes capabilities for managing the tracking lifecycle, validating face position via a visual feedback overlay, and persisting calibration data to local storage to maintain model accuracy across sessions.

## Tags

### Artificial Intelligence & ML

- [Gaze Predictors](https://awesome-repositories.com/f/artificial-intelligence-ml/gaze-predictors.md) — A tool that predicts where a user is looking by analyzing webcam video through regression-based mapping models.
- [Eye Gaze Tracking](https://awesome-repositories.com/f/artificial-intelligence-ml/iris-tracking/gaze-vector-calculations/eye-gaze-tracking.md) — Determines a user's gaze position on a screen by analyzing eye orientation via webcam.
- [Client-Side Biometric Trackers](https://awesome-repositories.com/f/artificial-intelligence-ml/client-side-biometric-trackers.md) — Performs all biometric gaze analysis and model training locally in the web browser without external servers.
- [Web-Based Computer Vision](https://awesome-repositories.com/f/artificial-intelligence-ml/machine-learning/frameworks/computer-vision/web-based-computer-vision.md) — Implements real-time image processing and pupil detection directly within the web browser.
- [Gaze Feedback Overlays](https://awesome-repositories.com/f/artificial-intelligence-ml/iris-tracking/gaze-vector-calculations/eye-gaze-tracking/gaze-feedback-overlays.md) — Provides real-time visual feedback on gaze alignment and calibration status via a video feed. ([source](https://cdn.jsdelivr.net/gh/brownhci/webgazer@master/README.md))
- [Gaze Model Trainers](https://awesome-repositories.com/f/artificial-intelligence-ml/iris-tracking/gaze-vector-calculations/eye-gaze-tracking/gaze-model-trainers.md) — Collects interaction data from mouse clicks and cursor movements to improve gaze prediction models. ([source](https://cdn.jsdelivr.net/gh/brownhci/webgazer@master/README.md))

### Development Tools & Productivity

- [Spatial Interaction Frameworks](https://awesome-repositories.com/f/development-tools-productivity/interactive-input-frameworks/spatial-interaction-frameworks.md) — Maps eye gaze and spatial interaction to screen coordinates to enable hands-free navigation.

### User Interface & Experience

- [Hands-Free User Interfaces](https://awesome-repositories.com/f/user-interface-experience/hands-free-user-interfaces.md) — Enables full website interaction and navigation without the use of a mouse or keyboard.
- [Positioning Guidance Overlays](https://awesome-repositories.com/f/user-interface-experience/content-rendering-components/image-overlays/media-watermarking-tools/visible-watermark-overlays/real-time-dynamic-overlays/positioning-guidance-overlays.md) — Renders a dynamic UI layer over the video stream to guide user positioning and verify tracking.
- [User Research Platforms](https://awesome-repositories.com/f/user-interface-experience/user-research-platforms.md) — Facilitates usability testing by analyzing visual attention and how users look at web pages.

### Web Development

- [Client-Side Media Processing](https://awesome-repositories.com/f/web-development/client-side-media-processing.md) — Analyzes webcam video frames locally in the browser to reduce latency and preserve privacy.
- [Calibration Event Mappings](https://awesome-repositories.com/f/web-development/event-driven-architectures/calibration-event-mappings.md) — Refines gaze prediction accuracy by mapping real-time mouse click events to eye-tracking data.