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

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

На главную

🧊 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...

webgl_webgpu's profile picture

WebGL / WebGPU

2,054 subscribers

10,971 просмотров • 3 месяцев назад •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

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

Нет доступных комментариев

Здесь появятся комментарии из оригинального поста

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

🧩 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
1:43

🧩 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,817 просмотров • 3 месяцев назад

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
0:51

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 просмотров • 6 месяцев назад

🎉 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
1:48

🎉 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 просмотров • 4 месяцев назад

💧 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
1:02

💧 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 просмотров • 4 месяцев назад

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
1:46

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 просмотров • 6 месяцев назад

⚡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
1:00

⚡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 просмотров • 4 месяцев назад

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!
0:47

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 просмотров • 2 месяцев назад

🔥 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
0:24

🔥 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 просмотров • 3 лет назад

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
0:22

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 просмотров • 3 месяцев назад

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
0:38

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 просмотров • 4 месяцев назад

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

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

Codetaur

24,947 просмотров • 2 дней назад

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.
0:30

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

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
0:44

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

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 просмотров • 6 месяцев назад

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.
0:31

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 просмотров • 5 месяцев назад

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

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

Kevin Levron

19,378 просмотров • 1 год назад

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,136 просмотров • 7 месяцев назад

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
0:32

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 просмотров • 8 месяцев назад

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:
0:25

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

PlayCanvas Engine 2.18.0 is here! 🚀 Your free and open source 3D engine for the web ⚡️ Prototype WebGPU Compute splat renderer 🐟 Fish-eye projection for 3D Gaussian splats ⛈️ Procedural splat-based weather effects 🌫️ Fog now affects splats
0:48

PlayCanvas Engine 2.18.0 is here! 🚀 Your free and open source 3D engine for the web ⚡️ Prototype WebGPU Compute splat renderer 🐟 Fish-eye projection for 3D Gaussian splats ⛈️ Procedural splat-based weather effects 🌫️ Fog now affects splats

PlayCanvas

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