Загрузка видео...

Не удалось загрузить видео

Возникла проблема при загрузке этого видео. Это может быть связано с временными проблемами сети или видео может быть недоступно.

На главную

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

Lisha

18,929 subscribers

16,833 просмотров • 11 месяцев назад •via X (Twitter)

Anya Rossi• Live Now

Private livecam show

Комментарии: 16

Фото профиля Lisha

Lisha11 месяцев назад

Relativity you can see: the arc racing toward us brightens; the arc slipping away softens. Based on Koiava’s shader on Shadertoy, I ported it to Three.js/GLSL and added live controls. This is a video I made for my youtube channel and also sharing here. #Physics #threejs #CreativeCoding

Фото профиля Lisha

Lisha11 месяцев назад

Play with it here built on @Rosebud_AI

Фото профиля Swupel e.U.

Swupel e.U.11 месяцев назад

@Shadertoy @threejs Looks great!

Фото профиля stan

stan11 месяцев назад

@Shadertoy @threejs physics twitter ! let’s go !

Фото профиля Lisha

Lisha11 месяцев назад

@Shadertoy @threejs Yeah glad the algo is working! Plan on working on more interactive shaders for physics and math

Фото профиля jeantimex

jeantimex11 месяцев назад

@Shadertoy @threejs Awesome job! Thank you so much for sharing!

Фото профиля Lisha

Lisha11 месяцев назад

@Shadertoy @threejs Glad you enjoyed it! Since we improved our agent it's been pretty good at iterating on shaders. I plan on making a lot more for physics and math explainers!

Фото профиля jeantimex

jeantimex11 месяцев назад

@Shadertoy @threejs Agent? It’s implemented by AI agent? That’s even better!

Фото профиля Lisha

Lisha11 месяцев назад

@Shadertoy @threejs Yes my additions are, you can remix by clicking remix in the footer of the project

Фото профиля Carlito

Carlito11 месяцев назад

@Shadertoy @threejs Thanks for introducing me to rosebud. That's very cool.

Фото профиля Lisha

Lisha11 месяцев назад

@Shadertoy @threejs Let me know if you end up forking this project and build something else!

Фото профиля Yonathan Dinata

Yonathan Dinata11 месяцев назад

@Shadertoy @threejs woow

Фото профиля Lisha

Lisha11 месяцев назад

@Shadertoy @threejs Let me know if you get to remixing it! I also added a github link in the footer of

Фото профиля Yonathan Dinata

Yonathan Dinata11 месяцев назад

@Shadertoy @threejs thanks! appreciate that 🫡

Фото профиля Emma Lorrae | UGC

Emma Lorrae | UGC7 месяцев назад

@Shadertoy @threejs Hey Lisha! Do you need creators to scale your brand organically? Run a creator academy and would love to set you up with some of our best for free. Sent you a DM

Фото профиля zhong wu

zhong wu6 месяцев назад

@Shadertoy @threejs this an interesting work,lisha,i hope will have interaction with you in the future

Похожие видео

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 просмотров • 1 год назад

from the archives - a particle fluid sim i'd originally built in unity now translated to webgl / Three.js ! Claude was surprisingly good at all the boring bits with glsl compatibility etc so i could focus on the creative, building on the wordmark in my folio. link below ↓

Aj

23,966 просмотров • 8 месяцев назад

Took it further with Omma AI, (Spline ) now it works on video, and everything working in a Web Browser. Drop a video, Depth Anything v2 calculates the depth map frame by frame, and Three.js renders a fully lit 3D mesh in real time. Depth estimation on video in the browser +Automatic baking pass + Dynamic lighting reacting to the geometry #vibecoding #threejs #webgl

Took it further with Omma AI, (Spline ) now it works on video, and everything working in a Web Browser. Drop a video, Depth Anything v2 calculates the depth map frame by frame, and Three.js renders a fully lit 3D mesh in real time. Depth estimation on video in the browser +Automatic baking pass + Dynamic lighting reacting to the geometry #vibecoding #threejs #webgl

Joseph Azar

149,128 просмотров • 5 месяцев назад

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

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,268 просмотров • 1 год назад

I gave Gemini 3.7 Flash a handful of reference images and a rough idea of what I wanted. Ran /grill-me to align on the vision. Hit /goal & /teamwork-preview and let it cook. A couple of iterations later, this is what came out! An interactive kind of experience.. built with Three.js, WebGL, GLSL shaders, and Web Audio engine. Turn up your volume a bit...

I gave Gemini 3.7 Flash a handful of reference images and a rough idea of what I wanted. Ran /grill-me to align on the vision. Hit /goal & /teamwork-preview and let it cook. A couple of iterations later, this is what came out! An interactive kind of experience.. built with Three.js, WebGL, GLSL shaders, and Web Audio engine. Turn up your volume a bit...

Bee

972,594 просмотров • 1 месяц назад

my blog post on motion-based shader is almost ready! it will be out once back from vacation in 2 weeks, there are a few details to tweak, i don't want to rush things :) meanwhile, i added a few new modes to my blob tracking demo for you to play with

my blog post on motion-based shader is almost ready! it will be out once back from vacation in 2 weeks, there are a few details to tweak, i don't want to rush things :) meanwhile, i added a few new modes to my blob tracking demo for you to play with

Maxime

21,674 просмотров • 2 месяцев назад

ok so about 5-6 hours in godot, here i am render wise it's amazing. Physics is so much easier as it's a built in feature, you can also bake lighting on the go as you design your scene, it's fun to play with it time to play with shader #indiedev #indiegamedev

ok so about 5-6 hours in godot, here i am render wise it's amazing. Physics is so much easier as it's a built in feature, you can also bake lighting on the go as you design your scene, it's fun to play with it time to play with shader #indiedev #indiegamedev

Alex

459,352 просмотров • 1 год назад

✨ Added a CRT curvature distortion to pieter™ now It takes the Em-DOSBox and processes it in WebGL and builds a new with the distortion of a classic CRT screen which had this convex curvature (like an old TV) even though the screen itself was square I had this working on DOSBox on MacOS and on Linux with CRT-Pi shader, but on web it doesn't support shaders so I had to build my own with Claude Code in JS, very easy I remember trying this a year ago and Claude Code fucked it up so bad that I gave up, so I think the models have improved a lot Tomorrow I'll try add some scanlines, it really helps make the simulation more passable (and nostalgic!) 😊👌

✨ Added a CRT curvature distortion to pieter™ now It takes the Em-DOSBox and processes it in WebGL and builds a new with the distortion of a classic CRT screen which had this convex curvature (like an old TV) even though the screen itself was square I had this working on DOSBox on MacOS and on Linux with CRT-Pi shader, but on web it doesn't support shaders so I had to build my own with Claude Code in JS, very easy I remember trying this a year ago and Claude Code fucked it up so bad that I gave up, so I think the models have improved a lot Tomorrow I'll try add some scanlines, it really helps make the simulation more passable (and nostalgic!) 😊👌

@levelsio

88,416 просмотров • 9 месяцев назад

I've built a new open-source (MIT licensed) Elemental Sandbox containing 9 new abilities, a VFX playground built with Three.js & this time you cast with your hands. Open palm aims. Fist casts. Point right with your left hand to switch. Real-time hand tracking with MediaPipe by Google, running in the browser. No webcam? Run it locally and your phone becomes the camera over WebRTC. Hand-written GLSL, GPU-simulated instanced particles, world position resolved in the vertex shaders... Source code: Live link:

I've built a new open-source (MIT licensed) Elemental Sandbox containing 9 new abilities, a VFX playground built with Three.js & this time you cast with your hands. Open palm aims. Fist casts. Point right with your left hand to switch. Real-time hand tracking with MediaPipe by Google, running in the browser. No webcam? Run it locally and your phone becomes the camera over WebRTC. Hand-written GLSL, GPU-simulated instanced particles, world position resolved in the vertex shaders... Source code: Live link:

Chiro Visuals

23,130 просмотров • 28 дней назад

I built a little sandboard in Three.js and webgpu to play with, and yes, on mobile multitouch is supported still a first draft, but i really like the feel of it You can play at: Source:

I built a little sandboard in Three.js and webgpu to play with, and yes, on mobile multitouch is supported still a first draft, but i really like the feel of it You can play at: Source:

Scott

30,141 просмотров • 25 дней назад

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.

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 просмотров • 1 год назад

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

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

14,095 просмотров • 2 месяцев назад

So happy to say that I FINALLY have come up with a workflow and style in #b3d #bnpr that matches how I draw/sketch on paper. It utilizes grease pencil and a special marker shader I created. Super low poly, very light shaders, and in Eevee, so the viewport & render speed is FAST.

So happy to say that I FINALLY have come up with a workflow and style in #b3d #bnpr that matches how I draw/sketch on paper. It utilizes grease pencil and a special marker shader I created. Super low poly, very light shaders, and in Eevee, so the viewport & render speed is FAST.

JOY of 3D

73,885 просмотров • 3 лет назад

I just turned 37 today and started this journey when I was 30. After years of building the engine with 💕 and optimizing it, this is the final gameplay running on #webgl with #threejs After converting Jamir from WebGL to WebGPU, I hope to release the X3JS, built on top of Jamir's game engine, in 2025, initially for creating FPP and TPP games, and make it available for everyone. New version will be upcoming in a few days, btw! 🥳 #gamedev #gamedevelopment

I just turned 37 today and started this journey when I was 30. After years of building the engine with 💕 and optimizing it, this is the final gameplay running on #webgl with #threejs After converting Jamir from WebGL to WebGPU, I hope to release the X3JS, built on top of Jamir's game engine, in 2025, initially for creating FPP and TPP games, and make it available for everyone. New version will be upcoming in a few days, btw! 🥳 #gamedev #gamedevelopment

mert

31,651 просмотров • 2 лет назад

My "No Man's Sky" game built with 1 prompt went viral: 700k+ views and 7,000+ unique players. So I kept going and added a full galactic war. With 2 more prompts: → Ground battle against giant Behemoth walkers. Tie their legs together to bring them down → Fly straight off the surface into a space battle with Juggernaut ships and fighter squadrons → Escape the war and land on a new planet to explore No loading screens. All in the browser. Built with Opus 5.5 & Three.js on Tesana - Make AI games Play it below 👇

My "No Man's Sky" game built with 1 prompt went viral: 700k+ views and 7,000+ unique players. So I kept going and added a full galactic war. With 2 more prompts: → Ground battle against giant Behemoth walkers. Tie their legs together to bring them down → Fly straight off the surface into a space battle with Juggernaut ships and fighter squadrons → Escape the war and land on a new planet to explore No loading screens. All in the browser. Built with Opus 5.5 & Three.js on Tesana - Make AI games Play it below 👇

S

1,977,459 просмотров • 12 дней назад

Wuthering Waves Nvidia Settings (Fix Stuttering) + Current Issues Must Do wuwa players - > So, if you guys are suffering from shader issues in WUWA, you basically lose all shaders sometimes after updating the game! Use this setting → Turn the Shader Cache Size to “Unlimited” so you won’t lose shaders. Major issue with Wuwa - > Game is not running on Native internal resolution (3d) , it looks like devs locked the internal resolution because of optimisation ! simply add Render scale option so people can scale themself Add new option like Renderscale percent or etc so we can play on native #Wutheringwaves

Wuthering Waves Nvidia Settings (Fix Stuttering) + Current Issues Must Do wuwa players - > So, if you guys are suffering from shader issues in WUWA, you basically lose all shaders sometimes after updating the game! Use this setting → Turn the Shader Cache Size to “Unlimited” so you won’t lose shaders. Major issue with Wuwa - > Game is not running on Native internal resolution (3d) , it looks like devs locked the internal resolution because of optimisation ! simply add Render scale option so people can scale themself Add new option like Renderscale percent or etc so we can play on native #Wutheringwaves

Kaito

11,502 просмотров • 4 месяцев назад

Have you ever wanted your terminal to look like an authentic CRT? Of course you have. Well, LOOK NO FURTHER because the future (or is it the past?) is now. And people ask why you'd ever need a GPU-rendered terminal.... HAH! My yak has no more hair to shave. This demo is crazier than it seems: you can actually specify any custom shader, and the shader API is compatible with ShaderToy, so you can take any off-the-shelf shader from ShaderToy and this works. The tech behind this is super over the top. Ghostty is cross-platform and uses Metal directly on macOS and OpenGL on Linux. Metal and OpenGL use different shading languages. No problem! You specify the custom shader in GLSL (OpenGL language) and it’s automatically translated to SPIR-V (binary IR) then automatically translated to MSL (Metal language). That all happens at runtime because why not. Yeah but this has to kill your battery right? Nope! <1% CPU and <1% GPU because computers are fast (especially when you're working at a relatively low level).

Have you ever wanted your terminal to look like an authentic CRT? Of course you have. Well, LOOK NO FURTHER because the future (or is it the past?) is now. And people ask why you'd ever need a GPU-rendered terminal.... HAH! My yak has no more hair to shave. This demo is crazier than it seems: you can actually specify any custom shader, and the shader API is compatible with ShaderToy, so you can take any off-the-shelf shader from ShaderToy and this works. The tech behind this is super over the top. Ghostty is cross-platform and uses Metal directly on macOS and OpenGL on Linux. Metal and OpenGL use different shading languages. No problem! You specify the custom shader in GLSL (OpenGL language) and it’s automatically translated to SPIR-V (binary IR) then automatically translated to MSL (Metal language). That all happens at runtime because why not. Yeah but this has to kill your battery right? Nope! <1% CPU and <1% GPU because computers are fast (especially when you're working at a relatively low level).

Mitchell Hashimoto

200,231 просмотров • 2 лет назад

I wanted to see if making N 3D would be fun! experimenting with an xray shader that hides walls based on whether their plane intersects the center of the screen in front of the player. was a headache but I think it should make exploring interiors more interesting #godot

I wanted to see if making N 3D would be fun! experimenting with an xray shader that hides walls based on whether their plane intersects the center of the screen in front of the player. was a headache but I think it should make exploring interiors more interesting #godot

freezydev

36,183 просмотров • 3 лет назад

Finally! I added multiplayer to my browser-based WebGL card game, Summoners. Multiplayer is a really common request. You pick your deck and then send the URL to a friend. They can join even if they don't have an account. It's free to play and live on the site now. I built the multiplayer system using websockets and Fly.io servers. It's working great so far but drop any bugs in the Summoners.io discord. 🙏 🪄 Happy gaming ⚔️

Finally! I added multiplayer to my browser-based WebGL card game, Summoners. Multiplayer is a really common request. You pick your deck and then send the URL to a friend. They can join even if they don't have an account. It's free to play and live on the site now. I built the multiplayer system using websockets and Fly.io servers. It's working great so far but drop any bugs in the Summoners.io discord. 🙏 🪄 Happy gaming ⚔️

Stephen Haney

22,515 просмотров • 3 лет назад

AI can't build complex websites, they said. So I vibe coded a hyper realistic 3D tunnel gallery using Three.js with Gemini 3.1 pro in Google AI Studio in < 1 hour. It runs on Catmull Rom splines with a treadmill style sliding geometry, custom fragment shaders with depth based fog, and tight optimizations like texture disposal, disabled frustum checks, and capped DPR to keep it smooth even on long infinite scrolls. All of this is seriously hard to learn and build manually, but AI pulls it together so well! Live: Code:

AI can't build complex websites, they said. So I vibe coded a hyper realistic 3D tunnel gallery using Three.js with Gemini 3.1 pro in Google AI Studio in < 1 hour. It runs on Catmull Rom splines with a treadmill style sliding geometry, custom fragment shaders with depth based fog, and tight optimizations like texture disposal, disabled frustum checks, and capped DPR to keep it smooth even on long infinite scrolls. All of this is seriously hard to learn and build manually, but AI pulls it together so well! Live: Code:

The Bugged Dev

18,762 просмотров • 6 месяцев назад