Hello!
One frequently requested ship upgrade in the game is a kind of laser sight (and lasers in general!) to make lining up shots easier. So in preparation for Next Fest I thought I'd try and get this in, along with some of the cool ideas I had for it. I think it turned out really nicely and paves the way for mining lasers to be added soon. I thought I'd give a little explainer of how I went about creating this effect, since it's not too complicated and only really requires knowledge of stencil buffers.
Before I get into it, I'll quickly mention that everything I talk about here is live in the demo that's currently on here Steam. Next Fest is a big deal for tiny indies like me, so wishlisting the game and sharing something about it around this time would really be awesome.
Step 0 - What do we want?
Most of all, this effect needs to be useful but not overwhelming. A big bright red line across the screen would be really dominating and take visual precedence over other things in the scene. Next, it needs to look convincingly like a thin beam of light and not some debug overlay. And finally, we want some cool simulation-like details, like lighting up other things along its path and reflections.
Step 1 - Tracing the path
To trace the path of the laser I use ray casts against the physics objects in the game world (I've avoided calling these lasers ray traced, even though I'm technically tracing them with rays). I start from the player ship in its current facing direction, find the closest intersecting entity, then either stop there if the entity is non-reflective (like the asteroids) or continue from the intersection point using the normal of the intersection to calculate the new direction of the laser. The tracing continues like this until it runs out of distance.
For each ray cast we store data about the position, direction, and what it intersected with (if it intersected at all), which we then use for drawing everything.
One caveat to all of this is that I wanted the lasers to wrap around the game world like everything else, so at the start of each ray cast I calculate the distance to the edge of the play area in the current direction, and only cast the ray for that distance. If the ray reaches that full distance without intersecting anything then it means we have to wrap around to the other side, in which case we continue with a new ray cast with the starting position adjusted.
Step 2 - Basic Drawing
The basics of the effect are the fading out and fading in lines at the start and end of each segment of the laser, and the glow of the laser on the entity it collides with. The fading lines are draw point-by-point using Bresenham's line algorithm, this lets me draw the line without any aliasing (so it's guaranteed to be 1 pixel width) and also allows for better control over the fading out of the colour on the line (currently the fading is linear, but I'm thinking to bucket it so it has more of a pixelated feel). The glow where the laser collides with an entity is done by first writing the colliding entity's sprite to the stencil buffer, then simply drawing a sprite for the glow using that stencil (If you're not familiar with stencilling, check out this OpenGL explainer: https://learnopengl.com/Advanced-OpenGL/Stencil-testing).
This gives us our basic laser effect, which works well and gives us everything we need exception for a few extra details.
Step 3 - Particles
One cool thing about lasers in real life is seeing them light up dust in the air, or lighting up a line straight through smoke, so it would also be cool to have that happen with this laser effect. This is done in a similar manner to the glow on the colliding entities. First we write all particles to the stencil buffer, and then we draw a line for the laser using that stencil. This particular line we draw is done using a sprite which is stretched out along the line of the laser, this lets us get a wider and softer glow, and is also much more efficient than tracing out the whole thing point by point.
Step 4 - Background Glow
Finally, I thought it would be nice if you could actually see the laser in the background of the destroyed asteroids, as if the laser were coming super close to the background but not actually hitting it. Much like step 3, this is done by writing the asteroid backgrounds to the stencil buffer and then drawing a very faint line with a stretched out sprite using that stencil.
Steps 3 and 4 are both done simultaneously for all lasers so that we only have to write the particles and asteroids to the stencil buffer once per frame.
What's next?
There's plenty more I'm thinking to do with this, like having the laser refract from some entities instead of just reflect, or having the reflection only happen at certain angles. I've realised this is the kind of thing I love most about game dev, just messing around with little effects and then seeing how they can contribute to the fiction and gameplay of the whole game.
The majority of the work done for the laser sight upgrade is kept in a reusable laser effect, which I'm planning to use for more lasers (especially a mining laser). This is quite versatile as the effect collects data for each segment, such as distance and intersecting entities, which can be used to calculate damage or perhaps activate things.
Thanks very much for reading :)