Loading video...

Video Failed to Load

There was a problem loading this video. This could be due to a temporary network issue or the video might be unavailable.

It all started with an old Three.js experiment…then I lost control. Now I can sculpt anything. Maybe a little too much. #webgl #threejs #gsap #creativecoding #generativeart

Fabio Ottaviani

4,748 subscribers

48,527 views • 1 year ago •via X (Twitter)

Science & Technology Arts #webgl #threejs #gsap #creativecoding #generativeart

Anya Rossi• Live Now

Private livecam show

11 Comments

Devo – Devon Frohne1 year ago

It's like Kai's Power Goo in 3D!

DionTrades ✪1 year ago

After losing all my savings in my early days and now having $1.2M in funding, I understand trading starts with three essentials: 📚Knowledge 🤝Community 🧠Psychology That's why I created the Market Masters Community I could easily charge $50+/month for this. For a Limited Time access is absolutely FREE:

Francesco Michelini1 year ago

Si ma stai anche calmo

murat 🍥1 year ago

link?

Fabio Ottaviani1 year ago

Maybe in the next weeks

Zaniyar | CryptoFidgets1 year ago

haha nice job. It somehow reminds of the loading screen of Super Mario 64... where you could pinch Marios nose.. are you manipulating directly the vertices or using shaders to do that?

Fabio Ottaviani1 year ago

Vertices 📐

chatrli1 year ago

congrats, it looks super and without an invasive UI that looks complicated can i play with it too?

qew Nemo1 year ago

Is this polygons, SDFs or what?

Fabio Ottaviani1 year ago

Just vertices geometry.

Stefan Vitasović1 year ago

Awesome! Next step, partner with a 3d printing studio, then profit.

Related Videos

What if your website felt like a living canvas? 💣 I built a WebGL experiment to test that idea. A reactive image grid powered by Three.js + GSAP + Webflow , where every tile bends, scales and reacts to your cursor like a soft “force field”. 🔗 Live demo: 🔗 Case study on Contra #WebGL #ThreeJS #GSAP #CreativeCoding #Webflow #InteractionDesign

What if your website felt like a living canvas? 💣 I built a WebGL experiment to test that idea. A reactive image grid powered by Three.js + GSAP + Webflow , where every tile bends, scales and reacts to your cursor like a soft “force field”. 🔗 Live demo: 🔗 Case study on Contra #WebGL #ThreeJS #GSAP #CreativeCoding #Webflow #InteractionDesign

Franco Beltramella | Webflow Expert

15,864 views • 10 months ago

Mega #GSAP Demo Thread I've finished my Circles Study and now I will share them all with you here. CodePen.IO demos for each AND little GSAP tips along the way! 👇 #GSAP #creativeCoding #JavaScript #CSS

Mega #GSAP Demo Thread I've finished my Circles Study and now I will share them all with you here. CodePen.IO demos for each AND little GSAP tips along the way! 👇 #GSAP #creativeCoding #JavaScript #CSS

Carl 💥 Creative Coding Club

10,756 views • 2 years ago

Built a browser shader to teach relativistic effects. Beaming, lensing, Doppler & redshift—live sliders. Based on Koiava's blackhole shader on Shadertoy. I wrapped it in Three.js, added GUI toggles (beaming, redshift, photon ring), Kerr spin cheat. Link in thread. Turn sound on to play with it with the interstellar soundtrack 😀 #PhysicsTwitter #ThreeJS #WebGL #GLSL #Shaders #CreativeCoding

Built a browser shader to teach relativistic effects. Beaming, lensing, Doppler & redshift—live sliders. Based on Koiava's blackhole shader on Shadertoy. I wrapped it in Three.js, added GUI toggles (beaming, redshift, photon ring), Kerr spin cheat. Link in thread. Turn sound on to play with it with the interstellar soundtrack 😀 #PhysicsTwitter #ThreeJS #WebGL #GLSL #Shaders #CreativeCoding

Lisha

16,833 views • 11 months ago

I wanted to make the full list of projects from my portfolio more interactive than just a spreadsheet, so I just made a new WebGL experiment with Three.js. ✨ See it live at

I wanted to make the full list of projects from my portfolio more interactive than just a spreadsheet, so I just made a new WebGL experiment with Three.js. ✨ See it live at

Luis Bizarro

11,176 views • 5 days ago

ㅤㅤㅤㅤㅤㅤ𝐀𝐋𝐋 𝐓𝐎𝐎 𝐖𝐄𝐋𝐋 Well, maybe we got lost in translation Maybe I asked for too much But maybe this thing was a masterpiece 'til you tore it all up Runnin' scared, I was there 𝑰 𝒓𝒆𝒎𝒆𝒎𝒃𝒆𝒓 it all too well

ㅤㅤㅤㅤㅤㅤ𝐀𝐋𝐋 𝐓𝐎𝐎 𝐖𝐄𝐋𝐋 Well, maybe we got lost in translation Maybe I asked for too much But maybe this thing was a masterpiece 'til you tore it all up Runnin' scared, I was there 𝑰 𝒓𝒆𝒎𝒆𝒎𝒃𝒆𝒓 it all too well

Rick VAI VER O AESPA ! 🍋‍🟩

11,415 views • 3 years ago

【 VTUBER LORE VIDEO 】 It all started with that website, and a little too much caffeine... But now i have a cute cat, so its okay... right? 🎨: Studio Yuraki

【 VTUBER LORE VIDEO 】 It all started with that website, and a little too much caffeine... But now i have a cute cat, so its okay... right? 🎨: Studio Yuraki

Stux �

43,459 views • 1 year ago

✨ NEW PROJECT 💤🌙 → A Digital Guide for a better sleeping quality, built from a Creative to another Creative. This project was part of the #WebflowChallenge and Contra. The project was built to explore seamless integration between Three.js (with Shaders), GSAP, and a No-Code setup in Webflow . I hope you enjoy the experience and gain valuable insights into how to improve your sleep. #VWLab #threejs #creativecoding #gsap

✨ NEW PROJECT 💤🌙 → A Digital Guide for a better sleeping quality, built from a Creative to another Creative. This project was part of the #WebflowChallenge and Contra. The project was built to explore seamless integration between Three.js (with Shaders), GSAP, and a No-Code setup in Webflow . I hope you enjoy the experience and gain valuable insights into how to improve your sleep. #VWLab #threejs #creativecoding #gsap

Victor Work

24,069 views • 11 months ago

I wanted to see what would happen if we stripped away pixels and polygons from a video, and instead tried to recreate moving footage using a single, unbroken, continuous line. Introducing SINGLETHREAD- experimental web app that transforms any video into a real-time, 3D oscilloscope-style sculpture, running entirely in the browser Tech Stack: React + Vite | Three.js + React-three-fiber + Postprocessing (Bloom glow) #CreativeCoding #ThreeJS #ReactThreeFiber #WebGL #GenerativeArt #TechArt #Frontend #3D

I wanted to see what would happen if we stripped away pixels and polygons from a video, and instead tried to recreate moving footage using a single, unbroken, continuous line. Introducing SINGLETHREAD- experimental web app that transforms any video into a real-time, 3D oscilloscope-style sculpture, running entirely in the browser Tech Stack: React + Vite | Three.js + React-three-fiber + Postprocessing (Bloom glow) #CreativeCoding #ThreeJS #ReactThreeFiber #WebGL #GenerativeArt #TechArt #Frontend #3D

shadows

75,933 views • 6 months ago

Cyberpunk-ish ⚡️ Maybe not an entire city…but at least one rainy alley built with #threejs + WebGPU that weighs only 15 MB. Live link: This is also a sneak peek at some of the techniques that Sunag and I will be covering during our workshop at Three.js Conf Paris. More on that below 🤗 I hope you like it #WebGPU #creativecoding #threejsJourney

Cyberpunk-ish ⚡️ Maybe not an entire city…but at least one rainy alley built with #threejs + WebGPU that weighs only 15 MB. Live link: This is also a sneak peek at some of the techniques that Sunag and I will be covering during our workshop at Three.js Conf Paris. More on that below 🤗 I hope you like it #WebGPU #creativecoding #threejsJourney

Anderson Mancini

97,610 views • 2 months ago

ASTRODITHER. LIVE. NOW. ✨ An audio reactive Astro / Three.js webGPU experiment with TSL, custom fluid sim, selective bloom, postprocessing, dithering, time warp and much more i don't even remember. Enjoy it, with audio clearly. 🔊 ↓↓

ASTRODITHER. LIVE. NOW. ✨ An audio reactive Astro / Three.js webGPU experiment with TSL, custom fluid sim, selective bloom, postprocessing, dithering, time warp and much more i don't even remember. Enjoy it, with audio clearly. 🔊 ↓↓

Robert Borghesi

23,855 views • 1 year ago

maybe we got lost in translation, maybe i asked for too much.. maybe this thing was a masterpiece, till you tore it apart.

maybe we got lost in translation, maybe i asked for too much.. maybe this thing was a masterpiece, till you tore it apart.

🧸

11,361 views • 1 year ago

I open-sourced the Sylva three.js site and the skills behind it. I started with one reference and asked Opus 5 to recreate it in Three.js as a single HTML file (looped for 2 hours). The moss root is procedural geometry with around 130,000 instanced blades, and all the code is under 1 MB. Live site: Repo: I turned the main interactions into three reusable skills: - threejs-wireframe-scan-reveal - threejs-pointer-orbit - threejs-gpu-particle-spray Skills repo:

I open-sourced the Sylva three.js site and the skills behind it. I started with one reference and asked Opus 5 to recreate it in Three.js as a single HTML file (looped for 2 hours). The moss root is procedural geometry with around 130,000 instanced blades, and all the code is under 1 MB. Live site: Repo: I turned the main interactions into three reusable skills: - threejs-wireframe-scan-reveal - threejs-pointer-orbit - threejs-gpu-particle-spray Skills repo:

Meng To

134,797 views • 1 month ago

I’m sick and tired. Random old stuff just to vent a little bit. I fear I’m not gonna attend Napoli Comicon. 🥲 Lately, I started getting sick super often (just a cold, nothing serious!). Is it maybe become I’m becoming “old” and I travel too much? Who knows?!!!!! 🤭

I’m sick and tired. Random old stuff just to vent a little bit. I fear I’m not gonna attend Napoli Comicon. 🥲 Lately, I started getting sick super often (just a cold, nothing serious!). Is it maybe become I’m becoming “old” and I travel too much? Who knows?!!!!! 🤭

Mirka Andolfo Fumettis

26,649 views • 1 year ago

fable is wild personal sites used to feel like so much effort. now you really can just ship new toy versions whenever the mood strikes i pretty much one-shotted this navigable matrix hallway site WebGL + Three.js, with a custom shader

fable is wild personal sites used to feel like so much effort. now you really can just ship new toy versions whenever the mood strikes i pretty much one-shotted this navigable matrix hallway site WebGL + Three.js, with a custom shader

kristin eberth

16,560 views • 4 months ago

👉🏻 My #threejs portfolio was accepted as a nominee on awwwards. 😍. The votes are open until August 15th. After 4 years in this #threejsJourney, putting into practice the things I've learned from this amazing course, it is the first time that I have had enough personal projects to compile a portfolio 😊. I'm glad that I started this journey, and I hope I can keep inspiring and helping others 🙏🏻. #creativecoding #webgl #r3f

👉🏻 My #threejs portfolio was accepted as a nominee on awwwards. 😍. The votes are open until August 15th. After 4 years in this #threejsJourney, putting into practice the things I've learned from this amazing course, it is the first time that I have had enough personal projects to compile a portfolio 😊. I'm glad that I started this journey, and I hope I can keep inspiring and helping others 🙏🏻. #creativecoding #webgl #r3f

Anderson Mancini

10,550 views • 2 years ago

Can't believe in less than 24 hours I created my own game with Claude and Three.js. Running in a browser at 120 FPS. All I had to do was give Claude the repo for Threejs and describe an MMO-like game for it to build from scratch. All the assets and mechanics you see are all from a prompt. As you can see, it is far from done but the progress is insane. Everyone should be using Three.js now without a doubt!

Can't believe in less than 24 hours I created my own game with Claude and Three.js. Running in a browser at 120 FPS. All I had to do was give Claude the repo for Threejs and describe an MMO-like game for it to build from scratch. All the assets and mechanics you see are all from a prompt. As you can see, it is far from done but the progress is insane. Everyone should be using Three.js now without a doubt!

NeilXbt

23,504 views • 1 month ago

Not only have I remade #Balatro’s card behaviour in WebGL I’ve now got custom #glsl shaders running on the cards too! Built with #threejs If this post hits 1k likes, I’ll drop a free & beginner-friendly video explaining exactly how I did it #threejsjourney #100DaysOfCode

Not only have I remade #Balatro’s card behaviour in WebGL I’ve now got custom #glsl shaders running on the cards too! Built with #threejs If this post hits 1k likes, I’ll drop a free & beginner-friendly video explaining exactly how I did it #threejsjourney #100DaysOfCode

Alex

37,795 views • 1 year ago

Happy to introduce the Macintosh Simulator🤓 with a REAL Macintosh OS from 1984😎 I build it with Three.js, React three fiber, and PCE ⚛️ Try it now🥰👉 #javascript #ReactJS #threejs

Happy to introduce the Macintosh Simulator🤓 with a REAL Macintosh OS from 1984😎 I build it with Three.js, React three fiber, and PCE ⚛️ Try it now🥰👉 #javascript #ReactJS #threejs

Mark Shenouda

10,346 views • 3 years ago