As a warning, this post is quite a technical one, I will be going into the details of the fireworks system and how they are implemented. I’ve been working on a fireworks-based game for the past year and a half, yet I certainly wouldn’t call myself a fireworks expert. Honestly, I’m not even a huge fireworks enthusiast, though I do enjoy watching them on the rare occasions, which is most of the time a single day in the year.

The spark for this project came unexpectedly. I was watching a friend develop a Vampire Survivors demake, and the particle effects caught my eye. My first thought was, “Ooh, those look like fireworks. I wonder if I could make them even more like the real thing.” This led me to experiment with firework simulations in Rust, and before I knew it, I became unfortunately obsessed.

The firework system in Starfire Skies has taken a lot of time and learning to bring to life, and much of my inspiration came from watching and rewatching real fireworks on YouTube. I learned that there are around 18 common firework effects, many named after flowers because of their petal-like shapes when they explode. It makes sense when you think about it—each burst resembles a flower blooming in the sky. This floral imagery has deep roots; fireworks were invented in China, and even today, references to flowers are common. For example, in Japanese, the word for fireworks is “hanabi”—hana meaning flower, and bi meaning fire.

After identifying the different types of fireworks, I needed to break down their effects into subcategories to accurately replicate them in code. Here’s a deeper dive into these subcategories, covering explosion shapes, star types, trails, and physics. Please take a look at this image on 18 firework effects, as I will be referencing it quite a lot in this next part.

To represent each star in the game engine, I used a Node2D, as the core component, with several child nodes attached to it. These child nodes create a hierarchy, allowing any transformations applied to the Node2D (like movement or scaling) to automatically apply to its children. Here’s a breakdown of each element:

• TextureRect: This node displays the star's appearance. It can take any texture or image and render it at the star’s position, letting us visually customize each firework star.
• GPUParticles2D: This node represents the star’s trail, generating a continuous stream of textures that follow the star’s path. Each particle has its own lifespan, creating a fading trail effect as the star moves.
• AudioStreamPlayer2D: This node plays sound effects associated with each star. It handles both the initial explosion sound and any sound effects the star might make during its lifetime.
• Timer : The Timer node manages the lifetime of each star, allowing us to trigger specific actions (like fading out or disappearing) after a set duration.

Each Node2D has a dedicated section in the code where it can update its position and the settings of its children every frame (or every physics frame, depending on timing needs). This allows us to adjust each star’s position based on its velocity and acceleration, creating smooth, dynamic movement. To initialize these velocities, I use a higher-level explosion node, which acts as the source of each star. This explosion node generates stars in real-time, applying the correct starting velocity to each.

Explosion Shape

The shape of each explosion is determined by assigning an initial velocity to each star, originating from a central point. To create specific shapes, I represent the explosion as a set of 3D points, with each point serving as a normalized velocity vector for a star. Scaling these vectors by a set factor adjusts the overall size of the explosion.

• Spherical Explosions: Using a Fibonacci sphere, you can create a convincing sphere of stars. This shape is used for 25+ stars, like Dahlia, Peony, Chrysanthemum, Pistil, or Willow. Some types, like Crackle, have a “sub-explosion” effect, adding smaller, spherical explosions within the main one.
• Random Explosions: Random velocities can be generated by creating a uniformly distributed random polar coordinate (r-> 0-1, p->0-2π) for each star and turning it into a cartesian (using uniform in cartesian creates a box shape). These have fewer than 25 stars that burst out in a random pattern, often seen in effects like Palm, Crossette, or Fish.
• Special Shape: One can take an image where every pixel is a vector, then each vector is normalized and centered with respect to each other to make explosion shape of that image. These explosions form specific shapes, like a clover or a ring. For example, Pistil can sometimes appear as a ring.
• No Explosion: Some fireworks, like Comets, Whistles, or Roman Candles, don’t explode after launch and instead just create continuous trails or noises.
• “Continuous”: Fireworks like Fountains create continuous streams of stars that stay close to the ground. This is simulated by creating a bunch of explosions where an explosion happens every 0.1 seconds for some amount of time.

By transforming these velocity vectors, I can manipulate the explosion shape even further:

• Rotation: Rotates the entire explosion shape around a chosen axis, giving different directional spreads.
• Translation: Moves the explosion in a certain direction (e.g., more upward or downward).
• Dilation: Adjusts the shape to be less uniform, like transforming a spherical explosion into an egg shape.

Star Type

Each star can have a white image with a transparent background to represent how it looks and the intensity of each pixel in the image can be controlled by the alpha of that pixel. 

• Sphere Texture: These stars look like bright, colored spheres, as seen in Peonies, Roman Candles, Comets, and sometimes Glitter effects. Their colors and intensities shift over time, giving a flickering or growing effect.
• Point Texture: Here, the stars are small dots, often appearing in large quantities, like in Fountain or Glitter fireworks.
• No Texture: Stars not really having much to do with the brilliance of the explosion but instead carries long trail, looking like a petal. Examples include Pistil, Chrysanthemum, Palm, and Fish.
• Special Texture: This is an unconventional texture, where stars might resemble shapes like butterflies or dragons (think of something whimsical, like the dragon fireworks in The Lord of the Rings).

Trail Type

Each star also contains a Particle generator which generates some amount of point textures every second. Where each particle is generated can also be controlled along with it's speed, speed direction, and forces it experiences over it's lifetime. You can take a look at the Godot 2D particle system for more information.

• Continuous Particles: As stars travel, they emit a stream of particles. Depending on the spread, these can range from the broad trails of Palm and Comet fireworks to the more compact trails of Dahlia or Chrysanthemum. Medium spread effects like Crossette, Bouquet, and Willow fall in between.
• Sub-Explosion: Some stars create smaller explosions as they travel, scattering mini-stars around them. Glitter fireworks often feature this effect.
• No Particles: Some types, such as Peony, Strobe, or occasionally Glitter, don’t produce additional particles, focusing instead on the primary stars.

Star Physics Type

The physics of each firework’s stars determine how they behave in the air. Depending on the firework’s design, these properties can change at different points in its lifecycle. For instance, stars might experience basically no drag for the first 0.2 seconds to allow for a more dramatic spread.

• No Accelerant: In this setup, stars rely solely on gravity for their downward acceleration, with an initial velocity from the explosion. They are also affected by air drag, which acts against the velocity.
• Accelerant: This adds an extra acceleration component, causing stars to move unpredictably. It’s useful for effects like spinning stars (e.g., Fish fireworks) or stars that rotate around the explosion’s center, creating a galaxy-like effect.
• Trail Accelerant: Here, the particles within the trail have an added rotation, forming a series of connected “S” shapes, often seen in Whistle fireworks

Sound Type

Same as the physics types, a firework could contain any combination of the following or none of the following. The intensity of the sound generally depends a lot on how many stars should be instantiated, the more stars, the louder the sounds, but this isn't always the case. The pitch also varies based off the amount of stars or intensity of the explosion, small explosions have a higher pitch, larger ones have deep bass to them.

• Boom Sound: This sound actually is developed from a single loud pop but turns into what we hear as a boom due to it's propagation through the air and bouncing off of the environment.  If the explosion is really small, it sound more like a pop and resembles popcorn pops. Unsurprisingly, most fireworks have this sound.
• Whistle Sound: This sound comes from air escaping a small opening very quickly. The size of the opening and the speed of air escaping changes the frequency and intensity of the sound. The unevenness of the hole and it's minute changes in size makes the whistle sound reverberate causing the whistle sound we hear. Stars can have this if they are like the Whistle firework and have what seems like randomly chosen frequencies and intensities (randomly within some threshold, like 800Hz - 1000 Hz or something).
• Sizzle Sound: A combination of the whistle and pop sounds but with a sputtering effect causes a sizzle sound. Stars from Fountain or Willow can have this.

All of these types are represented in a Godot Resource owned by a Firework Node. When a specific firework needs to be generated, a firework node is first instantiated, then it's resource is changed which creates the explosion nodes needed and the stars and their parameters needed within. This hopefully gives a bit of the insight of how the firework system works. Next blog post will cover how the colors of the fireworks are represented, see you then!