Skip to content

beemsoft/webxr-handtracking-playground

Repository files navigation

WebXR hand tracking playground

This project uses the MediaPipe Hands solution for adding hand tracking to the browser. The detected hand poses are used for rendering 3d hand models in a three.js scene.

When running in a WebXR enabled browser, the hand tracking solution of the device itself will be used.

In both cases, WebXR or non-WebXR, the same scene is displayed.

Introduction video

This is a quick introduction/demo for hand tracking in the browser.

demo-video

Usage

npm install
npm start

This will start the demo in a new browser page. Wait for a few seconds for the video stream to start. In the control panel, you can pause the video stream to get a higher FPS in the three.js scene rendering.

Demo

https://www.beemsoft.nl/vr/

WebXR development

Below are a few useful links for WebXR development

Enabling hand tracking

Turn on Hand Tracking in Oculus Quest

Remote debugging

Debug Your Browser Content

About

WebXR handtracking playground

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published