Experiment Using "Volumetric Light" in Shifted Depth GIF Effect with Three.js

This is a short note about some experiments I have been doing with using "volumetric light" as the "bars" in a shifted depth gif effect with three.js.

The demo visualization using this effect is at https://learnforeverlearn.com/splitdepth/.

The "volumetric light" is based on the work of Jerome Etienne (https://github.com/jeromeetienne/threex.volumetricspotlight) using 3D cylinders.

There are many other properties of the visualization that can be tweaked via the (hideable) controls, including switching back to "simple" bars whose opacity can be varied.

Comparison of "Simple" bars vs. "Volumetric Light"
(interactive visualization using this effect is at https://learnforeverlearn.com/splitdepth/)
Does the volumetric light enhance the effect?

While it was a nice exercise to explore the implementation of this, and you can tweak the size and color of the volumetric light bars, I am a little disappointed with the impact of the volumetric light. At present, it simple looks like a gradient to transparency. Maybe a subtle rotation of the cylinders would help, or more playing with the shaders.

Etienne's work is based on that of Stemkoski (http://stemkoski.github.io/Three.js/Shader-Glow.html), who has some more involved "glow" demos that might be applicable here as well.

Popular Posts