Méduses dorées des grands fonds

Créez une page web interactive de méduses avec Three.js. Sur un fond océanique clair au centre et bleu profond sur les bords, affichez 6 à 10 méduses dorées translucides qui tournent lentement et pulsent en remontant ; au moins trois doivent rester visibles en permanence, et toute méduse franchissant la limite supérieure doit réapparaître par le bas. Chaque méduse présente des rayures radiales orange et blanc crème, des taches, une lueur interne et un bord translucide bien net ; les bras buccaux frangés sont visibles à travers l'ombrelle. Lorsque l'ombrelle se contracte, son bord s'évase visiblement vers l'extérieur.

Chaque méduse se compose d'une couche d'ombrelle interne et externe, d'une jupe souple, de 20 tentacules très fins et de 4 bras buccaux frangés. L'ombrelle se contracte périodiquement, et la jupe, les tentacules et les bras buccaux suivent un système physique stable de ressorts Verlet — n'utilisez pas d'animation préenregistrée. Tous les mouvements reposent sur une seule horloge physique unifiée ; limitez les grands intervalles entre les images et utilisez suffisamment de sous-étapes afin que la simulation ne diverge pas et ne se décale pas lors d'une exécution prolongée.

Ajoutez au fond de douces caustiques, de faux rideaux de lumière volumétrique et du plancton scintillant, avec un bloom doux et un tone mapping ACES pour restituer l'éclairage des grands fonds. Gérez correctement le tri des couches transparentes et l'anticrénelage afin que les tentacules restent continus et nets. Lorsque la souris s'approche d'une méduse, ses pulsations s'accélèrent, sa lueur s'intensifie et ses tentacules reçoivent une légère impulsion. Prenez en charge le glisser-déposer à la souris pour faire pivoter la vue et la molette pour zoomer, avec une distance de vue et un angle de tangage limités. Remplacez les méduses dorées par 15 à 20 poissons tropicaux lumineux bleu-vert. Conservez la physique des ressorts Verlet pour le mouvement de la queue et des nageoires, et faites nager lentement le banc en cercle dans la scène tout en évitant les collisions. Utilisez WebGL2 avec des modèles et des matériaux procéduraux. Pas de WebGPU, de modèles externes, d'audio, de panneau de contrôle ni de changement de scène. Livrez une page web statique fonctionnant directement, avec les dépendances regroupées localement. Suivez l'approche visuelle et physique d'Aurelia, et conservez les mentions d'attribution et de licence pour tout code et algorithme utilisés ; si vous réutilisez l'œuvre originale ou l'algorithme de caustiques de Dave Hoskins, conservez l'attribution de licence correspondante.

Créez une page web interactive de méduses avec Three.js. Sur un fond océanique clair au centre et bleu profond sur les bords, affichez 6 à 10 méduses dorées translucides qui tournent lentement et pulsent en remontant ; au moins trois doivent rester visibles en permanence, et toute méduse franchissant la limite supérieure doit réapparaître par le bas. Chaque méduse présente des rayures radiales orange et blanc crème, des taches, une lueur interne et un bord translucide bien net ; les bras buccaux frangés sont visibles à travers l'ombrelle. Lorsque l'ombrelle se contracte, son bord s'évase visiblement vers l'extérieur.

Chaque méduse se compose d'une couche d'ombrelle interne et externe, d'une jupe souple, de 20 tentacules très fins et de 4 bras buccaux frangés. L'ombrelle se contracte périodiquement, et la jupe, les tentacules et les bras buccaux suivent un système physique stable de ressorts Verlet — n'utilisez pas d'animation préenregistrée. Tous les mouvements reposent sur une seule horloge physique unifiée ; limitez les grands intervalles entre les images et utilisez suffisamment de sous-étapes afin que la simulation ne diverge pas et ne se décale pas lors d'une exécution prolongée.

Ajoutez au fond de douces caustiques, de faux rideaux de lumière volumétrique et du plancton scintillant, avec un bloom doux et un tone mapping ACES pour restituer l'éclairage des grands fonds. Gérez correctement le tri des couches transparentes et l'anticrénelage afin que les tentacules restent continus et nets. Lorsque la souris s'approche d'une méduse, ses pulsations s'accélèrent, sa lueur s'intensifie et ses tentacules reçoivent une légère impulsion. Prenez en charge le glisser-déposer à la souris pour faire pivoter la vue et la molette pour zoomer, avec une distance de vue et un angle de tangage limités. Rendez chaque méduse cliquable. Au clic, interrompez son mouvement et affichez une fiche d'information avec le nom de l'espèce, la profondeur de son habitat et deux courts faits rédigés pour le grand public. Utilisez WebGL2 avec des modèles et des matériaux procéduraux. Pas de WebGPU, de modèles externes, d'audio, de panneau de contrôle ni de changement de scène. Livrez une page web statique fonctionnant directement, avec les dépendances regroupées localement. Suivez l'approche visuelle et physique d'Aurelia, et conservez les mentions d'attribution et de licence pour tout code et algorithme utilisés ; si vous réutilisez l'œuvre originale ou l'algorithme de caustiques de Dave Hoskins, conservez l'attribution de licence correspondante.