Instinct AI
Back to library
Luxury smartwatch Three.js landing page with animated sections 1
Gemini 3Web design

Luxury smartwatch Three.js landing page with animated sections

A detailed multi-step prompt sequence for Gemini 3 Pro to build a luxury smartwatch landing page using Three.js, Anime.js, and Tailwind, then refine it into a multi-section scrolling site with advanced animations and interactions.

Prompt
Create one HTML file for a {argument name="product_type_en" default="luxury smartwatch"} page using Three.js, Anime.js, and Tailwind. Make a 3D {argument name="main_object_en" default="watch"} model, a dark textured overlay with a round hole showing the {argument name="main_object_background_en" default="watch on beige"}, and animate the header and big numbers to slide in when the page loads.

Make the page more professional. Replace the static hole with an iris that opens on load. Add a glass dome over the {argument name="focus_area_en" default="watch face"} with reflections, improve metal materials, add mouse parallax so the {argument name="parallax_target_en" default="watch"} rotates with the cursor, and draw time and fitness rings on the {argument name="dial_area_en" default="watch face"}.

Turn the single screen into a multi-section scroll site. When the user scrolls, animate the 3D {argument name="scroll_object_en" default="watch"} to move and rotate to match each section. Keep the 3D canvas and background fixed while text scrolls over them; only the {argument name="moving_element_en" default="watch"} moves.

- fixed canvas: position the canvas
Author
@HarshithView original post
Published
Oct 30, 2025

More prompts like this

Enterprise landing page with interactive responsive design
Gemini 3

Enterprise landing page with interactive responsive design

Generate an enterprise-grade professional landing page for {argument name="business_description_en" default="[DESCRIBE YOUR BUSINESS]"}. Add interactive elements, animations, and make it fully responsive. Surprise me, be creative, and do this step by step.

@God of Prompt
Keep-inspired Chinese workout course website
Gemini 3

Keep-inspired Chinese workout course website

Build a Chinese “workout course” webpage inspired by {argument name="reference_brand_en" default="Keep"}: include a full-screen athlete hero image, transparent sticky navigation, Chinese capsule-tag categories, and a grid of Chinese course cards. Each course card corresponds to a training program; use the course styles of creators such as {argument name="instructor_examples_en" default="Pamela, Zhou Liuye, Han Xiaosi, Jojie, Liu Genghong"} as references to design Chinese titles and labels for difficulty and duration. When clicking a card, open a course preview video player within the page that strictly matches the card information. Overall, keep the design minimal yet detailed, using smooth scrolling and hover animations, soft gradients, and refined typography to create a high-end Chinese experience. Use Tailwind CSS to implement a fully responsive layout.

@老白(每日干货分享✊)
Maximalist digital hot dog startup website
Gemini 3

Maximalist digital hot dog startup website

Design a maximalist website for a fictional startup that sells {argument name="product_en" default="digital hot dogs"}. I want beautifully animated hero text with shaders that react to mouse hover, with lots of dithering and wavy, groovy gradients.

@ben

Some prompts are collected from creators on X. Copyright belongs to the original authors.