---
title: "Volea — análisis de partidos de tenis | Logic2b Lab"
description: "Demo técnica: software de análisis de tenis con mapa de botes en SVG, partido en directo, ficha de jugador con vídeo y estadística por tramos con rango arrastrable — vanilla JS, cero dependencias."
lang: es-ES
source_url:
  html: https://logic2b.com/lab/volea/
  md: https://logic2b.com/lab/volea/index.md
---

# Volea Lab · Deporte y rendimiento

lab.logic2b.com/volea

Ruta: [Lab](https://logic2b.com/lab) › [Deporte y rendimiento](https://logic2b.com/sistemas/deporte-rendimiento)

## Cómo se construyó Volea

Demo de plataforma de análisis para academias y clubes de tenis sobre tierra batida. El panel oscuro dibuja la pista en SVG con el bote de cada golpe del set, las zonas con su porcentaje a ambos lados y un partido que se sigue jugando en directo: cada punto traza su trayectoria, deja su bote y recalcula los porcentajes. La tarjeta central es la ficha del jugador sobre su propia foto, con un vídeo del saque que se reproduce en la tarjeta y un minimapa de botes; con «Anterior» y «Siguiente» cambia de jugador y todo el panel se recalcula. La tarjeta blanca de estadística tiene un histograma de golpes por tramo con un selector de rango arrastrable que recalcula golpes por hora, velocidad media y peloteo más largo. Los paneles se redimensionan arrastrando el tirador de su borde ondulado. Datos seedeados, sin backend.

Es una demo técnica, no una plantilla vendible tal cual: un adelanto de lo que podemos construir a medida cuando un proyecto necesita algo más que una web de catálogo. Si te interesa algo parecido para tu producto, hablamos.

### Qué demuestra

- Pista de tierra batida dibujada en SVG con el bote de cada golpe del set, color por resultado y zonas con su porcentaje a ambos lados
- Partido en directo: cada punto traza la trayectoria de la bola, deja su bote y recalcula porcentajes, contadores e histograma
- Selector de set en carrusel que recalcula el mapa a partir del generador seedeado
- Ficha del jugador sobre su foto con vídeo del saque reproducible en la propia tarjeta y minimapa de botes
- «Anterior» y «Siguiente» cambian de jugador con fundido y todas las cifras del panel se interpolan
- Histograma de golpes por tramo con selector de rango de dos tiradores que recalcula las métricas
- Paneles redimensionables arrastrando el tirador de sus bordes ondulados (clip-path calculado en vivo)
- Fotografía y vídeo generados con IA (Higgsfield), autoalojados; cero CDNs de imágenes

### Detalles

**Categoría**

Deporte y rendimiento

**Formato**

Demo interactiva, sin backend

### Stack usado

- JavaScript
- SVG
- Vídeo

### Categorías

[Deporte y rendimiento](https://logic2b.com/sistemas/deporte-rendimiento) [Cuadros de mando y analítica](https://logic2b.com/sistemas/cuadros-de-mando) Deporte Dashboard SVG Tiempo real

## Labs relacionados

[Ver todos](https://logic2b.com/lab)

[**Brío** Cuadros de mando y analítica](https://logic2b.com/lab/brio) [**Aforo** Deporte y rendimiento](https://logic2b.com/lab/aforo) [**Estrado** Cuadros de mando](https://logic2b.com/lab/estrado)

---

Logic2b S.L. · Castellón (España) · [info@logic2b.com](mailto:info@logic2b.com) · [Contacto](https://logic2b.com/contacto/) · [Auditoría gratuita](https://logic2b.com/auditoria/) · [Índice para IA](https://logic2b.com/llms.txt)
