Interaktif

Sketsa Loop Jadi Wahana Nyata

Sketsa lintasan kereta luncur di kertas krem dihitung dulu: kursor menggeser tinggi awal dari 12 m ke 20 m sampai syarat lolos loop terpenuhi, lalu tombol Main mengubah kertas menjadi simulasi fisika 3D. Kereta meluncur melewati loop dan bukit kecil, berhenti di rem, dan hasilnya dicocokkan dengan prediksi di kertas.

Interaktif · Three.js, SVG, CSS, Fisika · 20 detik · 1280×720

Prompt

Buat demo interaktif satu file HTML berjudul "Sketsa Loop #1" yang terlihat seperti rekaman layar sebuah aplikasi di jendela browser generik (tab, bilah alamat localhost) di atas desktop biru buram. Babak 1, kertas: latar krem bergaris kisi tipis, lintasan kereta luncur digambar tangan dengan tinta (tanjakan awal, turunan curam, loop berjari-jari 6 m, bukit kecil, zona rem, bendera finis), tiang penyangga diarsir, garis tanah dengan skala 0 sampai 90 m. Anotasi pena merah: garis ukur tinggi awal h, lingkaran putus-putus loop dengan r = 6 m, syarat di puncak loop v ≥ √(g·r) = 7,7 m/s, dan saat h terlalu rendah sebuah lintasan jatuh putus-putus berlabel "jatuh di sini". Kartu spek bertulisan tangan di kanan atas memuat slider tinggi awal, massa, gesekan, syarat lolos h ≥ 2,5·r = 15 m, dan prediksi kecepatan di puncak loop. Kursor otomatis menyeret slider dari 12 m ke 20 m, sketsa turunan ikut berubah langsung, tanda ✗ berganti ✓ "lolos, v puncak ≈ 12,5 m/s", lalu kursor menekan tombol "▶ Main". Babak 2: kertas memudar dan lintasan yang sama persis muncul sebagai scene Three.js dengan kamera samping yang sejajar sketsa, lalu warna berubah dari tinta ke nyata (rel merah, tiang putih, kereta biru dua gerbong), rumput bernuansa belang halus, langit, bukit berkabut tipis dan pohon low-poly tumbuh dengan bayangan kontak lembut di kaki tiang dan pohon, kamera bergerak ke sudut tiga perempat dan mengikuti kereta. Fisika dihitung dari kekekalan energi dengan kehilangan gesekan kecil dan rem di akhir; panel "simulasi langsung" menampilkan waktu, kecepatan, tinggi, batang energi potensial, kinetik, dan panas gesekan, serta kecepatan nyata di puncak loop. Babak 3: kereta berhenti di rem sekitar detik ke-15, panel simulasi diganti kartu hasil di kanan atas yang membandingkan prediksi kertas dengan hasil simulasi (12,5 vs 12,1 m/s, selisih 3%) dan cap merah "LOLOS", sementara kamera bergeser agar kereta dan gapura finis tetap terlihat. Teks keterangan bergaya label tulisan tangan di bawah layar: "Langkah 1: hitung dulu sebelum membangun.", "Langkah 2: tekan Main. Kertas jadi fisika.", "Langkah 3: cocokkan prediksi dengan simulasi." Font Kalam dan Caveat, zoom kamera halus ala video demo yang diedit, semua teks berbahasa Indonesia.

Video Interaktif lainnya

  1. AI Belajar Main CongklakInteraktif20 dtkAI Belajar Main CongklakSebuah AI bermain congklak dengan biji kerang: di permainan pertama ia kalah telak 29 : 69, lalu di permainan ke-1.280 ia membalik skor lewat tembakan di langkah terakhir dan menang 50 : 48. Kursor, genggaman biji, dan bar peluang pilihannya bergerak sendiri sampai penghitung melonjak ke 2 juta permainan dan rasio menangnya mencapai 97%.SVG · Bisa dimainkan
  2. Trailer Gim Kampung Nelayan TerapungInteraktif20 dtkTrailer Gim Kampung Nelayan TerapungTrailer 20 detik untuk gim manajemen fiktif Teluk Lentera: rumah panggung bermunculan di atas laut malam, kursor otomatis memilih seorang nelayan dan membangun jemuran ikan lewat HUD gim, lampu bagan menyala dan jaringnya terangkat penuh ikan, lalu perahu berlentera pulang ke teluk sebelum logo muncul.Three.js · Canvas 2D · Shader
  3. Senja Biru di Pangkalan MarsInteraktif20 dtkSenja Biru di Pangkalan MarsGame jalan-jalan orang ketiga low-poly: seorang astronot bersetelan putih menyusuri pangkalan riset di Mars pada sore hari, memindai kubah hidroponik, melewati kru yang membersihkan panel surya dan rover yang melintas menerbangkan debu, berlutut mengambil sampel batuan, lalu tiba di bibir kawah saat matahari kecil terbenam berhalo biru dan Bumi tampak sebagai titik terang. Label lokasi, pil interaksi, daftar tugas, dan tombol yang menyala menunjukkan autopilot yang sedang bermain.Three.js · WebGL · Shader
  4. Regu Pemadam Hutan PikselInteraktif20 dtkRegu Pemadam Hutan PikselGame pixel art yang memainkan dirinya sendiri: setelah memilih peran di layar PILIH PERAN REGU, seorang penyemprot dan seorang pilot drone memadamkan titik api di hutan pinus pada malam berasap dengan selang, tirai air, bom air, dan hujan buatan. Langit berubah menjadi fajar berpelangi, burung terbang selamat, dan kartu MISI SELESAI muncul dengan tiga bintang.Canvas 2D · Pixel art · Partikel
ArtikelSusun brief