Cigarette smoke effect using shaders
garden.bradwoods.io
Cigarette smoke effect using shaders
1–10 of 27 posts
Re: Cigarette smoke effect using shaders
#2As someone who knows nothing about shaders, this was very cool. Pretty refreshing to see such an interesting site design, too.
Re: Cigarette smoke effect using shaders
#3In a game this is likely done as simply a prerendered animated texture (atlas).
Perhaps in a modern AAA game you might try a GPU particle system with 10k+ particles.
Re: Cigarette smoke effect using shaders
#4As someone who knows nothing about shaders, this was very cool. Pretty refreshing to see such an interesting site design, too.
> an interesting site design
Re: Cigarette smoke effect using shaders
#5awww, cool effect but I was half hoping for fluid dynamics simulation of the smoke with a lorenz fractal. What I've done is render the "smoke" to a framebuffer then apply some velocity to create some small vorticities.
Re: Cigarette smoke effect using shaders
#6In a game this is likely done as simply a prerendered animated texture (atlas). Perhaps in a modern AAA game you might try a GPU particle system with 10k+ particles.
Or, a shader :) Smaller size than a atlas, more efficient that full on particle simulation.
Re: Cigarette smoke effect using shaders
#7In a game this is likely done as simply a prerendered animated texture (atlas). Perhaps in a modern AAA game you might try a GPU particle system with 10k+ particles.
I suspect it depends more on what the developer knows. You certainly don't need to be AAA to do particle smoke, I've done webgames with particle smoke in JavaScript.
With the right tech artist, this sort of shader is essentially what their job is. ShaderToy shows how much you can do with a quad and enthusiasm.
Re: Cigarette smoke effect using shaders
#8As someone who knows nothing about shaders, this was very cool. Pretty refreshing to see such an interesting site design, too.
> an interesting site design Agree - making the scrollbar only 8 pixels wide is an interesting choice...
about:config
layout.css.scrollbar-color.enabled – false
layout.css.scrollbar-width-thin.disabled – true
layout.css.scrollbar-width.enabled – false
Re: Cigarette smoke effect using shaders
#9Cool! But the title made me think that "cigarette smoke effect" made me think that it was about health issues, and I clicked because I was curious about how shaders could be related to that.
Re: Cigarette smoke effect using shaders
#10There is the smoke part - worth seeing, the shader part - well worth exploring (shaders make you see the world in a different way , then there is the learning part. The site is very interactive so it allows you to see one, do one and maybe teach one.
Many people are stuck in html land. I was. Webgl, threejs, @react-three/{fiber/drei} provide another dimension and shaders are the gateway.
Very highly recommended as a skill worth understanding (at least).