Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

Update on my new #threejs project, Lumen Decor Studio. With Screen Space Global Illumination and Screen Space Reflection in action, clients can visualize, in real time, how light can influence a room's decor and how the chosen colors blend with the light to create a cozy atmosphere. Next step:...

Andersonmancini's profile picture

Anderson Mancini

15,093 subscribers

150,018 görüntüleme • 10 ay önce •via X (Twitter)

Sağlık & İyilikBilim & Teknoloji#threejs
LIVE

Anya Rossi• Live Now

Private livecam show

0 Yorum

Yorum bulunmuyor

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

Benzer Videolar

New update to my #threejs Lumen Decor Studio project. Color selection behavior is ready🤩. Thanks to real-time global illumination, colors now blend naturally with sunlight, creating beautiful bounced colors everywhere. Next step: Live link #creativecoding #tsl #rf3 #webgpu
3:00

New update to my #threejs Lumen Decor Studio project. Color selection behavior is ready🤩. Thanks to real-time global illumination, colors now blend naturally with sunlight, creating beautiful bounced colors everywhere. Next step: Live link #creativecoding #tsl #rf3 #webgpu

Anderson Mancini

24,909 görüntüleme • 10 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,446 görüntüleme • 10 ay önce

A little work in progress on my new #threejs project showing how Screen Space Global Illumination also works wonders in open scenes. Here, I'm using SSGI with CSM, SSS (screen space shadows), and a custom atmospheric fog for more realism. Adjusting the time of day in a scene like this is like a dream come true 😍. More details soon. #webgpu #tsl #creativecoding #threejsJourney
2:07

A little work in progress on my new #threejs project showing how Screen Space Global Illumination also works wonders in open scenes. Here, I'm using SSGI with CSM, SSS (screen space shadows), and a custom atmospheric fog for more realism. Adjusting the time of day in a scene like this is like a dream come true 😍. More details soon. #webgpu #tsl #creativecoding #threejsJourney

Anderson Mancini

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

🚀 #threejs r181 is going to be insane. I’ve been playing with the new Screen Space Global Illumination #TSL node before release in #r3f. The video showcases SSGI, GTAO, and TRAA post-processing effects performing magic thanks to the new #WebGPU API. Live link soon. Higher res video: Want to know more? Follow the thread 👇 #creativecoding
4:25

🚀 #threejs r181 is going to be insane. I’ve been playing with the new Screen Space Global Illumination #TSL node before release in #r3f. The video showcases SSGI, GTAO, and TRAA post-processing effects performing magic thanks to the new #WebGPU API. Live link soon. Higher res video: Want to know more? Follow the thread 👇 #creativecoding

Anderson Mancini

28,071 görüntüleme • 10 ay önce

My #threejs Lumen Decor Studio is getting an update. Added a denoiser to the SSGI pass + better AO. I love how light bounces cascade on objects. It looks like Blender Cycles for the Browser 😍. Everything you see is rendered in real time and loads only 6.7 MB. Rendering SSGI + AO + SSR + Denoisers + Probes. You can manipulate objects, colors, sun, and sky all in real time. No baking at all. Live link soon.
0:22

My #threejs Lumen Decor Studio is getting an update. Added a denoiser to the SSGI pass + better AO. I love how light bounces cascade on objects. It looks like Blender Cycles for the Browser 😍. Everything you see is rendered in real time and loads only 6.7 MB. Rendering SSGI + AO + SSR + Denoisers + Probes. You can manipulate objects, colors, sun, and sky all in real time. No baking at all. Live link soon.

Anderson Mancini

23,295 görüntüleme • 1 ay önce

Live link: My new #archiviz project using #threejs is live. A realistic scene with 25,000 trees, various post-processing effects, running at 60 FPS, less than 10 MB download 😊. Screen space global illumination makes everything more realistic. Want to know more? Follow the thread👇🏻 #webgpu #threejsJourney
1:38

Live link: My new #archiviz project using #threejs is live. A realistic scene with 25,000 trees, various post-processing effects, running at 60 FPS, less than 10 MB download 😊. Screen space global illumination makes everything more realistic. Want to know more? Follow the thread👇🏻 #webgpu #threejsJourney

Anderson Mancini

17,753 görüntüleme • 9 ay önce

My #threejs Lumen Decor Studio is getting an update. It will now support more settings and more complex scenes, thanks to the latest library updates. I'm combining #WebGPU SSGI with light probes, giving us the best of both worlds. Real-time light bounces via SSGI, and when the camera stops moving, I bake probes to measure the average light in the room, generating fill lights that paint an envmap. I also created a denoiser for SSGI, avoiding the previous blur that discarded the AO. Now, everything is lighter, a little noisier, but it complements indirect light well. Live link coming soon. BTW: The video is on my YouTube Channel in case you want to watch it in a higher resolution: #creativecoding #archiviz #WebGPU
2:39

My #threejs Lumen Decor Studio is getting an update. It will now support more settings and more complex scenes, thanks to the latest library updates. I'm combining #WebGPU SSGI with light probes, giving us the best of both worlds. Real-time light bounces via SSGI, and when the camera stops moving, I bake probes to measure the average light in the room, generating fill lights that paint an envmap. I also created a denoiser for SSGI, avoiding the previous blur that discarded the AO. Now, everything is lighter, a little noisier, but it complements indirect light well. Live link coming soon. BTW: The video is on my YouTube Channel in case you want to watch it in a higher resolution: #creativecoding #archiviz #WebGPU

Anderson Mancini

29,926 görüntüleme • 3 ay önce

Live: Source: You can download this to start your scenes with #r3f, #threejs WebGPU Renderer, and Post-Processing using #tsl. I also converted my jet engine shader from GLSL to TSL using the transpiler. It works like a dream😍. I added the Royal Naboo starship in the scene to show how Screen Space Reflections reacts to all metallic surfaces, not just the floor. I hope you like it. Please give me a star⭐️on GitHub if you can. #threejsJourney
1:27

Live: Source: You can download this to start your scenes with #r3f, #threejs WebGPU Renderer, and Post-Processing using #tsl. I also converted my jet engine shader from GLSL to TSL using the transpiler. It works like a dream😍. I added the Royal Naboo starship in the scene to show how Screen Space Reflections reacts to all metallic surfaces, not just the floor. I hope you like it. Please give me a star⭐️on GitHub if you can. #threejsJourney

Anderson Mancini

20,257 görüntüleme • 1 yıl önce

Using #threejs with WebGPU and TSL to build a light painting tool. It's not like watercolor, but I like how the paint dries over time. It's quite relaxing. Next, I'll enable "mesh painting" mode. Let's see how it looks. #creativecoding
0:33

Using #threejs with WebGPU and TSL to build a light painting tool. It's not like watercolor, but I like how the paint dries over time. It's quite relaxing. Next, I'll enable "mesh painting" mode. Let's see how it looks. #creativecoding

Anderson Mancini

26,897 görüntüleme • 7 ay önce

Following ☄︎ work, I'm experimenting with some react three fiber with #threejs webGPU. We no longer need an EffectComposer to use post-processing effects in #r3f. Now, everything is done by composing TSL nodes. I created a small component that helps in rendering post-processing effects. All you need to do is import the effects you want and add them to the final composition. I will share the link to the demo and source code on Monday 😍. Another thing I want to highlight is how amazing the Screen Space Reflection effect is. It generates reflections not only on the ground, as we had before in r3f in webgl. It is able to calculate the reflections between the meshes. Look how beautiful the reflection of the lightsaber on Darth Vader's mask is. This is not something that is easy to calculate and this is exactly where WebGPU in threejs shines! Congratulations to everyone on the threejs team. I am increasingly impressed with WebGPU and TSL.
1:41

Following ☄︎ work, I'm experimenting with some react three fiber with #threejs webGPU. We no longer need an EffectComposer to use post-processing effects in #r3f. Now, everything is done by composing TSL nodes. I created a small component that helps in rendering post-processing effects. All you need to do is import the effects you want and add them to the final composition. I will share the link to the demo and source code on Monday 😍. Another thing I want to highlight is how amazing the Screen Space Reflection effect is. It generates reflections not only on the ground, as we had before in r3f in webgl. It is able to calculate the reflections between the meshes. Look how beautiful the reflection of the lightsaber on Darth Vader's mask is. This is not something that is easy to calculate and this is exactly where WebGPU in threejs shines! Congratulations to everyone on the threejs team. I am increasingly impressed with WebGPU and TSL.

Anderson Mancini

26,829 görüntüleme • 1 yıl önce

Showing off two unique features of my #threejs Advanced Glass Material: colored caustics and glass-to-glass interaction. The glass can actually “see” other glass objects in the scene, preserving their depth, internal reflections, and refractions. The green color being visible through the blue glass shows the color and depth interaction. Powered by #WebGPU and a lot of custom rendering work that I learned on #threejsJourney new TSL lessons from the GOAT Bruno Simon Live demo coming soon. #creativecoding
2:52

Showing off two unique features of my #threejs Advanced Glass Material: colored caustics and glass-to-glass interaction. The glass can actually “see” other glass objects in the scene, preserving their depth, internal reflections, and refractions. The green color being visible through the blue glass shows the color and depth interaction. Powered by #WebGPU and a lot of custom rendering work that I learned on #threejsJourney new TSL lessons from the GOAT Bruno Simon Live demo coming soon. #creativecoding

Anderson Mancini

15,412 görüntüleme • 11 gün önce

Realistic Water Simulation with #threejs is live: Now, you can configure scenes, objects, colors, and light positions. You can also dive to see the effects from underwater 🌊💧. It works great on mobile 🤩. The breakdown video will be on my YouTube channel soon. Be sure to subscribe so you don't miss it: Thanks again, Evan Wallace, for the inspiration 🙏🏻 #threejsjourney #creativecoding #r3f
2:32

Realistic Water Simulation with #threejs is live: Now, you can configure scenes, objects, colors, and light positions. You can also dive to see the effects from underwater 🌊💧. It works great on mobile 🤩. The breakdown video will be on my YouTube channel soon. Be sure to subscribe so you don't miss it: Thanks again, Evan Wallace, for the inspiration 🙏🏻 #threejsjourney #creativecoding #r3f

Anderson Mancini

30,310 görüntüleme • 1 yıl önce

Two new #threejs projects on the way 😍 Working on my own gem renderer with a custom refraction material in TSL for #WebGPU, combining Screen Space Reflections + SSGTAO for superior results, as this allows diamonds to generate reflections on the metal mesh. The performance is incredible, even on gems with over 200 diamonds. This time, without any additional libraries. Just React Three Fiber and a lot of magic with custom shaders in TSL. GemGPU™ will also come with a very minimalist gem and metal customization panel that hides and lets the jewelry be the star. I also created a beautiful new stats panel that completely hides in the scene when not needed. It provides relevant optimization information, a performance gauge, summary and expanded modes, and day/night toggle. In the video, you can also see SSGI in action, with a pearl that reflects, in real time, all the objects in the scene, just as the objects in the scene reflect the pearl. It's magical. There are still a few things to fix, but I'll share the live link soon. Stay tuned.
3:43

Two new #threejs projects on the way 😍 Working on my own gem renderer with a custom refraction material in TSL for #WebGPU, combining Screen Space Reflections + SSGTAO for superior results, as this allows diamonds to generate reflections on the metal mesh. The performance is incredible, even on gems with over 200 diamonds. This time, without any additional libraries. Just React Three Fiber and a lot of magic with custom shaders in TSL. GemGPU™ will also come with a very minimalist gem and metal customization panel that hides and lets the jewelry be the star. I also created a beautiful new stats panel that completely hides in the scene when not needed. It provides relevant optimization information, a performance gauge, summary and expanded modes, and day/night toggle. In the video, you can also see SSGI in action, with a pearl that reflects, in real time, all the objects in the scene, just as the objects in the scene reflect the pearl. It's magical. There are still a few things to fix, but I'll share the live link soon. Stay tuned.

Anderson Mancini

12,113 görüntüleme • 6 ay önce

I’ve taken the #threejs water realism to the next level! Now with RGB distortion in the caustics, we get even more realistic, colorful light projections. The water movement has been improved to flow naturally, with optimizations for smoother performance. Plus, I’ve added a post-processing effect that simulates underwater distortion, complete with a dynamic waterline when the camera is partially submerged. After diving in, watch out for realistic water droplets on the screen! Stay tuned for the live link coming soon! 🌊💧. You can watch the video with better quality on my YouTube Channel. #threejsJourney #creativecoding #r3f
2:49

I’ve taken the #threejs water realism to the next level! Now with RGB distortion in the caustics, we get even more realistic, colorful light projections. The water movement has been improved to flow naturally, with optimizations for smoother performance. Plus, I’ve added a post-processing effect that simulates underwater distortion, complete with a dynamic waterline when the camera is partially submerged. After diving in, watch out for realistic water droplets on the screen! Stay tuned for the live link coming soon! 🌊💧. You can watch the video with better quality on my YouTube Channel. #threejsJourney #creativecoding #r3f

Anderson Mancini

212,780 görüntüleme • 1 yıl önce

I'm back to working on my water simulator for interactive experiences using #threejs + #r3f. This time, I'm experimenting with #WebGPU and #TSL for better performance. I'm loving it more and more by the minute. The link and potentially a tutorial will be available soon. But if you want to play with the current version, it's available here: #creativecoding #r3f
1:02

I'm back to working on my water simulator for interactive experiences using #threejs + #r3f. This time, I'm experimenting with #WebGPU and #TSL for better performance. I'm loving it more and more by the minute. The link and potentially a tutorial will be available soon. But if you want to play with the current version, it's available here: #creativecoding #r3f

Anderson Mancini

12,525 görüntüleme • 1 yıl önce

Since using probes is a very technical subject and difficult to understand without visual examples, I decided to create a video with an exaggerated example to show the incredible results that mrdoob 's work with probes can provide. As you can see in the video, the hybrid solution of probes with SSGI blends the best of both worlds: projected lights when the objects emitting the color are in the scene, and indirect light provided by the probes when they are not. Of course, nobody is going to use red and green walls at home lol. This is just a visual example to exaggerate the use and demonstrate how the technology works from a creative point of view. I hope it helps someone 🤗. #threejs #threejsJourney #creativecoding #webgpu
2:42

Since using probes is a very technical subject and difficult to understand without visual examples, I decided to create a video with an exaggerated example to show the incredible results that mrdoob 's work with probes can provide. As you can see in the video, the hybrid solution of probes with SSGI blends the best of both worlds: projected lights when the objects emitting the color are in the scene, and indirect light provided by the probes when they are not. Of course, nobody is going to use red and green walls at home lol. This is just a visual example to exaggerate the use and demonstrate how the technology works from a creative point of view. I hope it helps someone 🤗. #threejs #threejsJourney #creativecoding #webgpu

Anderson Mancini

12,632 görüntüleme • 3 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,449 görüntüleme • 1 ay önce

I'm deeply impressed. You can now have your own AI tutor who can see your screen and chat in real time with Gemini 2.0. It's a real revolution in the way you learn new things. Available for free using Google AI Studio (link below)
3:49

I'm deeply impressed. You can now have your own AI tutor who can see your screen and chat in real time with Gemini 2.0. It's a real revolution in the way you learn new things. Available for free using Google AI Studio (link below)

Paul Couvert

266,658 görüntüleme • 1 yıl önce

Live Link: Source Code: While updating my website, I found an old project that was broken and decided to bring it back to life using WebGPU + TSL in #threejs. I’ve always loved Predator. The first time I saw the Predator cloak effect, I knew I wanted to learn visual effects and make them part of my professional life. Turn the sound on — it makes the experience much more fun 😅 This is also a great exercise if you’re learning TSL and want to experiment with glass, dispersion, IOR, and custom shaders. Both the classic shader version and the new TSL version are included in the repo so you can compare the approaches side by side. Hope it’s useful. Don’t forget to ⭐ the GitHub repo! #r3f #threejsJourney
2:07

Live Link: Source Code: While updating my website, I found an old project that was broken and decided to bring it back to life using WebGPU + TSL in #threejs. I’ve always loved Predator. The first time I saw the Predator cloak effect, I knew I wanted to learn visual effects and make them part of my professional life. Turn the sound on — it makes the experience much more fun 😅 This is also a great exercise if you’re learning TSL and want to experiment with glass, dispersion, IOR, and custom shaders. Both the classic shader version and the new TSL version are included in the repo so you can compare the approaches side by side. Hope it’s useful. Don’t forget to ⭐ the GitHub repo! #r3f #threejsJourney

Anderson Mancini

13,714 görüntüleme • 1 ay önce