正在加载视频...

视频加载失败

加载此视频时出现问题。这可能是由于临时网络问题，或视频可能不可用。

For a recent (unreleased) project I got to play around with SDF shapes to create lens blur effects on interaction — #shaders #webgl #threejs

Giom

1,752 subscribers

132,617 次观看 • 2 年前 •via X (Twitter)

科学技术艺术 #shaders #webgl #threejs

Anya Rossi• Live Now

Private livecam show

0 条评论

暂无评论

原始帖子的评论将显示在这里

相关视频

For another recent project, had more fun playing with 3D Raymarching shapes and lights — #shaders #webgl #threejs

For another recent project, had more fun playing with 3D Raymarching shapes and lights — #shaders #webgl #threejs

Giom

13,167 次观看 • 1 年前

Currently working on #ThreeJS particle effects. Might use this effect in a future project to spice up the interaction with the UI.

Currently working on #ThreeJS particle effects. Might use this effect in a future project to spice up the interaction with the UI.

Immersive Studios

13,548 次观看 • 3 年前

Back from some time off programming with a Jump Flood Algorith demo to ease back in! JFA can be used to create a screen SDF from a model in real time - useful for things like silhouette outlines or any other visual effects. More effects coming up! ✨ #threejs #webgl #gamedev

Back from some time off programming with a Jump Flood Algorith demo to ease back in! JFA can be used to create a screen SDF from a model in real time - useful for things like silhouette outlines or any other visual effects. More effects coming up! ✨ #threejs #webgl #gamedev

Garrett Johnson

50,570 次观看 • 8 个月前

Had a great time playing around w/ GPGPU for terrain generation and volumetric lighting. It's also a small tribute to my region back in France — #webgl #threejs #shaders

Had a great time playing around w/ GPGPU for terrain generation and volumetric lighting. It's also a small tribute to my region back in France — #webgl #threejs #shaders

Giom

11,231 次观看 • 1 年前

Interactive WebGL petal particles concept 🌷 We've got a rare opening to take on new projects Unseen Studio® - get in touch if you'd like us to cook something up for you. #webgl #threejs #webdesign

Interactive WebGL petal particles concept 🌷 We've got a rare opening to take on new projects Unseen Studio® - get in touch if you'd like us to cook something up for you. #webgl #threejs #webdesign

Nathan Riley

35,425 次观看 • 1 年前

If you've tried getting AI to write TSL shaders, you know the pain: deprecated imports, phantom functions and compilation errors. In my latest blog post, I share a prompt to help you overcome these issues: Using the prompt, I was able to one-shot this particle simulation with Claude Opus 4.5. #threejs #webgl #webgpu #tsl #shaders

If you've tried getting AI to write TSL shaders, you know the pain: deprecated imports, phantom functions and compilation errors. In my latest blog post, I share a prompt to help you overcome these issues: Using the prompt, I was able to one-shot this particle simulation with Claude Opus 4.5. #threejs #webgl #webgpu #tsl #shaders

Dan Greenheck

61,631 次观看 • 7 个月前

Draw GLSL flowers with your cursor! 🌺 One full-screen plane, two render targets, and a bit of shader magic Live demo & source code: Made with Three.js Hosted on CodePen.IO Special thanks to The Book of Shaders #webgl #glsl #threejs #shader #drawingtool

Draw GLSL flowers with your cursor! 🌺 One full-screen plane, two render targets, and a bit of shader magic Live demo & source code: Made with Three.js Hosted on CodePen.IO Special thanks to The Book of Shaders #webgl #glsl #threejs #shader #drawingtool

Ksenia Kondrashova

28,620 次观看 • 3 年前

I built a website where you can browse the #threejs shaders code by expanding the <includes> in place. It gives a better understanding of what the code is doing without having to open each file individually. #glsl #WebGL

I built a website where you can browse the #threejs shaders code by expanding the <includes> in place. It gives a better understanding of what the code is doing without having to open each file individually. #glsl #WebGL

grgrdvrt

23,573 次观看 • 2 年前

I wanted to create a broken glass effect with WebGL for a long time! Here it is: interactive, lightweight (around 10KB of GLSL + vanilla JS), and easy to customise (find more controls on codepen) Live demo & source code: Hosted on CodePen.IO

I wanted to create a broken glass effect with WebGL for a long time! Here it is: interactive, lightweight (around 10KB of GLSL + vanilla JS), and easy to customise (find more controls on codepen) Live demo & source code: Hosted on CodePen.IO

Ksenia Kondrashova

43,624 次观看 • 1 年前

Following on from last week's GPT 5.5 experiments... Did more experimenting with HTML-in-Canvas to create more interesting page transitions Using our favourite animation library GSAP + the PixiJS Skills Very impressed with how well GPT 5.5 can create WebGL/WebGPU shaders

Following on from last week's GPT 5.5 experiments... Did more experimenting with HTML-in-Canvas to create more interesting page transitions Using our favourite animation library GSAP + the PixiJS Skills Very impressed with how well GPT 5.5 can create WebGL/WebGPU shaders

PixiJS

38,927 次观看 • 2 个月前

This is the 5th or 6th time I've written a topography shader & every time it gets a little bit better & I learn a little bit more. It's a nice challenge for anyone learning about shaders! Some details on the plans for this implementation below 👇 #gis #3dtiles #threejs #webgl

This is the 5th or 6th time I've written a topography shader & every time it gets a little bit better & I learn a little bit more. It's a nice challenge for anyone learning about shaders! Some details on the plans for this implementation below 👇 #gis #3dtiles #threejs #webgl

Garrett Johnson

94,265 次观看 • 1 年前

Thrilled to share the recent website done at WeBook for the Riyadh Season event. Shout out to all the artists and collaborators in this project. Live: #threejs

Thrilled to share the recent website done at WeBook for the Riyadh Season event. Shout out to all the artists and collaborators in this project. Live: #threejs

Bahaa Samir

19,323 次观看 • 2 年前

Lately I’ve been seeing a lot of jelly-like UI components, so I decided to make my own in #glsl, running on WebGL! I adapted the volumetric raymarching technique I use in my shaders and built a custom SDF for an iridescent keycap-style button that works as either a slider or a simple push button. The jelly feel comes from elastic easing functions that drive the SDF deformation. The scale, rotation, background, and color palette are all fully configurable.

Lately I’ve been seeing a lot of jelly-like UI components, so I decided to make my own in #glsl, running on WebGL! I adapted the volumetric raymarching technique I use in my shaders and built a custom SDF for an iridescent keycap-style button that works as either a slider or a simple push button. The jelly feel comes from elastic easing functions that drive the SDF deformation. The scale, rotation, background, and color palette are all fully configurable.

Jae

23,188 次观看 • 7 个月前

Stop fighting GLSL strings in Three.js 🥊 TSL (Three.js Shading Language) lets you write shaders in JavaScript with actual IDE support, proper debugging, and the ability to seamlessly extend existing materials. Learn more in my latest blog post 👇🏻 #threejs #webgl #webgpu #tsl #threejsroadmap

Stop fighting GLSL strings in Three.js 🥊 TSL (Three.js Shading Language) lets you write shaders in JavaScript with actual IDE support, proper debugging, and the ability to seamlessly extend existing materials. Learn more in my latest blog post 👇🏻 #threejs #webgl #webgpu #tsl #threejsroadmap

Dan Greenheck

20,928 次观看 • 8 个月前

✍️ I wrote an article on programming blur shaders for beginners. You do not need to be adept at either math or programming to understand how it works :) Going from the most basic/straightforward type of blur, to what you see below, and more! Lots of pretty pictures, media, and interactive code to learn from. -- Box blur, with clipping and radial weighting. (So, no longer really a box blur...?) 🔍 #gamedev #indiedev #unity3d

✍️ I wrote an article on programming blur shaders for beginners. You do not need to be adept at either math or programming to understand how it works :) Going from the most basic/straightforward type of blur, to what you see below, and more! Lots of pretty pictures, media, and interactive code to learn from. -- Box blur, with clipping and radial weighting. (So, no longer really a box blur...?) 🔍 #gamedev #indiedev #unity3d

Mirza Beig

120,967 次观看 • 5 个月前

We made a tiny game 🐰⛸🥕to reward people who send messages to us. Well, if you don't want to talk to us you can still play here : Move your mouse and click to jump. #gaming #webgl #threejs

We made a tiny game 🐰⛸🥕to reward people who send messages to us. Well, if you don't want to talk to us you can still play here : Move your mouse and click to jump. #gaming #webgl #threejs

EPIC Agency - Imagine, Build, Tell.

11,225 次观看 • 3 年前

If I had to choose one thing to do, it would be just coding WebGL flowers It's a GLSL shader, a full-screen plane, and 2 render targets to swap on each frame Live demo & source code: Made with Three.js Hosted on CodePen.IO Special thanks to The Book of Shaders

If I had to choose one thing to do, it would be just coding WebGL flowers It's a GLSL shader, a full-screen plane, and 2 render targets to swap on each frame Live demo & source code: Made with Three.js Hosted on CodePen.IO Special thanks to The Book of Shaders

Ksenia Kondrashova

51,837 次观看 • 3 年前

started another sci-fi project to play around with some ui ideas. the theme for now is a global anomaly detection system.

started another sci-fi project to play around with some ui ideas. the theme for now is a global anomaly detection system.

Dilum Sanjaya

133,829 次观看 • 9 个月前

Excited to announce the launch of my new #WebGL performance monitor tool: stats-gl! A minimalist solution for real-time WebGL performance metrics - FPS, CPU, and GPU. Repo: Live demo: An example for #threejs is also available😊

Excited to announce the launch of my new #WebGL performance monitor tool: stats-gl! A minimalist solution for real-time WebGL performance metrics - FPS, CPU, and GPU. Repo: Live demo: An example for #threejs is also available😊

Renaud

34,066 次观看 • 3 年前