正在加载视频...

视频加载失败

加载此视频时出现问题。这可能是由于临时网络问题，或视频可能不可用。

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... show more

FHILY👑

7,765 subscribers

380,219 次观看 • 1 个月前 •via X (Twitter)

艺术教育科学技术

Anya Rossi• Live Now

Private livecam show

0 条评论

暂无评论

原始帖子的评论将显示在这里

相关视频

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 🚀

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 🚀

FHILY👑

135,666 次观看 • 1 个月前

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 have

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 have

FHILY👑

324,492 次观看 • 1 个月前

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 have

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 have

FHILY👑

341,413 次观看 • 1 个月前

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 this

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 this

FHILY👑

149,179 次观看 • 28 天前

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 🚀

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 🚀

FHILY👑

346,601 次观看 • 2 个月前

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 :)

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 :)

Framer University

18,691 次观看 • 10 个月前

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 webcam

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 webcam

AA

28,255 次观看 • 2 个月前

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 👇

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 👇

ZEUS⚡️

533,942 次观看 • 4 天前

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 this

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 this

FHILY👑

166,927 次观看 • 1 个月前

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

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

Juan Guillermo Cruz

88,527 次观看 • 2 年前

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

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

Alvaro Cintas

564,507 次观看 • 2 年前

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?

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?

Oleg Bilozor

72,608 次观看 • 3 个月前

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. :)

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. :)

Framer University

20,854 次观看 • 1 年前

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.

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.

DogeDesigner

7,485,252 次观看 • 8 个月前

Exito 3D website full scroll animation web design ⬇️ The design of this site was done for a 1 month subscription

Exito 3D website full scroll animation web design ⬇️ The design of this site was done for a 1 month subscription

Alex Bender

24,229 次观看 • 1 年前

What if anatomy explorers felt alive? This 3D dog, including the skeleton, organs and rig, was generated with ai and reacts to the cursor in real time with head tracking and tail movement. - Used GPT Images 2 for consistency - Omma AI for 3D generation and code using Three.js Lmk if you’d like to try it!

What if anatomy explorers felt alive? This 3D dog, including the skeleton, organs and rig, was generated with ai and reacts to the cursor in real time with head tracking and tail movement. - Used GPT Images 2 for consistency - Omma AI for 3D generation and code using Three.js Lmk if you’d like to try it!

Gábor Pribék

203,898 次观看 • 1 个月前

For the facial animations in my game, I use a technique that yields results similar to L.A. Noire. To keep it simple: I first generate a facial animation video using AI like LTX 2. Then, I create a video depth map from that animation and project it onto a face mask. Using vertex displacement, the depth map dynamically deforms the face as the character speaks. The result looks good in standalone VR. I actually created this workflow long time ago:

For the facial animations in my game, I use a technique that yields results similar to L.A. Noire. To keep it simple: I first generate a facial animation video using AI like LTX 2. Then, I create a video depth map from that animation and project it onto a face mask. Using vertex displacement, the depth map dynamically deforms the face as the character speaks. The result looks good in standalone VR. I actually created this workflow long time ago:

Alex

48,189 次观看 • 4 个月前

They using a lot of 3D and weird animation this episode. That 6 month break really was for nothing

They using a lot of 3D and weird animation this episode. That 6 month break really was for nothing

Leo | Sengoatku No. 1

163,803 次观看 • 10 个月前

introducing: text decrypt scroll effect for Framer add this to reveal text with a sleek decryption animation as you scroll. comment "DECRYPT" and I'll send you the component :)

introducing: text decrypt scroll effect for Framer add this to reveal text with a sleek decryption animation as you scroll. comment "DECRYPT" and I'll send you the component :)

Framer University

16,369 次观看 • 1 年前

Fantastic work Vinicius Araújo! 😍 Vinicius Araújo is a Portugal-based Digital Designer with a passion for 3D and motion. He created this caramel animation using Flip in #Houdini.

Fantastic work Vinicius Araújo! 😍 Vinicius Araújo is a Portugal-based Digital Designer with a passion for 3D and motion. He created this caramel animation using Flip in #Houdini.

Houdini.School

22,281 次观看 • 2 年前