• Alexander Clark

Elemental Orb VFX Breakdown

Updated: Nov 9, 2021

Hi there! in this post, I will give a breakdown on how I created the elemental orb's VFX.


This is the end result
End result


The Idea

In Runes of Time the player can collect elemental power-ups that augment the player’s abilities to a certain element. Each pickup fits within a classic elemental theme each being fire, earth and water. They would consist of an orb-like appearance with an effect representing their element, eg fire orb has flames and water orb drips water.






Alphas I used for the elemental orb centers

Orb Textures

After figuring out what sort of effects I wanted in my head, I started to test and experiment with some particle systems in unity. Using Substance Designer to quickly iterate over some orb textures for the particle system, once I was happy with the base I combined the textures into a single splat map.






The Orb Shader

Using a particle shader I made within Unity's shader graph I created a simple particle shader with a simple camera and terrain intersection fading. It also allows the user to select a RGBA channel from the splatmap.


Simple particle shader

Unity's particle system


Orb particle systems

With the simple shader done I then slapped the textures in and started working on a base for the visual effect, the timing of the effect is set to periodically glow. Throughout this process, I was going back to substance designer and testing out new orbs to see what I like.







The outer shell mesh's

After creating the center of the elemental orb's I wanted to create the main effect, the part that really tells the difference between the orbs and sells that element effect. For this, I went into Maya and Houdini to create some models to use.


In Maya:

For the fire effect, I was thinking of a ball of fire and for the water, I wanted to make it look like it was defying gravity, the models were pretty simple, with the UVs being unwrapped like a cylinder


Meshs for the fire and water orbs


Vine proxy mesh

Houdini:

For the earth orb, I had an idea to make it a bunch of roots growing around the orb, the roots would also have leaves.


While thinking this up I remembered that Houdini had a node that does exactly this albeit with a few alterations. For the model itself, I used a proxy mesh to grow the roots on and instead of using the built-in leaves I unlocked the Foliage maker node so I could pass through my own geometry, which was just a grid.


Generated vine mesh with custom leaves


Then combining it all I generated the model, reduced the topology of the vines and then created a material for the roots and the leaves. The leaves were unwrapped in the prior step and the roots were just planer projected on the side.







The outer shell shader and particle system

For the shader I used a combination of panning, warping and dissolving methods to achieve the look, this is a shader I use more generally for other vfx that requires more functionality, you can find a breakdown with this link: Clicky


But here is a screenshot of it anyway, I made it in Amplify shader editor as I am currently learning it at the moment.


Shader used for the fire and water effects

Using Unity's particle system again I added the outershell of the orbs, the fire and water orb have a similar effect and the earth is just the model that I made prior.





You can what the effect looks like if applied to a square mesh.




When applied to the mesh I made before for the water and fire elemental orbs this is what It looks like combined with the center orb.








For the earth elemental orb I simply textured the model and threw the orb into the center.









Final Effects


The last part of the effects was to add the final details. This entailed wisps for the earth orb, droplets for the water orb and fire embers for the fire orb. I also added a sheen effect to the water orb to break it up a bit more, in hindsight I could have also added smoke to the fire orb.

Finished elemental orbs, higher rez gif at the bottom

Conclusion


I'm still getting used to creating visual effects and it is amazing how much time you can lose from tinkering and playing around. Not everything was completed in one go, I would often tween the shaders and then go back and edit the texture a little in substance designer, the same applied to the meshs. Overall I had lots of fun making these and look forward to more VFX related assets.






If you are interested you can find more related images about Runes of Time on our Twitter. Give us a follow to :D


Thanks for reading!




31 views0 comments

Recent Posts

See All