Video yükleniyor...

Video Yüklenemedi

Bu video yüklenirken bir sorun oluştu. Bu geçici bir ağ sorunundan kaynaklanıyor olabilir veya video kullanılamıyor olabilir.

Ana Sayfaya Dön

🧊 Technical Showcase: A full WebGPU 3D engine that maps shader geometry to your DOM elements. Martin's gpu-curtains gives you lights, shadows, compute shaders, glTF, and instancing, but the real trick is how it turns your divs into scrollable, resizable shader planes without any coordinate math. The successor to... show more

WebGL / WebGPU

2,054 subscribers

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

Anya Rossi• Live Now

Private livecam show

0 Yorum

Yorum bulunmuyor

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

Benzer Videolar

After spending some time in the Virgin Islands, I was inspired to create a WebGPU-based water shader with TSL and compute shaders 🌊 Lots left to do, but it's finally starting to look decent! #threejs #webgl #webgpu #shaders

After spending some time in the Virgin Islands, I was inspired to create a WebGPU-based water shader with TSL and compute shaders 🌊 Lots left to do, but it's finally starting to look decent! #threejs #webgl #webgpu #shaders

Dan Greenheck

28,002 görüntüleme • 6 ay önce

🧩 Technical Showcase: What if a WebGPU framework did less on purpose? Motion GPU skips the scene graphs and mesh loaders entirely. Just fullscreen shaders, multi-pass pipelines, and a DAG-based frame scheduler. Built by Marek Jóźwiak. 🔗 #WebGPU #Shaders #Svelte #CreativeCoding

🧩 Technical Showcase: What if a WebGPU framework did less on purpose? Motion GPU skips the scene graphs and mesh loaders entirely. Just fullscreen shaders, multi-pass pipelines, and a DAG-based frame scheduler. Built by Marek Jóźwiak. 🔗 #WebGPU #Shaders #Svelte #CreativeCoding

WebGL / WebGPU

13,807 görüntüleme • 2 ay önce

🎉 Play Showcase: Thousands of particles. Real physics. Your browser. Juan Cazala (cazala) built Party, a WebGPU playground where you tweak gravity and collisions live while compute shaders handle the chaos. Open it, touch the sliders, lose forty minutes. 🔗 #WebGPU #ParticleSystem #CreativeCoding #ComputeShaders #GraphicsProgramming

🎉 Play Showcase: Thousands of particles. Real physics. Your browser. Juan Cazala (cazala) built Party, a WebGPU playground where you tweak gravity and collisions live while compute shaders handle the chaos. Open it, touch the sliders, lose forty minutes. 🔗 #WebGPU #ParticleSystem #CreativeCoding #ComputeShaders #GraphicsProgramming

WebGL / WebGPU

12,804 görüntüleme • 4 ay önce

💧 Technical Showcase: A piece of WebGL history, rebuilt for WebGPU. Evan Wallace's 2011 water demo helped convince Dylan Field (Dylan Field) that Figma could exist. Yong Su (jeantimex) ported it to WebGPU with full caustics, raytraced reflections, and the GitHub repo to study. 🔗 #WebGPU #WebGL #GraphicsProgramming #Shaders #Figma

💧 Technical Showcase: A piece of WebGL history, rebuilt for WebGPU. Evan Wallace's 2011 water demo helped convince Dylan Field (Dylan Field) that Figma could exist. Yong Su (jeantimex) ported it to WebGPU with full caustics, raytraced reflections, and the GitHub repo to study. 🔗 #WebGPU #WebGL #GraphicsProgramming #Shaders #Figma

WebGL / WebGPU

18,778 görüntüleme • 4 ay önce

Building Three.js shaders is about to get a whole lot easier! 👍 Introducing Three.js Shader Graph — visual node-based editing for TSL. 🖱️Drag & drop nodes 📺Real-time 3D preview 🔄Auto-generate TSL code in realtime Join the waitlist 👉🏻 #threejs #webgl #webgpu #shaders

Building Three.js shaders is about to get a whole lot easier! 👍 Introducing Three.js Shader Graph — visual node-based editing for TSL. 🖱️Drag & drop nodes 📺Real-time 3D preview 🔄Auto-generate TSL code in realtime Join the waitlist 👉🏻 #threejs #webgl #webgpu #shaders

Dan Greenheck

34,219 görüntüleme • 6 ay önce

⚡Technical Showcase: Peer-to-peer GPU sharing, entirely in the browser. AI Grid lets you run LLMs locally with WebGPU and either donate your spare compute to the network or borrow from someone else's machine. No installs, no cloud. Decentralized inference with nothing but a URL. 🔗 #WebGPU #WebLLM #WebAI #DistributedCompute #ArtificialInteligence

⚡Technical Showcase: Peer-to-peer GPU sharing, entirely in the browser. AI Grid lets you run LLMs locally with WebGPU and either donate your spare compute to the network or borrow from someone else's machine. No installs, no cloud. Decentralized inference with nothing but a URL. 🔗 #WebGPU #WebLLM #WebAI #DistributedCompute #ArtificialInteligence

WebGL / WebGPU

17,126 görüntüleme • 4 ay önce

$I am having a lot of fun with this ThreeJS game. Will probably be spending more time on this cosy flyer game for #vibejam And btw, shaders are awesome! I highly recommend anyone building a 3D game to add some shaders to make your game look good. Here's a quick primer on the different types of shaders you can tell your AI to level up your game's graphics: - Noise-based shader for water refractions or shimmer - Fresnel shader for a nice rim lighting effect on your 3D game objects - Post-processing shader to change your game's color scheme dynamically - Post-processing shaders like the VHS effect that @levelsio use for the Drone flyer game - Shader effect to make the trees sway or objects wobble - and many more uses Shaders are incredibly versatile and useful. I would recommend you to go YT to check out some shader basics videos and come up with more creative uses for them!$

I am having a lot of fun with this ThreeJS game. Will probably be spending more time on this cosy flyer game for #vibejam And btw, shaders are awesome! I highly recommend anyone building a 3D game to add some shaders to make your game look good. Here's a quick primer on the different types of shaders you can tell your AI to level up your game's graphics: - Noise-based shader for water refractions or shimmer - Fresnel shader for a nice rim lighting effect on your 3D game objects - Post-processing shader to change your game's color scheme dynamically - Post-processing shaders like the VHS effect that @levelsio use for the Drone flyer game - Shader effect to make the trees sway or objects wobble - and many more uses Shaders are incredibly versatile and useful. I would recommend you to go YT to check out some shader basics videos and come up with more creative uses for them!

Danny Limanseta

202,473 görüntüleme • 2 ay önce

🔥 enhance-shader-lighting is released! 🔥 ⮕ Demo: 3 example scenes with baked lightmaps and "enhanced lighting" through modified shaders. ⮕ GitHub: #threejs #webdev #3D #javascript #Graphics #webgl

🔥 enhance-shader-lighting is released! 🔥 ⮕ Demo: 3 example scenes with baked lightmaps and "enhanced lighting" through modified shaders. ⮕ GitHub: #threejs #webdev #3D #javascript #Graphics #webgl

0beqz

85,142 görüntüleme • 3 yıl önce

Custom grass system. No instancing, no Compute shaders. Just game objects splitted into chunks with LODs. Displacement in vertex shader. Their geometry is pre-sorted towards the camera to minimize overdraw. Unity automatically handles culling as they are just game objects. #madewithunity #realtime

Custom grass system. No instancing, no Compute shaders. Just game objects splitted into chunks with LODs. Displacement in vertex shader. Their geometry is pre-sorted towards the camera to minimize overdraw. Unity automatically handles culling as they are just game objects. #madewithunity #realtime

Shahzod Boyhonov

19,378 görüntüleme • 2 ay önce

Left: Normal ASCII shader Right: Shape-aware ASCII shader ASCII characters are chosen based on their shape, so you get clearer edges Vectors are calculated and compared with WebGPU compute shaders It's based on an altered version of Alex Harri's approach. I'll link below

Left: Normal ASCII shader Right: Shape-aware ASCII shader ASCII characters are chosen based on their shape, so you get clearer edges Vectors are calculated and compared with WebGPU compute shaders It's based on an altered version of Alex Harri's approach. I'll link below

abdullah

305,013 görüntüleme • 4 ay önce

finally got around to combining my threejs / webgpu fluid shader, ascii shader, and crt shader

finally got around to combining my threejs / webgpu fluid shader, ascii shader, and crt shader

Codetaur

23,754 görüntüleme • 1 gün önce

Been pushing Rive's new 3D and shader support to see what's possible 🚀 Using AI + scripting, I was able to: • Import 3D models • Generate cameras and lights • Create custom shaders (wireframe, AO, sketch, toon) • Build materials • Project animated textures onto 3D geometry • Place 2D components directly in 3D space It's pretty wild to see how quickly Rive is evolving into a true all-in-one platform for interactive design.

Been pushing Rive's new 3D and shader support to see what's possible 🚀 Using AI + scripting, I was able to: • Import 3D models • Generate cameras and lights • Create custom shaders (wireframe, AO, sketch, toon) • Build materials • Project animated textures onto 3D geometry • Place 2D components directly in 3D space It's pretty wild to see how quickly Rive is evolving into a true all-in-one platform for interactive design.

Sanu Sagar

17,710 görüntüleme • 11 gün önce

Did you know that Shaders Plus has "Modules", that can allow any existing shader set up to utilize Shaders Plus features non-destructively? They also work with any shader type, and in Eevee!! :D #b3d #blender3d #blender

Did you know that Shaders Plus has "Modules", that can allow any existing shader set up to utilize Shaders Plus features non-destructively? They also work with any shader type, and in Eevee!! :D #b3d #blender3d #blender

SMOUSE 🔸

12,276 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

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 • 6 ay önce

1 million unique objects in WebGPU. It appears to be the fashion to show off limits of one's engine. So here's "Shade" - my WebGPU engine running in the browser, rendering 1,000,000 unique meshes. That is - no instancing, and every mesh has a unique material, geometry and transform. We have full cascaded shadows here in the mix and post-processing stack. "Surely you can't have 1M instances, there's a trick, right?" - Nope. No tricks, just the state-of-the art Vizibility Buffer-based GPU-resident renderer. That is - on the CPU side we submit a fixed number of draw calls regardless of how many instances we have.

1 million unique objects in WebGPU. It appears to be the fashion to show off limits of one's engine. So here's "Shade" - my WebGPU engine running in the browser, rendering 1,000,000 unique meshes. That is - no instancing, and every mesh has a unique material, geometry and transform. We have full cascaded shadows here in the mix and post-processing stack. "Surely you can't have 1M instances, there's a trick, right?" - Nope. No tricks, just the state-of-the art Vizibility Buffer-based GPU-resident renderer. That is - on the CPU side we submit a fixed number of draw calls regardless of how many instances we have.

Alex Goldring

86,497 görüntüleme • 5 ay önce

First test with #webgpu #threejs #tsl : InstancedMesh, node material, compute shaders and psrdnoise. Demo : Source :

First test with #webgpu #threejs #tsl : InstancedMesh, node material, compute shaders and psrdnoise. Demo : Source :

Kevin Levron

19,378 görüntüleme • 1 yıl önce

so about 16 hours into Godot now, I got to play with shaders, instancing, and postprocessing effect. It's subtle (less is more) but there's a procedural screen distorsion effect around the engines, aswell as a volumetric flame shader

so about 16 hours into Godot now, I got to play with shaders, instancing, and postprocessing effect. It's subtle (less is more) but there's a procedural screen distorsion effect around the engines, aswell as a volumetric flame shader

Alex

125,620 görüntüleme • 8 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

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,136 görüntüleme • 6 ay önce

Today, MJ breaks down False Earth, an incredible WebGPU-powered world where the heavy lifting happens on the GPU: procedural grass, VAT animation, compute shaders, indirect draw, LOD, and GPU-driven culling. Go behind the scenes:

Today, MJ breaks down False Earth, an incredible WebGPU-powered world where the heavy lifting happens on the GPU: procedural grass, VAT animation, compute shaders, indirect draw, LOD, and GPU-driven culling. Go behind the scenes:

Codrops

21,581 görüntüleme • 1 ay önce

gm, today we're launching Shader Lab, like photoshop but for shaders • design slick layered shader compositions • export high-quality assets or shaders • OSS package to plug & play ↳

gm, today we're launching Shader Lab, like photoshop but for shaders • design slick layered shader compositions • export high-quality assets or shaders • OSS package to plug & play ↳

basement.studio

842,771 görüntüleme • 2 ay önce