Garden Automation Tutorial

1 test · 1 finished runs (0 agent, 1 raw one-shot) · 1 live demo

The prompt

Build a Three.js scene: An animated, step-by-step 3D explainer titled "Automating Your Raised Garden Beds". A small backyard with two or three wooden raised beds of soil sits on a lawn beside a house wall with an outdoor tap. The tutorial plays through clear steps, each with a short on-screen caption (step number, title and one or two sentences) and its own automatic camera move to frame what is being explained: 1) the water source: the outdoor tap with a backflow preventer and a pressure regulator; 2) the timer/controller mounted by the tap, with a small display; 3) the main supply line running to the beds; 4) drip lines laid along each bed, with animated water droplets dripping from the emitters; 5) soil moisture sensors pushed into the soil, showing a live moisture reading that rises as the drip runs; 6) a small solar panel on a stake that powers the controller, with a subtle energy-flow animation; 7) the finished system running on its own over a day-night cycle while the plants (lettuce, tomatoes, herbs) visibly grow from seedlings to full size. Each new component animates into place (drops in, slides or unrolls) when its step begins, and highlighted parts glow gently. Controls: Play/Pause, Previous and Next step buttons, and a row of step dots showing progress; it auto-advances when playing. OrbitControls let the viewer look around, and the tour camera resumes on the next step. Everything is built in code from Three.js geometry, materials and shaders; no external models, textures or fonts. The scene must visibly animate from the moment it loads and run in a browser with software WebGL (no GPU). Deliver ONE self-contained HTML file; load Three.js only through an import map from https://cdn.jsdelivr.net/npm/three@0.170.0/build/three.module.js (addons from https://cdn.jsdelivr.net/npm/three@0.170.0/examples/jsm/), with no other external requests (no image, texture, model, font or audio files): build every shape and texture in code. It must work when opened directly from disk in a current desktop or mobile browser, fit the window responsively, and run without console errors. Output ONLY the complete HTML file, starting with <!DOCTYPE html> and ending with </html>, with no explanation or markdown fences.