Rotation Over Lifetime in BabylonJS Particle System?

Does BabylonJS’s particle system support “rotation over lifetime” functionality, akin to what Unity offers as shown in a provided image? Seeking guidance on achieving similar particle behavior in BabylonJS.
Screenshot 2023-10-31 at 17.52.36

Let me add @PatrickRyan on this one :slight_smile:

@ertugrulcetin, we don’t have an exact parallel to rotation over lifetime which will set the speed of rotation over the life of the particle to reach a specified angle. We have a property which can do something similar with some extra control in angular speed gradient. This allows you to set the rotation speed to a value at many points of the lifetime. This allows you to do things like reverse rotation in the middle of the lifetime, speed up rotation at a certain point of the lifetime, or slow rotation down at a certain point of the lifetime with all values smoothly interpolated.

However, this isn’t quite as straight forward as rotation over lifetime as you need to frontload some math around lifetime and rotation speed to get the system to rotate a specified amount over it’s life. And if you need to have identical rotations while lifetimes are varied, then it won’t be able to achieve the same result. I can see an argument for this kind of parameter as an addition to particles since we don’t have an alternative that can do the same kind of operation. Thoughts, @sebavan?

1 Like

Thanks for the reply, @PatrickRyan! I was checking Unity VFX tutorials, and it seems that Unity offers numerous options/features for VFX effects. The rotation over lifetime is used in several of these videos.

Are you guys planning to add more features to the particle system anytime soon? I don’t have any particular feature in mind; I’m just curious about what’s currently in the pipeline.

I’d like to create advanced, cool-looking VFX, like sword slashes/swings in modern games. The particle system of BabylonJS seems limited at the moment, although perhaps I’m not getting the most out of it.

For example;

@ertugrulcetin, I wouldn’t say that Babylon is limited when creating effects like these. It is true that the rotation over lifetime is not covered here, but that is a very specific use case where you need particles to rotate the exact same amount with different lifetimes. Our implementation allows much more flexibility in terms of being able to increase or decrease (or even reverse) rotation over lifetime, while falling short on the exact same rotation amount over lifetime. In looking at the above image, I don’t see anything that can’t be done by Babylon right now. We have particles emitting from a mesh, particle control from a certain frame of animation, particles emitting from a particular point, layered particle systems, and trail meshes. While this is a slightly different take on the FX, I created a demo for another thread on how to layer and create complex FX using Babylon. Give that thread a read and take a look at the demo. This is barely scratching the surface, but it shows you how you can create some complicated and layered FX. We have some items on our backlog to make this easier as well that we will hopefully get into the pipeline after the 7.0 release.

Thanks for the info. My understanding is limited to the particle system and shaders. I’d like to create a mesh-based slash effect so it can be viewed from any angle, as shown in this video:

Could you guide me on how to achieve this result? I’ve also looked at the example you mentioned and learned a lot. Thank you for the example!

@ertugrulcetin, in looking at the demo you linked, it’s simply a custom shader that has animated UVs on a custom mesh. This isn’t tied to a particle system so you would need to place the mesh positioned along the animation of the weapon. I did something similar for the sword trail on the example I shared. This piece of mesh was attached to the character, though if you have different weapons available on your character, this may need to be a set of meshes that are imported with the weapons, and are attached to your character’s skeleton as needed.

For the shader, I simply made a node material that can have its parameters animated to simulate the swipe effect. This is just the beginning of the example derived from the Unity tutorial that you linked. Unity has a few more “quality of life” nodes like their shape nodes that we have not added. However, it is simple enough to create some of these shapes that the helper nodes aren’t terribly needed. Doing it manually also helps to keep the number of operations down so that you aren’t losing performance under the hood of a helper node without realizing. The only thing you need to provide is a mesh that is folded in half like in the Unity tutorial, ensuring that it is UVed as a normalized plane using all of 0-1 space.

For the glow of the effect, the glow layer is what you need. There is a tutorial at the bottom of the page which shows you how to combine node material and the glow layer. Also you will need to animate the parameters of the shader, which can be found in the particle example above. Basically, this should be examples for each step of the FX you are trying to create, but feel free to ping back with more questions.

1 Like