Gesture Arena — jugá con la mano
Tres juegos (2 en 2D + un shooter 3D NEON RIFT) controlados solo con gestos de la mano frente a la webcam. Cero mandos, cero teclado.
Qué es
Una arcade web de 4 juegos que se controlan con las manos y el cuerpo frente a la webcam, sin tocar nada. Incluye Gesture Rush y Bubble Pop (2D), NEON RIFT (naves 3D, la estrella del demo) y FUEGO CRUZADO (shooter de dos manos estilo torreta: levantás las dos palmas y el arma dispara sola). Lo construí como demo viral y comercial: algo que en una feria hace que la gente se pare a mirar.
Qué problema resuelve
Cuando vendés tecnología, decir "hacemos cosas con IA" no convence a nadie. Esto sí: la persona mueve la mano y la nave gira. Además tiene un ángulo de negocio: es white-label, o sea que con un archivo de configuración le cambiás colores, nombre y CTA para venderlo como "experiencia interactiva de marca" a un cliente.
Cómo funciona (por dentro, explicado simple)
La detección de manos y cuerpo la hace MediaPipe (Hands y Pose), una librería de Google que corre en el navegador: nada sale de tu cámara hacia ningún servidor. El backend es Node sin dependencias: sirve los archivos, guarda el ranking global y captura leads en JSON. Hay un vigilante de rendimiento que apaga la detección de cuerpo si el juego baja de 30 fps, para que nunca se trabe. Los escenarios (una ciudad nocturna, una zona de guerra) los generé con IA y van montados dentro de la escena 3D.
Cómo se usa
Con Node instalado, en la carpeta del proyecto:
node server.jsy abrís http://localhost:8077. El hub comercial está en /hub.html. Necesitás darle permiso de cámara al navegador. Si no tenés cámara, FUEGO CRUZADO tiene fallback de mouse para probarlo igual.
Lo que aprendí construyéndolo
Quedó code-complete y verificado en navegador real (auditoría automatizada con Playwright, cero errores), pero nunca lo deployé: cuando llegó el momento de decidir, prioricé proyectos que cobraran más rápido, y hoy está archivado. La lección más grande fue esa: un demo espectacular no es un negocio; el juego más impresionante que hice es también uno de los que menos ingresos generó. La otra lección es técnica: el feedback en pantalla importa muchísimo — la gente no sabe por qué "no funciona", así que cada juego avisa claro cuando no ve la mano, cuando estás lejos o cuando falta permiso de cámara.
Ficha técnica
| Campo | Detalle |
|---|---|
| Stack | MediaPipe Hands + Pose, Three.js (el juego 3D), Node sin dependencias, Docker listo |
| Estado real hoy | Lo construí, funciona, está archivado; nunca llegó a deploy público |
| Dónde vive | Corre local en mi PC; no tiene URL pública |
¿Lo querés funcionando en tu negocio?
Mirá cómo trabajamos, o entrá gratis a la comunidad y preguntá lo que te trabó.