I created this using Claude + 3D animation: 1.... Ask Claude for a scroll-based cinematic animation pla 2. Generate prompts for depth, parallax, and camera movement 3. Install Three.js + GSAP + ScrollTrigger 4. Use scroll to control zoom, scale, and scene transitions 5. Add layered images for 3D depth illusion 6. Apply smooth easing, lighting, and shadows for realism 7. Refine until it feels like one continuous scene Save thisshow more

How I use Claude to build luxury real estate... websites 👇 • Create a cinematic luxury real estate experience • Use fullscreen hero sections + smooth scroll • Add layered visuals + parallax for depth • Keep typography minimal and premium • Use GSAP + ScrollTrigger + Lenis • Add fades, reveals, and image expansion on scroll • Include subtle hover + cursor interactions • Keep motion slow, smooth, Save this 🚀show more

How I built with Claude 👇 1. Prompt: "Build... a storytelling website where each scroll section reveals a new chapter with fluid color transitions" 2. Use Three.js for the painted texture background that reacts to cursor 3. Prompt: "Add GSAP ScrollTrigger so each section animates in as a cinematic scene" 4. Use Lenis.js for that buttery smooth scroll that premium sites haveshow more

How I built with Claude 👇 1. Prompt: "Build... a storytelling website where each scroll section reveals a new chapter with fluid color transitions" 2. Use Three.js for the painted texture background that reacts to cursor 3. Prompt: "Add GSAP ScrollTrigger so each section animates in as a cinematic scene" 4. Use Lenis.js for that buttery smooth scroll that premium sites haveshow more

How I build with Claude Fable 5 1. Three.js... = rotate and explore any product in 3D in the browser 2. Color swatches = swap a material value to change the model live 3. CSS radial-gradient = premium spotlight glow zero images 4. GSAP ScrollTrigger = scroll turns one screen into a full story 5. Monospace fonts = signal precision and luxury instantly 6. AudioContext = ambient sound toggle in one call Save thisshow more

How I built an Anime.js-style site with Claude 👇... • Ask Claude to plan a minimal interactive website with smooth motion • Install Anime.js → "npm i animejs" • Use Claude to generate timelines, staggered text, and hover animations • Add smooth SVG, scroll, and cursor interactions with Anime.js • Keep UI minimal so motion becomes the focus • Use easing + timing to make animations feel fluid and premium Save this 🚀show more

introducing: interactive 3d image distortion for Framer add a... smooth distortion effect to your images that reacts to cursor movement—perfect for giving depth and interactivity to your designs. comment "DISTORT" and i’ll send you the component :)show more

improving my 3D hand tracking template by adding depth-anything-v2... using mediapipe for X/Y movement and depth-anything for Z movement here i'm controlling a threejs scene in realtime with input from a single webcamshow more

FABLE 5 + HIGGSFIELD CAN BUILD A $35,000 ANIMATED... WEBSITE. IN ONE AGENTIC SESSION. FOR ~$12 IN CREDITS. stop paying a web studio $6,000-$35,000. stop wiring GSAP, Lenis, and frame extraction by hand. Claude Code writes it. Higgsfield renders it. WHAT THE BUILD PRODUCES: → a fully animated, scroll-driven site → cinematic motion clips from 30+ generative models → GSAP ScrollTrigger timelines - zero hand-coded keyframes → Lenis smooth-scroll, tuned pacing → automated frame extraction + asset optimization → six cinematic effects baked in: film grain, particles, vignette, glass cards, color tints, scroll pacing → responsive layout + copy THE STACK: → Claude Code - concept, scaffolding, scroll code, QA → Higgsfield (MCP) - hero clips, transitions, ambient loops, thumbnails → GSAP + Lenis - the motion layer, written for you CONNECT HIGGSFIELD (MCP): add it as a custom connector in Claude Code: mcp_servers: higgsfield: url: " one OAuth flow. done. now Claude can generate and pull clips directly - no manual exporting. WHAT TO PROMPT: concept + scroll: "read this brief, script the scroll - what the visitor feels at second 3, 15, 40. scaffold the site with GSAP ScrollTrigger + Lenis." motion assets: "generate the hero sting and one b-roll clip per section from the story. 3–5s, high-res." polish pass: "bake in film grain, particles, vignette, glass cards, color tints, scroll pacing. no config." QA: "check load speed, mobile breakpoints, and whether the scroll actually lands. rewrite whatever doesn't." WHAT THIS REPLACES: → web studio build: $6,000-$35,000+ → motion artist: $800-2,000/project → front-end dev: $2,000-10,000/project → weeks of handoffs: gone Fable 5 + Higgsfield: a subscription + a few dollars of credits. one session. SETUP IN 10 MINUTES: - install Claude Code - add the Higgsfield MCP + authenticate - drop your brief + references - let it scaffold, generate, and animate in one pass - preview, send fixes in plain English, ship the pipeline was the moat. it just became a prompt. Follow me, comment "WEB" and I'll send you the full step-by-step Playbook. full breakdown in the article 👇show more

motion designers are in serious danger, here is why... an AI agent can now model a 3D scene in Blender, animate a website and render a finished MP4. you describe it, the agent builds it. three repos doing exactly that: -> HyperFrames: write HTML, get a video. made by HeyGen for AI agents. ask for a 10-second product intro with a fade-in title and background music, and the agent plans it, animates it and renders the MP4 -> MCP for Blender: connects Blender to Claude or any other model. the agent creates objects, builds scenes and edits them in real 3D while you watch -> GSAP skills: the official skills that teach coding agents to animate the web properly with GSAP. timelines, scroll effects, the stuff premium landing pages are made of the setup for HyperFrames in Claude Code is two lines: claude plugin marketplace add heygen-com/hyperframes claude plugin install hyperframes@hyperframes then just type /hyperframes:hyperframes and describe your video. the stack in one line: Blender for the 3D, GSAP for the motion, HyperFrames for the final render. bookmark this before your next client asks for a promo video.show more

This is so cool! I had to try it... with Thrixel. Fully playable after 1 /goal prompt to Claude using Thrixel MCP. Then I had more fun ideas for follow-up prompts. Claude used Thrixel to create and iterate on the 3D assets, then assembled the scene and wired up the gameplay.show more

FABLE 5 + HIGGSFIELD TURN A $35,000 ANIMATED SITE... INTO A ONE-SESSION, $12 BUILD. HERE'S EXACTLY HOW. a studio runs this across four people and three weeks. you run it across one chat window and one afternoon. THE BUILD, STAGE BY STAGE: STAGE 1 - THE CONCEPT Claude reads your brief and scripts the scroll before a line of code exists - what the visitor feels at second 3, 15, 40. prompt: "read this brief. script the scroll beat by beat, then scaffold the project with GSAP ScrollTrigger + Lenis." STAGE 2 - THE VISUALS (Higgsfield) every hero shot, transition, and ambient loop comes out of 30+ generative models - matched to the story, not pulled from a stock library. prompt: "generate the hero sting and one b-roll clip per section. 3-5s, high-res, cinematic." STAGE 3 - THE MOTION (Claude Code) Claude writes the ScrollTrigger timelines and Lenis smooth-scroll, extracts frames, optimizes every asset. zero hand-coded keyframes. prompt: "wire the scroll: pin the hero, scrub the video, reveal each section on scroll. keep it 60fps on mobile." STAGE 4 - THE POLISH six cinematic effects baked in, no config: film grain, particles, vignette, glass cards, color tints, scroll pacing. prompt: "bake in the cinematic layer, then QA load speed, mobile breakpoints, and whether the scroll actually lands - rewrite what doesn't." CONNECT HIGGSFIELD (MCP): add it as a custom connector in Claude Code: mcp_servers: higgsfield: url: " one OAuth flow. Claude generates and pulls clips directly - no exporting by hand. THE MATH: → what a studio charges: $6,000-$35,000+ → what it costs you: a Claude sub + a few dollars of Higgsfield credits → what it takes: 4 people + 3 weeks → 1 operator + 1 session the pipeline was the moat. it just became four prompts. Follow me, comment "MATH" and I'll send you the full step-by-step Playbook. full breakdown in the article 👇show more

How i build with Claude👇 Three.js = 360 rotatable... product zero plugin needed WebGL PointLight = UVC glow reacts to scroll position CSS scroll-snap = buttery infinite horizontal product scroll GSAP ScrollTrigger = product pins while copy scrolls alongside Lottie via lottie-web = After Effects animations play in browser Save thisshow more

I made an animation for bulma past week using... camera tracking, this time I wanted to made a new render for it 😁 #animation #3d #bulmashow more

FABLE 5 + HIGGSFIELD JUST KILLED THE $35,000 WEB... STUDIO. WEEKS AND A TEAM OF FOUR → ONE SESSION, $12. stop paying a studio $6,000-$35,000. stop wiring GSAP, Lenis, and frame extraction by hand. Claude Code writes it. Higgsfield renders it. WHAT SHIPS OUT OF ONE SESSION: → a fully animated, scroll-driven site → cinematic motion clips from 30+ generative models → GSAP ScrollTrigger timelines - zero hand-coded keyframes → Lenis smooth-scroll, tuned pacing → automated frame extraction + asset optimization → six cinematic effects, no config: film grain, particles, vignette, glass cards, color tints, scroll pacing → responsive layout + copy THE STACK: → Claude Code - concept, scaffolding, scroll code, QA → Higgsfield (MCP) - hero clips, transitions, ambient loops, thumbnails → GSAP + Lenis - the motion layer, written for you CONNECT HIGGSFIELD (MCP): add it as a custom connector in Claude Code: - mcp_servers: - higgsfield: - url: " one OAuth flow. done. now Claude generates and pulls clips directly - no manual exporting. WHAT TO PROMPT: concept + scroll: "read this brief, script the scroll - what the visitor feels at second 3, 15, 40. scaffold with GSAP ScrollTrigger + Lenis." motion assets: "generate the hero sting and one b-roll clip per section. 3-5s, high-res." polish pass: "bake in film grain, particles, vignette, glass cards, color tints, scroll pacing. no config." QA: "check load speed, mobile breakpoints, and whether the scroll actually lands. rewrite whatever doesn't." WHAT THIS REPLACES: → web studio build: $6,000-$35,000+ → motion artist: $800-2,000/project → front-end dev: $2,000-10,000/project → weeks of handoffs: gone Fable 5 + Higgsfield: a subscription + a few dollars of credits. one session. SETUP IN 10 MINUTES: - install Claude Code - add the Higgsfield MCP + authenticate - drop your brief + references let it scaffold, generate, and animate in one pass preview, send fixes in plain English, ship the pipeline was the moat. it just became a prompt. Follow me, comment "PAGE" and I'll send you the full step-by-step Playbook. full breakdown in the article 👇show more

Ok, this is amazing. I asked Claude 3 to... generate an animation of the Pythagorean Theorem and this is what it created:show more

Here are a few simple prompt tricks you can... use to make videos like this in Grok Imagine: 1) Write like a movie director Use scene verbs: “starts with” “cuts to” “camera follows” “ends with.” 2) Control the camera Mention angles: “wide shot” “overhead” “close-up” “tracking” “handheld” “low-angle” 3) Guide the speed Add words like: “smooth flow” “natural rhythm” “fast transitions” “balanced motion” 4) Set lighting Use: “soft cinematic lighting” “dramatic contrast” “realistic shadows” Finish with keywords like: "ultra-realistic cinematic" "vintage film", etc.show more

introducing: text scroll animator component for Framer use this... component to animate your text with smooth scroll-triggered effects like blur, rotation, scale, and more! comment "SCROLL" and i’ll send you the component. :)show more

Claude vs Gemini vs DeepSeek vs Grok PROMPT: Build... a production-ready 3D flight visualizer in one HTML file. Use Three.js to render a rotatable Earth and simulate real-time aircraft positions using smooth interpolation. Include polished lighting, a starfield background, and make it responsive for mobile and desktop. Which tool is the best?show more

here's how you can create videos with full camera... control using Krea Agent: - take an input image and ask the agent to create a 3D scene with it. - after the scene is created, ask it to create any camera movement you want. - finally, ask it to render the 3D video with Seedance 2.5. try it now 👇show more

From tying my laces to landing the perfect trick.... Created with Gpt Image 2 + Seedance 2.0 on WaveSpeedAI Prompt: Global Character Consistency Reference Character: A teenage boy (16–18 years old) with messy curly black hair, expressive blue eyes, a slim athletic build, wearing an oversized mustard-yellow T-shirt, navy shorts, white crew socks, and white sneakers. Maintain the exact same face, hairstyle, clothing, body proportions, colors, and ultra-realistic Pixar-inspired 3D style consistently across every scene. Scene 1 (0–2s) — Bedroom The teenage boy sits on the edge of his bed in a cozy bedroom during golden sunrise, tying his white sneakers. Warm sunlight streams through the window, posters decorate the walls, cinematic lighting, shallow depth of field, slow push-in camera, ultra-realistic Pixar-inspired 3D animation. Scene 2 (2–4s) — Final Preparation Close-up of the boy tightening his shoelaces with a determined expression. Soft golden morning light, realistic fabric textures, cinematic depth of field, smooth handheld camera movement, ultra-realistic Pixar-inspired 3D animation. Scene 3 (4–6s) — Leaving Home The boy walks out of his suburban home holding a skateboard. Warm golden-hour sunlight, long shadows across the sidewalk, peaceful neighborhood, cinematic low-angle tracking shot, ultra-realistic Pixar-inspired 3D animation. Scene 4 (6–8s) — Walking to the Skate Park The boy confidently walks down the street carrying his skateboard. Sunlight filters through the trees with subtle lens flares, smooth cinematic tracking shot, realistic environment, ultra-realistic Pixar-inspired 3D animation. Scene 5 (8–10s) — Skate Park Ride The teenage boy rides his skateboard through a colorful graffiti-covered skate park. Dynamic follow camera, energetic movement, bright cinematic lighting, realistic motion blur, ultra-realistic Pixar-inspired 3D animation. Scene 6 (10–12s) — Ollie Jump The boy performs a high skateboard ollie over a graffiti ramp. Dramatic low-angle shot, city skyline in the background, realistic physics, cinematic slow motion, ultra-realistic Pixar-inspired 3D animation. Scene 7 (12–14s) — Rooftop Sunset The boy stands on a rooftop overlooking the city skyline at sunset with his back facing the camera. Warm orange and purple sky, gentle wind moving his shirt, cinematic wide shot, emotional atmosphere, ultra-realistic Pixar-inspired 3D animation. Scene 8 (14–15s) — Emotional Close-up Extreme close-up of the boy's face. His glowing blue eyes reflect the sunset while a gentle breeze moves his curly hair. Warm golden light, shallow depth of field, emotional cinematic expression, ultra-realistic Pixar-inspired 3D animation, 8K. Style Ultra-realistic Pixar-inspired 3D animation, cinematic lighting, golden hour, volumetric sunlight, smooth camera movement, shallow depth of field, realistic textures, premium color grading, consistent character identity, 8K.show more