FHILY👑's banner

FHILY👑

@Oluwaphilemon1 • 6,152 subscribers

Defi + Content Creator + Entertainment + Claude News + AI

Shorts

You don't need Claude Fable 5 or GPT-5.6 I built with Claude 👇 Drifting particles + pulsing sound rings, the techniques: 1. Flow field = each particle reads a Simplex noise field for which way to drift, organic not random. 2. GPGPU = thousands of particles updated on the GPU in a texture, 60fps on a phone. 3. Audio-reactive shader = the rings pulse to the track frequency data. 4. Selective bloom = only the bright parts glow. Lenis + GSAP + Three.js. Save this 🔊

You don't need Claude Fable 5 or GPT-5.6 I built with Claude 👇 Drifting particles + pulsing sound rings, the techniques: 1. Flow field = each particle reads a Simplex noise field for which way to drift, organic not random. 2. GPGPU = thousands of particles updated on the GPU in a texture, 60fps on a phone. 3. Audio-reactive shader = the rings pulse to the track frequency data. 4. Selective bloom = only the bright parts glow. Lenis + GSAP + Three.js. Save this 🔊

462,463 görüntüleme

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

342,430 görüntüleme

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 this

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 this

380,219 görüntüleme

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

324,492 görüntüleme

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 🚀

355,092 görüntüleme

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

149,179 görüntüleme

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

166,927 görüntüleme

How I build with Claude Fable 5 1. CSS position sticky = how a product follows you down the page 2. Monospace fonts = instantly signal raw and authentic 3. CSS object-fit cover = full bleed photography fills any screen 4. GSAP ScrollTrigger = pins product while background scrolls position fixed + transform = floating centered label 5. CSS grid + z-index = editorial depth flat sites lack Save this 🏔️

How I build with Claude Fable 5 1. CSS position sticky = how a product follows you down the page 2. Monospace fonts = instantly signal raw and authentic 3. CSS object-fit cover = full bleed photography fills any screen 4. GSAP ScrollTrigger = pins product while background scrolls position fixed + transform = floating centered label 5. CSS grid + z-index = editorial depth flat sites lack Save this 🏔️

117,941 görüntüleme

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 🚀

135,666 görüntüleme

How I built with Claude 👇 1. CSS linear-gradient animated backgrounds create that deep blue oceanic atmosphere with zero images 2. Intersection Observer API staggers each section headline in as users scroll through the content 3.Use a fixed sticky nav with backdrop-filter blur signals authority and keeps users oriented 4. Save this if you want a corporate site that makes billion dollar clients take you seriously 🌐

How I built with Claude 👇 1. CSS linear-gradient animated backgrounds create that deep blue oceanic atmosphere with zero images 2. Intersection Observer API staggers each section headline in as users scroll through the content 3.Use a fixed sticky nav with backdrop-filter blur signals authority and keeps users oriented 4. Save this if you want a corporate site that makes billion dollar clients take you seriously 🌐

135,817 görüntüleme

How i build with Claude + Higsfield 🐉 Step 1: generate all scenes in Higsfield as MP4 Step 2: paste URLs into Claude, say embed as scroll-triggered WebGL textures Step 3: Claude writes Three.js, Higsfield supplies the visuals Step 4: tell Claude trigger each video at 25% 50% 75% scroll Step 5: ask Claude to wrap hero video in autoplay muted loop Step 6: Higsfield does the art, Claude does the code Save this

How i build with Claude + Higsfield 🐉 Step 1: generate all scenes in Higsfield as MP4 Step 2: paste URLs into Claude, say embed as scroll-triggered WebGL textures Step 3: Claude writes Three.js, Higsfield supplies the visuals Step 4: tell Claude trigger each video at 25% 50% 75% scroll Step 5: ask Claude to wrap hero video in autoplay muted loop Step 6: Higsfield does the art, Claude does the code Save this

81,853 görüntüleme

How I use Claude for 2D website animations 👇 1. Ask Claude to create CSS keyframes for floating or bounce effects 2. Use Claude to write fade-up animations on scroll 3. Ask Claude for parallax code for backgrounds 4. Generate hover effects like glow, scale, rotate buttons 5. Use Claude to animate text word by word 6. Paste the code, adjust timing, launch Save this tutorial 🚀

How I use Claude for 2D website animations 👇 1. Ask Claude to create CSS keyframes for floating or bounce effects 2. Use Claude to write fade-up animations on scroll 3. Ask Claude for parallax code for backgrounds 4. Generate hover effects like glow, scale, rotate buttons 5. Use Claude to animate text word by word 6. Paste the code, adjust timing, launch Save this tutorial 🚀

96,471 görüntüleme

Claude Fable 5 and GPT-5.6 are cooked already… Sonnet 5 vs Opus 4.8 on another agentic video pipeline. Both generated a storyboard with GPT Images 2.0, then fed it into Seedance 2.0, all through Higgsfield MCP on Claude. Same quality, but each directed Seedance 2.0 completely differently.

Claude Fable 5 and GPT-5.6 are cooked already… Sonnet 5 vs Opus 4.8 on another agentic video pipeline. Both generated a storyboard with GPT Images 2.0, then fed it into Seedance 2.0, all through Higgsfield MCP on Claude. Same quality, but each directed Seedance 2.0 completely differently.

34,304 görüntüleme

How I built with Lovable 👇 1. Start with midnight blue + soft sand feels cinematic instantly 2. Tell Lovable to make it a single scroll page with scene transitions 3. Add a lone figure walking through a dreamy 3D landscape 4. Each scroll section reveals a new sleep science fact 5. Use CSS fluid shapes for organic background movement 6. Wide spacing + slow fade-ins let the content breathe 7. Deploy in one click no code, no agency, no $10k budget

How I built with Lovable 👇 1. Start with midnight blue + soft sand feels cinematic instantly 2. Tell Lovable to make it a single scroll page with scene transitions 3. Add a lone figure walking through a dreamy 3D landscape 4. Each scroll section reveals a new sleep science fact 5. Use CSS fluid shapes for organic background movement 6. Wide spacing + slow fade-ins let the content breathe 7. Deploy in one click no code, no agency, no $10k budget

96,872 görüntüleme

How I built with Claude 👇 Prompt: "Design an agency site where services are presented as supermarket product packaging in 3D" Use Three.js with WebGL to render all products in real time in the browser Use Blender to model the packaging then export as GLTF to load in Three.js Use GSAP for the smooth product rotation and hover interactions Save this if you want a portfolio that makes clients feel they are buying something premium 🛒

How I built with Claude 👇 Prompt: "Design an agency site where services are presented as supermarket product packaging in 3D" Use Three.js with WebGL to render all products in real time in the browser Use Blender to model the packaging then export as GLTF to load in Three.js Use GSAP for the smooth product rotation and hover interactions Save this if you want a portfolio that makes clients feel they are buying something premium 🛒

76,046 görüntüleme

How I built with Claude 👇 1. Structure it as 6 individual 3D scenes per product 2. Design each scene as an intimate alcove with its own world 3. Use scroll to move between scenes 4. Add hidden gestures that reward curious users 5. Pair a custom soundscape to each environment 6. Let the 3D render carry the story 7. This is how luxury brands sell without selling 8. Save this if you want websites that feel like walking into a store 🏆

How I built with Claude 👇 1. Structure it as 6 individual 3D scenes per product 2. Design each scene as an intimate alcove with its own world 3. Use scroll to move between scenes 4. Add hidden gestures that reward curious users 5. Pair a custom soundscape to each environment 6. Let the 3D render carry the story 7. This is how luxury brands sell without selling 8. Save this if you want websites that feel like walking into a store 🏆

75,220 görüntüleme

I found a site you copy prompts for your motion websites design Here: Copy the prompt and paste on lovable or any ai you use to create websites You are welcome

I found a site you copy prompts for your motion websites design Here: Copy the prompt and paste on lovable or any ai you use to create websites You are welcome

32,453 görüntüleme

How i build with Claude👇 1. CSS blend-mode = text over photography in one line 2. GSAP ScrollTrigger = hero pins while content scrolls over it 3. Splitting.js = title arrives letter by letter on load 4. video autoplay muted = forest feels alive without user interaction 5. CSS clamp() = typography scales mobile to desktop zero media queries 6. linear-gradient overlay = text readable at any screen brightness Save this

How i build with Claude👇 1. CSS blend-mode = text over photography in one line 2. GSAP ScrollTrigger = hero pins while content scrolls over it 3. Splitting.js = title arrives letter by letter on load 4. video autoplay muted = forest feels alive without user interaction 5. CSS clamp() = typography scales mobile to desktop zero media queries 6. linear-gradient overlay = text readable at any screen brightness Save this

31,879 görüntüleme

Claude Mythos is Insane! If I were asked in an interview, "What do you consider the pinnacle of design skill?", that would be my exact answer. To become a reference. For me, the ultimate compliment is when your work becomes a benchmark for someone else. I want people to point at my projects, bring them to other designers, and say, "We want it exactly like this." P.S. If you want the prompt to create a design in this style, let me know in the comments!

Claude Mythos is Insane! If I were asked in an interview, "What do you consider the pinnacle of design skill?", that would be my exact answer. To become a reference. For me, the ultimate compliment is when your work becomes a benchmark for someone else. I want people to point at my projects, bring them to other designers, and say, "We want it exactly like this." P.S. If you want the prompt to create a design in this style, let me know in the comments!

14,714 görüntüleme

I just spent roughly 15 hours on this navigation component so you don’t have to. and just dropped into the vault 🎉 one thing i really like about this one is the morphing motion, but also something people often overlook: accessibility. it’s fully responsive, keyboard accessible, and built so everyone can actually use it. also, no dependencies. Just vanilla HTML, CSS and JavaScript. you can test and play around with it, link in the comments ↓

I just spent roughly 15 hours on this navigation component so you don’t have to. and just dropped into the vault 🎉 one thing i really like about this one is the morphing motion, but also something people often overlook: accessibility. it’s fully responsive, keyboard accessible, and built so everyone can actually use it. also, no dependencies. Just vanilla HTML, CSS and JavaScript. you can test and play around with it, link in the comments ↓

11,733 görüntüleme

Videos

Anya Rossi

sweetdream.ai

SweetDream.ai•Sponsored•Livecam

Watch Anya Live

Anya is streaming live right now! Join her private show and enjoy exclusive content.

Exclusive private shows

1.2k viewers online

Private Show

Join now for exclusive access

Free preview available • Premium content

Сlaude Design is so cracked at marketing. 🤯 and anyone can achieve the same results. Here's the prompt ↓

Сlaude Design is so cracked at marketing. 🤯 and anyone can achieve the same results. Here's the prompt ↓

218,572 görüntüleme • 3 ay önce

Built this with just 3 tools; Materials¹ → Create 3D visuals Seedance 2.0 → Animation Claude Code → Build

Built this with just 3 tools; Materials¹ → Create 3D visuals Seedance 2.0 → Animation Claude Code → Build

50,427 görüntüleme • 1 ay önce

changed how I design with AI. I show how to build faster by adding a design system directly into the prompt, importing any website URL to get a strong starting point, then polishing everything in my own style. I also mix it with components and skills to keep the design consistent and more unique. GPT-5.5 cloning websites is honestly crazy good. The result can get very close to the original, then you can refine it and make it your own. Full breakdown in the comments.

changed how I design with AI. I show how to build faster by adding a design system directly into the prompt, importing any website URL to get a strong starting point, then polishing everything in my own style. I also mix it with components and skills to keep the design consistent and more unique. GPT-5.5 cloning websites is honestly crazy good. The result can get very close to the original, then you can refine it and make it your own. Full breakdown in the comments.

57,007 görüntüleme • 1 ay önce

Everyone is talking about Claude Design… but I keep going back to Gemini. Gemini 3.1 Pro is seriously impressive when it comes to motion design. I actually want to try Claude Design, but after only two prompts, I was already running out of credits. If you care about anti AI slop, Gemini is still winning. With a single prompt, it can transform a static HTML layout into dynamic, polished motion graphics.

Everyone is talking about Claude Design… but I keep going back to Gemini. Gemini 3.1 Pro is seriously impressive when it comes to motion design. I actually want to try Claude Design, but after only two prompts, I was already running out of credits. If you care about anti AI slop, Gemini is still winning. With a single prompt, it can transform a static HTML layout into dynamic, polished motion graphics.

25,019 görüntüleme • 28 gün önce

Created a personal AI dashboard with Claude Fable 5! This entire dashboard is a one shot using my design style on Claude Design. It has a bunch of active widgets that are interactive.

Created a personal AI dashboard with Claude Fable 5! This entire dashboard is a one shot using my design style on Claude Design. It has a bunch of active widgets that are interactive.

28,094 görüntüleme • 1 ay önce

Hey Claude, redesign my landing page and add some 3D depth to it 🔥 — Claude Opus 4.8 ultracode

Hey Claude, redesign my landing page and add some 3D depth to it 🔥 — Claude Opus 4.8 ultracode

15,155 görüntüleme • 1 ay önce

Daha fazla içerik yok.