Medusa dorada de aguas profundas

Crea una página web interactiva de medusas con Three.js. Sobre un fondo oceánico brillante en el centro y azul profundo en los bordes, muestra de 6 a 10 medusas doradas translúcidas que roten lentamente y pulsen hacia arriba; al menos tres deben permanecer visibles en todo momento, y toda medusa que cruce el límite superior debe volver a entrar por abajo. Cada medusa tiene franjas radiales naranjas y blanco crema, manchas, un brillo interno y un borde translúcido definido; los brazos orales con volantes son visibles a través de la umbrela. Cuando la umbrela se contrae, su borde se abre visiblemente hacia afuera.

Cada medusa consta de una capa interior y otra exterior de umbrela, un faldón suave, 20 tentáculos finísimos y 4 brazos orales con volantes. La umbrela se contrae periódicamente, y el faldón, los tentáculos y los brazos orales continúan el movimiento mediante un sistema estable de física de resortes Verlet; no uses animación pregrabada. Todo el movimiento se ejecuta con un único reloj de física unificado; limita los intervalos de fotogramas largos y usa suficientes subpasos para que la simulación no se desestabilice ni se desplace de su sitio durante ejecuciones prolongadas.

Agrega cáusticas suaves, cortinas simuladas de luz volumétrica y plancton centelleante al fondo, renderizados con bloom suave y mapeo de tonos ACES para lograr una iluminación de aguas profundas. Gestiona correctamente la ordenación de capas transparentes y el antialiasing para que los tentáculos se mantengan continuos y definidos. Cuando el mouse se acerque a una medusa, acelera su pulso, intensifica su brillo y aplica un ligero impulso a sus tentáculos. Permite arrastrar con el mouse para rotar la vista y usar la rueda de desplazamiento para hacer zoom, con distancia de visualización y ángulo de inclinación limitados. Reemplaza las medusas doradas por entre 15 y 20 peces tropicales brillantes de color azul verdoso. Conserva la física de resortes Verlet para el movimiento de la cola y las aletas, y haz que el cardumen recorra lentamente la escena en círculos mientras evita colisiones. Usa WebGL2 con modelos y materiales procedurales. No uses WebGPU, modelos externos, audio, panel de control ni cambio entre varias escenas. Entrega una página web estática que se ejecute directamente, con las dependencias empaquetadas localmente. Sigue el enfoque visual y físico de Aurelia, e incluye notas de atribución y licencia para todo el código y los algoritmos utilizados; si reutilizas el trabajo original o el algoritmo de cáusticas de Dave Hoskins, conserva la atribución de licencia correspondiente.

Crea una página web interactiva de medusas con Three.js. Sobre un fondo oceánico brillante en el centro y azul profundo en los bordes, muestra de 6 a 10 medusas doradas translúcidas que roten lentamente y pulsen hacia arriba; al menos tres deben permanecer visibles en todo momento, y toda medusa que cruce el límite superior debe volver a entrar por abajo. Cada medusa tiene franjas radiales naranjas y blanco crema, manchas, un brillo interno y un borde translúcido definido; los brazos orales con volantes son visibles a través de la umbrela. Cuando la umbrela se contrae, su borde se abre visiblemente hacia afuera.

Cada medusa consta de una capa interior y otra exterior de umbrela, un faldón suave, 20 tentáculos finísimos y 4 brazos orales con volantes. La umbrela se contrae periódicamente, y el faldón, los tentáculos y los brazos orales continúan el movimiento mediante un sistema estable de física de resortes Verlet; no uses animación pregrabada. Todo el movimiento se ejecuta con un único reloj de física unificado; limita los intervalos de fotogramas largos y usa suficientes subpasos para que la simulación no se desestabilice ni se desplace de su sitio durante ejecuciones prolongadas.

Agrega cáusticas suaves, cortinas simuladas de luz volumétrica y plancton centelleante al fondo, renderizados con bloom suave y mapeo de tonos ACES para lograr una iluminación de aguas profundas. Gestiona correctamente la ordenación de capas transparentes y el antialiasing para que los tentáculos se mantengan continuos y definidos. Cuando el mouse se acerque a una medusa, acelera su pulso, intensifica su brillo y aplica un ligero impulso a sus tentáculos. Permite arrastrar con el mouse para rotar la vista y usar la rueda de desplazamiento para hacer zoom, con distancia de visualización y ángulo de inclinación limitados. Haz que se pueda hacer clic en cada medusa. Al hacer clic, pausa su movimiento y muestra una ficha informativa con el nombre de la especie, la profundidad de su hábitat y dos datos breves escritos para público general. Usa WebGL2 con modelos y materiales procedurales. No uses WebGPU, modelos externos, audio, panel de control ni cambio entre varias escenas. Entrega una página web estática que se ejecute directamente, con las dependencias empaquetadas localmente. Sigue el enfoque visual y físico de Aurelia, e incluye notas de atribución y licencia para todo el código y los algoritmos utilizados; si reutilizas el trabajo original o el algoritmo de cáusticas de Dave Hoskins, conserva la atribución de licencia correspondiente.