Esto es lo que sabemos hacer

La técnica

Una simulación de fluidos (las ecuaciones de Navier-Stokes, simplificadas) que corre entera en la tarjeta gráfica con WebGL2: la velocidad, la presión y el color viven en texturas que se reescriben sesenta veces por segundo.

Para tu negocio

Fondos vivos para una campaña, un evento o la pantalla de una tienda física.

Lo que le cuesta al equipo

Es la pieza más exigente: se calcula a menos resolución que la pantalla y, en un equipo lento, se para sola.

// en cada cuadro: mover, quitar la divergencia y volver a mover
advectar(velocidad); salpicar(raton);
divergencia(velocidad);
for (let i = 0; i < 20; i++) jacobi(presion);
restarGradiente(velocidad, presion);
advectar(tinta, velocidad);

La técnica

Arte generativo: un campo de ruido decide la dirección en cada punto del lienzo y miles de partículas lo recorren dejando rastro. Una semilla al azar hace que cada obra sea distinta; con la misma semilla, sale la misma.

Para tu negocio

Felicitaciones, envoltorios o fondos de campaña únicos para cada cliente, o una portada que no se repite nunca.

Lo que le cuesta al equipo

Unos segundos de dibujo, y se para: no se queda gastando.

const angulo = ruido(x * escala, y * escala, semilla) * Math.PI * 4;
x += Math.cos(angulo) * paso;  y += Math.sin(angulo) * paso;
ctx.lineTo(x, y);

La técnica

Un motor de física escrito para esta pieza, sin librerías: gravedad, choques entre círculos, rebote y rozamiento, en un lienzo 2D. Lo que sueltas sale con la velocidad de tu mano.

Para tu negocio

Campañas con juego (un sorteo, un calendario de adviento) o un configurador que da gusto usar.

Lo que le cuesta al equipo

Poco: unas decenas de objetos.

for (const a of bolas) for (const b of bolas) {
  const d = distancia(a, b), solape = a.r + b.r - d;
  if (solape > 0) separar(a, b, solape), rebotar(a, b, 0.6);
}

La técnica

El vídeo lo ha hecho una IA de vídeo de Google a partir de una descripción, por nuestra plataforma de IA (panelia). Cada fotograma se lee en un lienzo pequeño, y cada píxel da la altura y el color de un cubo en 3D: miles de cubos dibujados de una sola vez (three.js, mallas instanciadas).

Para tu negocio

Vídeos de producto o de campaña sin rodaje, y efectos que convierten tu imagen en algo que nadie más tiene.

Lo que le cuesta al equipo

El clip costó céntimos. El efecto es ligero: una sola llamada de dibujo para todos los cubos.

ctx.drawImage(video, 0, 0, columnas, filas);
const px = ctx.getImageData(0, 0, columnas, filas).data;
for (let i = 0; i < total; i++) {
  const luz = (px[i*4] + px[i*4+1] + px[i*4+2]) / 765;
  matriz.makeScale(1, 0.2 + luz * 4, 1).setPosition(x(i), luz * 2, z(i));
  cubos.setMatrixAt(i, matriz);
}

La técnica

Web Audio: osciladores, un filtro y un eco crean el sonido en tu equipo, sin ningún fichero de audio. Un analizador lee sus frecuencias sesenta veces por segundo y el dibujo las sigue.

Para tu negocio

Experiencias de marca, presentaciones en ferias, y lo mismo con una voz: Gestito, nuestro asistente, habla así en gestiwia.com.

Lo que le cuesta al equipo

Nada: el sonido no se descarga, se fabrica. Se calla al salir de la pieza.

const osc = audio.createOscillator(), filtro = audio.createBiquadFilter();
osc.connect(filtro).connect(eco).connect(analizador).connect(audio.destination);
analizador.getByteFrequencyData(frecuencias); // y con ellas se dibuja

La técnica

three.js con materiales físicos (tela, madera, metal) y una habitación virtual para los reflejos. Cada botón cambia un material y suma su precio.

Para tu negocio

Vender lo que tiene opciones (muebles, tejidos, regalos personalizados): el cliente ve lo que pide, y el pedido llega a tu ERP con sus opciones.

Lo que le cuesta al equipo

Un modelo ligero que solo se dibuja mientras lo miras o lo giras.

boton.onclick = () => {
  tela.color.set(COLORES[boton.dataset.valor]);
  total.textContent = euros(BASE + EXTRA[boton.dataset.valor]);
};