Creative Showcase
3D Safari Simulation
Generate an interactive 3D safari experience in a single HTML file using Three.js or pure CSS 3D.
7.0
/10 · Llama 3.3 70B
Visual Quality
7.0/10
Scene composition, lighting, colors, atmosphere, animal designs
Interactivity
7.0/10
Camera controls, animal clicking/raycasting, day/night toggle, HUD
Completeness
7.0/10
All elements present, no broken features, runs without errors
Creativity
7.0/10
Interesting scene design, clever animal representations, unique touches
Generated Output
Generated by Llama 3.3 70B on . View the full interactive output below.
Live Preview
Open full pageShowcase prompt
Create a complete, self-contained HTML file that simulates a 3D safari experience in the browser. The user should feel like they're on a virtual safari drive. Requirements: - Single HTML file — include Three.js from CDN (unpkg or jsdelivr) for 3D rendering, or use pure CSS 3D transforms if you prefer - A ground plane with grass texture (procedural or simple colored plane) - At least 3 different animals placed around the scene (e.g., lion, elephant, giraffe) — they can be geometric/low-poly shapes that are recognizable - Trees or vegetation scattered around the landscape - A sky with a sun or dynamic lighting - First-person camera that the user can rotate with mouse drag (orbit or free-look) - WASD or arrow keys to move the camera through the terrain - An on-screen HUD overlay showing "Safari Drive — Serengeti" and basic instructions - Day/night cycle toggle button (shifts lighting from warm daylight to cooler night) - Animal info popup: when the user clicks on an animal (raycasting), show a small overlay card with the animal's name and a fun fact - Ambient sound toggle (optional — can be silent by default) Make it engaging and atmospheric — the user should enjoy exploring the scene.