gest.js by @hadi_michael
Use your arrow keys to navigate the slides
this presentation has been updated for v0.5.0
gest.js
... is a webcam based gesture recognition library that helps developers make webpages more immersive.
It can enable the use of mid-air hand gestures to control elements on a webpage.
DEMO
You can use gest.js to navigate this slide deck...
Let's go!Okay, stop gest.
Algorithm overview
- Capture frames at 25fps (4x compressed).
- Use a difference map to identify pixels that have moved since the last frame.
- Count those pixels. If enough have moved, then evaluate the general direction of pixel movement.
USAGE
Starting and Stopping
gest.start(); //start detecting gestures
gest.stop(); //stop detecting gestures
Listen for recognised gestures
Use the .options.subscribeWithCallback(...) function to listen for gestures:
gest.options.subscribeWithCallback(function(gesture) {
//handle gesture
});
Event Object
- .direction the recognised gesture in words as a string
- .up boolean, true if the recognised gesture is up
- .down boolean, true if the recognised gesture is down
- .left boolean, true if the recognised gesture is left
- .right boolean, true if the recognised gesture is right
- .error an error object with...
- .code a code as an int, and
- .message a message as a string
Options
You can also set options using:
gest.options.sensitivity(85); //pixel color-change sensitivity
gest.options.skinFilter(true); //HSV skin filtering
gest.options.debug(true); //set debug mode