Interactive Zen Garden HTML Animation
A prompt for creating an interactive 3D zen garden in a single HTML file using Three.js/Canvas. The animation features dynamic sand raking where dragging the cursor cuts grooves into a heightmap, and a time-of-day switch that relights the scene with realistic shadows.
The creative result
Reference prompt
An edited reference based on this example. Adapt it to your subject; the creator’s post is linked in the source panel.
“Make a rakeable zen garden in one HTML file. Use a 1536-pixel sand heightmap over a 440×440 grid, updating it as the cursor draws five grooves and six ridges along each stroke. Arrange five moss-covered rocks, two stone lanterns, and a maple with 420 leaves around the sand. Add a time-of-day switch, with a low golden-hour sun that makes the raked grooves cast shadows. Review the scene for moss leaking through sand, blocky rock shapes, and lanterns falling outside the frame.”
How to create in PagePop
Choose an assistant, describe your needs, and let PagePop create with you. Refine the work through conversation, then download it.
Choose the right assistant
Explore professional assistants across industries, or find inspiration in the extensive case library.
Describe what you need
Tell your assistant whether you need images, videos, PPT presentations, documents, or web pages. Add reference images or materials as needed.
Let PagePop select models and create
PagePop selects suitable models and tools for your goal to create your work.
Refine and download
Keep adjusting the content and look in the same conversation. Download your work when you are happy with it.
Start with your own words
Use this real prompt as a starting point, change anything you want, and let PagePop choose the best way to create it.
Frequently asked questions
How can I adapt this Video example to my own project?
Start with the reference prompt for “Interactive Zen Garden HTML Animation”. Replace the subject, style, and aspect ratio, and add your reference images or supporting materials. Keep the structure you want to explore, remove requirements that do not apply, and refine the result.
Is browsing and copying prompts free?
Browsing the collection and copying prompts is 100% free. You can also use PagePop for free. See the pricing page for current prices and credit rules.
What is PagePop, and what can it do?
PagePop is a conversational AI creation platform. Describe what you need in natural language to create images, videos, presentations, documents, and web pages. PagePop selects suitable models and tools, and you can keep refining the work in the same conversation.
More real prompt examples
Interactive Turbofan Engine
“Build an interactive Three.js turbofan that can be taken apart in the browser. Label the airflow stages from intake and compression through combustion and exhaust. Show the fan's bypass flow, the compressor's pressure i…”
Deterministic Frame-Based Video Rendering
“Animate an X-ray-style butterfly using a fixed 1000×1080 canvas and frame-number-driven drawing. Build a 720-frame, 12-second loop in which draw(f) gives the same image whenever that frame is requested. Avoid clocks, ti…”
WebGPU Ocean Scene in HTML
“Build an ocean scene that runs in the browser as a single HTML file using WebGPU. Drive the sea surface with FFT waves, add whitecaps, and place it under a realistic sky. Include WASD movement so the viewer can explore…”