domains / families / software-engineering / fire-smoke-skill-vfx

fire-smoke-skill-vfx

separate

Build the effects of a fire skill as one visual language in Three.js. Flames that read as fire, not as orange fog or cones: ray-marched flame volumes whose turbulence rises with buoyancy (slow at the root, accelerating and stretching as it climbs) instead of scrolling, a temperature ramp from a white-hot core a little above the fuel through yellow and orange to deep red tips, broad brighter licks inside, walls of fire broken into clumps of separate tongues of very different heights with notches between them and licks that detach and go out, a fire whirl wound in helical sheets with a waist and a blue root; charcoal smoke drawn premultiplied over the frame and lit only by the fire (cauliflower billows for a burst, a thin streaked curtain off a grass-fire front, fibrous wisps off small fires, ragged hot cracks inside a burst's smoke); embers and sparks that drift on a curl field, cool from white through orange to red and fall as ash; heat haze as refraction; firelight shared with the wo…

When to use

• fire or flame skills
• fireballs
• fire waves or breath
• rings of fire
• fire tornadoes or whirls
• burning ground
• wildfire fronts
• smoke columns

When not to use

• lightning
• energy orb
• black afterimage smoke
• air bursts
• telegraphs
• status effects
• cleanup rules
• scoring a skill out of 10

Skill page

Source