LogInRayane Saada, a VFX Artist, shared a quick breakdown of the Fire Beam project, explaining the approach and workflow behind a stylized fire VFX made with Unreal Engine, Houdini, and Substance 3D Designer.
Rayane Saada is a passionate VFX Artist from Tunisia, currently attending The Nuova Accademia di Belle Arti in Milan as a second-year student. Rayane's passion for video games began 11 years ago with Unity, where he used to make small games, and transitioned to Unreal Engine later on as he found it more artistic-friendly.
Six months ago, Rayane started learning real-time VFX with Unreal Engine on his own after university classes, and he continues practicing regularly to sharpen his skills. "I still have a long way to go but as they say, trust the process!", he says.
To learn more about Rayane Saada's latest project, an anime-inspired stylized VFX fire beam, we reached out to the artist himself, who shared the inspirations and explained the workflow behind this challenging visual effect.
Speaking about the source of inspiration behind the Fire Beam – Stylized VFX, Rayane explained he wanted to try his hand at a stylized visual effect. The iconic Dragon Ball's Kamehameha energy attack VFX with cool buildup and colors posted by doublecats on X/Twitter moved him to try making a fire beam VFX.
As for the approach to starting the project, the artist pointed out he likes to analyze the timing to understand better what makes the effect snappy and powerful:
"The beam is basically energy/power that is concentrated and then released, a great example of this is the Kamehameha from Dragon Ball; we can divide it into buildup/accumulation, impact/peak, and release.
For the buildup, we can always see an energy ball getting charged and growing, then when it reaches its peak/impact and it can't grow anymore, it gets released into an energy beam instantly, which can sometimes grow after a few seconds and then dissipate.
As a golden rule for timing; if you can hear the sounds of the effect you're making be it an explosion or a subtle heal effect in your head, that means your timing is a 'chef's kiss'."
Moving on with the following steps, Rayane said that he began by dividing this VFX into main elements such as the main beam, the secondary beam that will be the outline in this case, the shockwave, and other supporting elements that help with the blending and overall feeling of the effect.
"I made the cylinder meshes for the beams using Houdini, as it gives me easier control over the geometry, but also using its Curve Ramp and applying some subtle noise on the mesh, I can use it later for some vertex noise magic. I then made other spheres and one with some noise applied to it."
"Having the meshes done, I then started working on the textures. With Substance 3D Designer open, I created the basic noises for the dissolve-like textures using Perlin noise and such. For the main texture of the beam, I wanted a texture that translates well with the flames, so I used the Crystal 2 texture as the base, blurred it, warped it directionally with a blurred Perlin noise, and at the end applied Auto Levels for it to get a nice contrast."
"Having my textures done, I created folders to keep each asset organized in Unreal (Meshes, Textures, Niagara, Materials) and imported everything, and now it's time for some shader magic.
I'm not a master of shaders as I'm still learning, so I made a simple shader with some masking. We have a main Panning Texture (I'm using a material function here that has a Panning Noise applied to it and the Dissolve Panning texture subtracts it), and then we have a mask on the green channel that is inverted so that the masking goes from left to right, the mask is also applied in the Vertex Fade, that takes as input the Vertex Colors of the mesh (black on the edges and white on the center) to fade out the edges accordingly.
I also like to apply some Vertex Noise to my meshes to make them more dynamic and randomized. Then at the end, I also used a simple and subtle Refraction."
Continuing with the process breakdown, Rayane explained, that he decided to go with several beam phases to achieve some weight for the effect:
"After combining these assets into Niagara Emitters, I made the buildup that is basically a little emissive Fresnel sphere that grows with little sprites that are attracted to the center, and a ring texture that shrinks to the center.
Regarding the beam, other artists suggested that I make the beam more powerful by applying a second phase to it, so instead of showing all of its power at the beginning, make it appear shortly after by showing more elements at the end. To achieve this, I divided the Emitters into two groups, one for the first phase and the other for the second."
"Something that I've seen on Chinese and Korean visual effects is that they add some kind of noise on the screen borders and it makes the effect more immersive and intense.
To achieve it, I made a simple shader with a Panning Texture applied on it that is distorted by another Noise Texture, and to all of this applied a Radial Mask and made all the textures UVs with radial coordinates."
"Finally, to refine the effect, I spent some time working on the timing, for example making the central beam at the end to last to dissipate and making the second phase beam shrink fast at the end to show that the energy is so strong, that it can't be maintained for long.
Thank you, Guillaume."
In conclusion, Rayane Saada highlighted the challenging parts of the project and shared a small tip for other artists:
"I would like to thank everyone who supported me and gave me feedback to improve this effect and make it look cool.
It was definitely challenging trying to get the colors and timing right, and regarding the colors, here's a trick for you guys: on Windows, use Windows+Ctrl+C to see everything on the screen in grayscale or search for Grayscale in Accessibility filters.
I hope this breakdown was helpful, continue practicing and make amazing effects! Cheers!"