Customizable Sparkle Trail Effect Using Three.js

Test Demo:

https://360.articulate.com/review/content/a0d89d3d-008c-43b7-a4a2-f68a3026159b/review 

Introduction

I was testing out the coding capabilities of a local LLM model (Qwen 3.6) the other day and decided to drop in a request that someone made on ELH awhile back. I requested a customizable sparkle trail generator using Three.js, and lo and behold, after a few iterations it spit out a fairly decent attempt. I liked it, so I made a few modifications and customized it to work within the Storyline environment. I thought I would share it here for others to use or modify for their needs.

The demo just demonstrates loading the scripts and implementing the effect on a slide. It’s pretty straightforward; the custom script includes a JS class that is used to create and implement an animated glowing particle trail inside a specified object (e.g., a rectangle) on a SL slide. There are several settings you can set in the code to customize the appearance. There’s an onscreen GUI so you can visually play with the effect to get it where you want. Record the values and update the script to make the settings the default. The GUI can be toggled on or off when it's not needed.

There are still some rough edges that could be smoothed out, but it works fairly well. It implements the effect as an overlay that allows clicks to pass through to whatever is directly underneath. It works on my touch screen, but not completely on my phone at the moment. I’m sure someone could make the necessary adjustments if desired. The demo shows some overlaying objects.

FYI - This also implements a bloom effect, which I patched for full transparency because it’s not included in Three out-of-the-box.

As a side note on LLM coding: I have discouraged the use of vibe coding in the past, and while I appreciate the value and efficiency of coding with a LLM, I believe it’s really only (or most) useful if you already have a fairly good grasp of the process. You still need to test, troubleshoot, repair, customize, and update the output, sometimes repeatedly. The LLMs work well as coding partners but are less useful as coding servants. They are great in a pinch when you just don’t have the time to dedicate yourself but should not substitute for learning the basics of how to do the job. If you want to learn, they can be a good mentor to get you started but it should really be a team effort.