Blenra LogoBlenra
Optimized for: Gemini / ChatGPT / Claude
#GSAP

Advanced AI Prompt for Three.js and GSAP Scroll Sync

Customize the variables below to instantly engineer your prompt.

Required Variables

gsap-threejs-scroll-sync-portfolio.txt
As a 3D web developer, integrate GSAP ScrollTrigger with a Three.js scene. Create a function that maps the scroll progress of a page to the [ROTATION_AXIS] rotation of the [MESH_NAME]. As the user scrolls, the [MODEL_VARIABLE] should rotate exactly 360 degrees over the length of the viewport. Ensure the update is handled within the GSAP 'onUpdate' callback to maintain synchronization with the rendering loop. Include a 'scrub' value for high-precision movement.

Example Text Output

"The AI generates a bridge between the GSAP ScrollTrigger scrub value and a Three.js object's rotation property, ensuring 60fps performance."

More Web Components Prompts

View all →

Frequently Asked Questions

What is the "Advanced AI Prompt for Three.js and GSAP Scroll Sync" prompt used for?

The AI generates a bridge between the GSAP ScrollTrigger scrub value and a Three.js object's rotation property, ensuring 60fps performance.

Which AI tools work with this prompt?

This prompt is optimized for Gemini / ChatGPT / Claude, but works great with ChatGPT, Claude, Gemini, and other large language models. Simply copy it and paste it into your preferred AI tool.

How do I customize this prompt?

Use the variable fields above to fill in your specific details. The prompt will auto-update as you type, ready to copy instantly.

Is this prompt free?

Yes! All prompts on Blenra are free to copy and use immediately. No account required.