This project demonstrates Edge AI — running real machine-learning models directly in your browser with zero server communication. Your webcam feed is processed locally using MediaPipe Hands to detect 21 hand landmarks in real-time, which are then classified into 8+ gestures using custom geometry-based algorithms.

How It Works

1. 📷 Webcam captures frames via getUserMedia()
2. 🤖 MediaPipe Hands processes each frame on-device (WASM + WebGL)
3. 📐 21 3D landmarks per hand are extracted
4. 🧮 Finger states and angles are computed geometrically
5. 🏷️ Gestures are classified via rule-based logic
6. 🎬 Actions are triggered: sounds, particles, drawing, speech, and more

Tech Stack