SimonDev | Fluffy, Soft Particles (WebGL/Three.js) @simondev758 | Uploaded 3 years ago | Updated 3 hours ago
In this project, I'll show you how soft particles work, and walk you through the opengl transformation pipeline.
Follow me on:
Patreon: https://www.patreon.com/simondevyt
Twitter: https://twitter.com/iced_coffee_dev
Github: https://github.com/simondevyoutube/
We'll be looking at adding soft particle support in three.js and JavaScript. This tutorial covers how soft particles work, how to structure your three.js or webgl program to render depth values, how to read and transform values from the depth buffer, and ultimately how to write the shader code that does the soft particle effect.
This tutorial uses three.js, which is a library in JavaScript for cross-browser 3d graphics using webgl. It makes high level functionality and advanced graphics available on the web.
In the video, we cover:
* OpenGL Transformations, Local, World, View, Projection, NDC spaces
* Reading from the Depth buffer
* Fading particle using depth differences
Various resources used:
https://www.khronos.org/opengl/wiki/Coordinate_Transformations
http://www.humus.name/Articles/Persson_CreatingVastGameWorlds.pdf
https://developer.nvidia.com/content/depth-precision-visualized
In this project, I'll show you how soft particles work, and walk you through the opengl transformation pipeline.
Follow me on:
Patreon: https://www.patreon.com/simondevyt
Twitter: https://twitter.com/iced_coffee_dev
Github: https://github.com/simondevyoutube/
We'll be looking at adding soft particle support in three.js and JavaScript. This tutorial covers how soft particles work, how to structure your three.js or webgl program to render depth values, how to read and transform values from the depth buffer, and ultimately how to write the shader code that does the soft particle effect.
This tutorial uses three.js, which is a library in JavaScript for cross-browser 3d graphics using webgl. It makes high level functionality and advanced graphics available on the web.
In the video, we cover:
* OpenGL Transformations, Local, World, View, Projection, NDC spaces
* Reading from the Depth buffer
* Fading particle using depth differences
Various resources used:
https://www.khronos.org/opengl/wiki/Coordinate_Transformations
http://www.humus.name/Articles/Persson_CreatingVastGameWorlds.pdf
https://developer.nvidia.com/content/depth-precision-visualized