Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

Rendering some glass dispersion and caustics in #threejs using WebGPU for my Three.js Conf Paris talk. Live link coming soon 🤗

Andersonmancini's profile picture

Anderson Mancini

15,066 subscribers

15,382 görüntüleme • 9 gün önce •via X (Twitter)

#threejs
LIVE

Anya Rossi• Live Now

Private livecam show

0 Yorum

Yorum bulunmuyor

Orijinal gönderinin yorumları burada görünecek

Benzer Videolar

More experiments with WebGPU Advanced Glass Material for #threejs vanilla version. Added Independent Edge Dispersion for better results when morphing the glass shape. Live link coming soon⚡️ #creativecoding
0:35

More experiments with WebGPU Advanced Glass Material for #threejs vanilla version. Added Independent Edge Dispersion for better results when morphing the glass shape. Live link coming soon⚡️ #creativecoding

Anderson Mancini

32,477 görüntüleme • 8 gün önce

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
2:39

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

96,779 görüntüleme • 28 gün önce

Rendering a 125GB Protomaps vector tile dataset dynamically in Three.js using compute passes and workers
0:21

Rendering a 125GB Protomaps vector tile dataset dynamically in Three.js using compute passes and workers

Three.js

81,437 görüntüleme • 2 ay önce

Live link: Built to showcase what's possible with real-time WebGPU rendering using #threejs. Just a 6.3 MB download, yet the lighting looks baked—until you grab the sun and watch everything update in real time. I hope you like it 🤗
0:56

Live link: Built to showcase what's possible with real-time WebGPU rendering using #threejs. Just a 6.3 MB download, yet the lighting looks baked—until you grab the sun and watch everything update in real time. I hope you like it 🤗

Anderson Mancini

128,319 görüntüleme • 1 ay önce

Update on my GemGPU™ product using #threejs WebGPU and #R3F. Now we have physically accurate diamond refraction, chromatic aberration, absorption, and inclusions. For diamond nerds, it comes with a custom configuration panel with over 50 parameters. Live link coming soon 😍. Official product launch later this year. Signup for the wishlist at #creativecode #webgpu #jewelry
3:58

Update on my GemGPU™ product using #threejs WebGPU and #R3F. Now we have physically accurate diamond refraction, chromatic aberration, absorption, and inclusions. For diamond nerds, it comes with a custom configuration panel with over 50 parameters. Live link coming soon 😍. Official product launch later this year. Signup for the wishlist at #creativecode #webgpu #jewelry

Anderson Mancini

32,642 görüntüleme • 6 ay önce

The Unreal Engine 5 Lyra sample now runs in WebGPU. Live link coming soon, stay tuned! #WebGPU #UnrealEngine5
0:41

The Unreal Engine 5 Lyra sample now runs in WebGPU. Live link coming soon, stay tuned! #WebGPU #UnrealEngine5

Alex St. Louis

38,485 görüntüleme • 2 yıl önce

Realtime Particle test using Transformers.js by Xenova and its upcoming WebGPU backend with the Xenova/modnet model for body segmentation. Rendered with WebGPU in Three.js. It’s so clean it makes me want to do a shadertoy visualizer in the background now 😄 #threejs
0:24

Realtime Particle test using Transformers.js by Xenova and its upcoming WebGPU backend with the Xenova/modnet model for body segmentation. Rendered with WebGPU in Three.js. It’s so clean it makes me want to do a shadertoy visualizer in the background now 😄 #threejs

Renaud

13,739 görüntüleme • 2 yıl önce

New WebGPU Glass Material is almost ready! It will be available for Three.js and Poimandres React Three Fiber. Lots of customization; it comes with a very beautiful and handy control panel. Live link and source code will be available on Monday 😊 #threejsJourney #creativecoding #webgpu
0:55

New WebGPU Glass Material is almost ready! It will be available for Three.js and Poimandres React Three Fiber. Lots of customization; it comes with a very beautiful and handy control panel. Live link and source code will be available on Monday 😊 #threejsJourney #creativecoding #webgpu

Anderson Mancini

18,540 görüntüleme • 22 gün önce

Built a sparkling zero-gravity fluid sim in #WebGPU using PBF, marching cubes, and photon mapping for real-time caustics ✨🌊🔮
0:44

Built a sparkling zero-gravity fluid sim in #WebGPU using PBF, marching cubes, and photon mapping for real-time caustics ✨🌊🔮

Carolina Aiazzi

21,277 görüntüleme • 1 yıl önce

Mana Blade is my MMORPG built with Three.js, React Three Fiber, and WebGPU. It loads in 2 seconds and is playable on desktop and mobile. Already 2 years in the works! Music by the very talented 磯村ショウノ Shauno Isomura. #threejs #r3f #webgpu
0:25

Mana Blade is my MMORPG built with Three.js, React Three Fiber, and WebGPU. It loads in 2 seconds and is playable on desktop and mobile. Already 2 years in the works! Music by the very talented 磯村ショウノ Shauno Isomura. #threejs #r3f #webgpu

Verekia | ManaBlade.com

14,839 görüntüleme • 6 ay önce

i made a 3D stained glass type design tool it renders live in the browser using threejs and webgl shaders
0:30

i made a 3D stained glass type design tool it renders live in the browser using threejs and webgl shaders

AA

47,343 görüntüleme • 4 ay önce

WebGPU + Compute Shaders = 🤯 >500K stars runs at 60fps on my M1 Pro ⚡️ In my latest blog post, I walk through how to build this interactive galaxy simulation 🌌 Source code and live demo link in comments 👇🏻 #threejs #webgl #webgpu #shaders
0:46

WebGPU + Compute Shaders = 🤯 >500K stars runs at 60fps on my M1 Pro ⚡️ In my latest blog post, I walk through how to build this interactive galaxy simulation 🌌 Source code and live demo link in comments 👇🏻 #threejs #webgl #webgpu #shaders

Dan Greenheck

18,629 görüntüleme • 9 ay önce

THREE.JS CONF : DATES ARE LOCKED 🔥 The wait is over! We got an incredible venue to bring the community together! 📅 September 10 & 11 📍 Venue: Maison de la Chimie, Paris 🎟️ Early Bird tickets dropping soon Join the waitlist to be first in line: 👉 See you in Paris ! 🚀 #ThreejsConf2026 #threejs #webgl
0:21

THREE.JS CONF : DATES ARE LOCKED 🔥 The wait is over! We got an incredible venue to bring the community together! 📅 September 10 & 11 📍 Venue: Maison de la Chimie, Paris 🎟️ Early Bird tickets dropping soon Join the waitlist to be first in line: 👉 See you in Paris ! 🚀 #ThreejsConf2026 #threejs #webgl

David Ronai

41,831 görüntüleme • 4 ay önce

I've been working with caustics for a while in #webGPU and one of the issues I find is that it's hard to handle caustics for complex scenes. It's easy for planes, you can save photons in a texture using either compute and atomics, or additive blending with the rasteriser. 🧵
1:03

I've been working with caustics for a while in #webGPU and one of the issues I find is that it's hard to handle caustics for complex scenes. It's easy for planes, you can save photons in a texture using either compute and atomics, or additive blending with the rasteriser. 🧵

Hat

17,985 görüntüleme • 1 yıl önce

I’ve opened up many of the TSL exercises to everyone! Try out some WebGPU shaders and fiddle with them, all in the browser. Pick an exercise and see if you can match the output. Link: #threejs #webgpu
0:30

I’ve opened up many of the TSL exercises to everyone! Try out some WebGPU shaders and fiddle with them, all in the browser. Pick an exercise and see if you can match the output. Link: #threejs #webgpu

Simon

11,095 görüntüleme • 9 ay önce

My new #threejs project is live😍. Lumen Decor features WebGPU SSGI+SSR, showcasing how sunlight can influence decoration. Everything you see renders in real-time and weighs 4MB. #creativecoding #webgpu #tsl
2:47

My new #threejs project is live😍. Lumen Decor features WebGPU SSGI+SSR, showcasing how sunlight can influence decoration. Everything you see renders in real-time and weighs 4MB. #creativecoding #webgpu #tsl

Anderson Mancini

68,341 görüntüleme • 9 ay önce

Got HTML rendering in canvas working AS IS on all browsers, including iOS Safari - html-in-canvas polyfill - interactions - hover, focus, active, typing etc - css animations - scrolling - caret and text selection - #threejs, #webgl, #webgpu support - dark/light mode Link below
0:44

Got HTML rendering in canvas working AS IS on all browsers, including iOS Safari - html-in-canvas polyfill - interactions - hover, focus, active, typing etc - css animations - scrolling - caret and text selection - #threejs, #webgl, #webgpu support - dark/light mode Link below

Palash Bansal

30,459 görüntüleme • 4 ay önce

New #threejs project live using #r3f, GSAP, and a lot of #glsl shader magic for My Muscle Chef 😍. ⚡️Llive link: I will publish a more detailed tutorial teaching some of the tricks as soon as possible 😬. Hope you like it! #threejsJourney
1:23

New #threejs project live using #r3f, GSAP, and a lot of #glsl shader magic for My Muscle Chef 😍. ⚡️Llive link: I will publish a more detailed tutorial teaching some of the tricks as soon as possible 😬. Hope you like it! #threejsJourney

Anderson Mancini

32,145 görüntüleme • 2 yıl önce

Almost done with the interaction of my WebGPU fluid simulation! After testing BVH geometry and marching cubes with compute shaders, I chose raymarching for hands interaction & rendering. It adapts well with MLS-MPM and enables precise interaction in real-time for <2ms. #threejs
0:31

Almost done with the interaction of my WebGPU fluid simulation! After testing BVH geometry and marching cubes with compute shaders, I chose raymarching for hands interaction & rendering. It adapts well with MLS-MPM and enables precise interaction in real-time for <2ms. #threejs

Renaud

10,095 görüntüleme • 1 yıl önce

Made some major improvements to my WebGPU water shader (thanks Ghislain Girardot for the feedback!) Fixed a bug where waves weren't propagating and implemented JONSWAP spectrum for more realistic wave grouping. Hitting ~70FPS @ 2K res on my Macbook M1 Pro #threejs #webgpu #shaders
0:44

Made some major improvements to my WebGPU water shader (thanks Ghislain Girardot for the feedback!) Fixed a bug where waves weren't propagating and implemented JONSWAP spectrum for more realistic wave grouping. Hitting ~70FPS @ 2K res on my Macbook M1 Pro #threejs #webgpu #shaders

Dan Greenheck

18,852 görüntüleme • 8 ay önce