Ubur-Ubur Laut Dalam Emas

Buat halaman web ubur-ubur interaktif dengan Three.js. Dengan latar laut yang terang di bagian tengah dan biru tua di bagian tepi, tampilkan 6–10 ubur-ubur emas transparan yang perlahan berputar dan berdenyut ke atas; setidaknya tiga harus selalu terlihat, dan setiap ubur-ubur yang melintasi batas atas muncul kembali dari bawah. Setiap ubur-ubur memiliki garis radial oranye dan putih krem, bintik-bintik, cahaya dari dalam, serta tepi transparan yang jelas; lengan oral berumbai terlihat melalui belnya. Saat bel berkontraksi, tepinya tampak melebar ke luar.

Setiap ubur-ubur terdiri atas lapisan bel dalam dan luar, rok lembut, 20 tentakel setipis rambut, dan 4 lengan oral berumbai. Bel berkontraksi secara berkala, sementara rok, tentakel, dan lengan oral bergerak mengikuti sistem fisika pegas Verlet yang stabil — jangan gunakan animasi rekaman. Semua gerakan berjalan pada satu jam fisika terpadu; batasi interval frame yang besar dan gunakan sublangkah yang cukup agar simulasi tidak menyimpang atau bergeser dari tempatnya selama berjalan lama.

Tambahkan kaustik lembut, tirai cahaya volumetrik semu, dan plankton berkelip pada latar belakang, yang dirender dengan bloom lembut dan pemetaan rona ACES untuk nuansa pencahayaan laut dalam. Tangani pengurutan lapisan transparan dan anti-aliasing dengan tepat agar tentakel tetap tersambung dan tajam. Saat mouse mendekati ubur-ubur, denyutnya semakin cepat, cahayanya semakin intens, dan tentakelnya mendapat dorongan ringan. Dukung seret mouse untuk memutar tampilan dan roda gulir untuk memperbesar atau memperkecil, dengan jarak pandang dan sudut pitch yang dibatasi. Ganti ubur-ubur emas dengan 15–20 ikan tropis bercahaya biru-hijau. Pertahankan fisika pegas Verlet untuk gerakan ekor dan sirip, serta buat kawanan tersebut berputar perlahan mengelilingi scene sambil menghindari tabrakan. Gunakan WebGL2 dengan model dan material prosedural. Tanpa WebGPU, model eksternal, audio, panel kontrol, maupun pergantian beberapa scene. Buat halaman web statis yang dapat langsung dijalankan, dengan dependensi dibundel secara lokal. Ikuti pendekatan visual dan fisika Aurelia, serta sertakan catatan atribusi dan lisensi untuk semua kode dan algoritme yang digunakan; jika menggunakan kembali karya asli atau algoritme kaustik Dave Hoskins, pertahankan atribusi lisensi yang sesuai.

Buat halaman web ubur-ubur interaktif dengan Three.js. Dengan latar laut yang terang di bagian tengah dan biru tua di bagian tepi, tampilkan 6–10 ubur-ubur emas transparan yang perlahan berputar dan berdenyut ke atas; setidaknya tiga harus selalu terlihat, dan setiap ubur-ubur yang melintasi batas atas muncul kembali dari bawah. Setiap ubur-ubur memiliki garis radial oranye dan putih krem, bintik-bintik, cahaya dari dalam, serta tepi transparan yang jelas; lengan oral berumbai terlihat melalui belnya. Saat bel berkontraksi, tepinya tampak melebar ke luar.

Setiap ubur-ubur terdiri atas lapisan bel dalam dan luar, rok lembut, 20 tentakel setipis rambut, dan 4 lengan oral berumbai. Bel berkontraksi secara berkala, sementara rok, tentakel, dan lengan oral bergerak mengikuti sistem fisika pegas Verlet yang stabil — jangan gunakan animasi rekaman. Semua gerakan berjalan pada satu jam fisika terpadu; batasi interval frame yang besar dan gunakan sublangkah yang cukup agar simulasi tidak menyimpang atau bergeser dari tempatnya selama berjalan lama.

Tambahkan kaustik lembut, tirai cahaya volumetrik semu, dan plankton berkelip pada latar belakang, yang dirender dengan bloom lembut dan pemetaan rona ACES untuk nuansa pencahayaan laut dalam. Tangani pengurutan lapisan transparan dan anti-aliasing dengan tepat agar tentakel tetap tersambung dan tajam. Saat mouse mendekati ubur-ubur, denyutnya semakin cepat, cahayanya semakin intens, dan tentakelnya mendapat dorongan ringan. Dukung seret mouse untuk memutar tampilan dan roda gulir untuk memperbesar atau memperkecil, dengan jarak pandang dan sudut pitch yang dibatasi. Buat setiap ubur-ubur dapat diklik. Saat diklik, hentikan gerakannya dan tampilkan kartu informasi berisi nama spesies, kedalaman habitat, serta dua fakta singkat yang ditulis untuk khalayak umum. Gunakan WebGL2 dengan model dan material prosedural. Tanpa WebGPU, model eksternal, audio, panel kontrol, maupun pergantian beberapa scene. Buat halaman web statis yang dapat langsung dijalankan, dengan dependensi dibundel secara lokal. Ikuti pendekatan visual dan fisika Aurelia, serta sertakan catatan atribusi dan lisensi untuk semua kode dan algoritme yang digunakan; jika menggunakan kembali karya asli atau algoritme kaustik Dave Hoskins, pertahankan atribusi lisensi yang sesuai.