Create real-time fire with Notch
Ryan Barth explains how to create realistic fire effects using the fields and particle systems in Notch
Ryan Barth explains how to create realistic fire effects in Notch
Ryan Barth is a professional motion designer who is also a technical product specialist at Notch. He has been an integral part of user support both online and on location, assisting some of the biggest and most exciting shows in the touring industry, including U2, Foo Fighters, One Direction and Frozen on Ice. www.notch.one
Over the last few years, there’s been an increasing focus on real time, with modern GPUS enabling ray tracing for increased visual fidelity, making real-time engines more capable than ever.
Alongside this, there has been a growing need for more artistfocused tools that allow designers the flexibility they require to create anything they can imagine, without the need for code. Notch is an accessible, real-time contentgeneration
tool which is used for anything from visuals for live tours and film, to fixed installs and interactive experiences.
In this tutorial, we will explore how to create realistic-looking, real-time fire effects using Notch.
01 THE USER INTERFACE
Before diving into making the scene and importing assets, it’s worth doing a quick summary of the Notch user interface for anyone who is unfamiliar with the tool. In this tutorial we will only be dealing with four panels, so let’s quickly go over them.
The viewport is where you’ll view your scene, fully lit and rendered in real time. You can see the ranges and bounds of nodes, and move them around in the 3D space to place them in the scene using the on-screen handles.
The nodegraph is where most of the scene building comes together. New nodes can be added from the node list on the right, and then connected together using a parent-child relationship. This means nodes connected to other nodes can inherit the properties of the nodes above them. This is very useful, as you can create complex dependencies easily in a clear and visual way.
The Properties panel allows you to tweak the settings and change the behaviour of the nodes, assets and materials you’ve placed in the nodegraph. It’s also where you can set up keyframes and connect modifiers to override properties, and while we won’t be diving too deep into these in this tutorial, it’s still good to know where they can be found.
Finally, the Resources panel is where all outside resources like textures, meshes and sound files are imported to and kept available. From here you can drag them into the nodegraph, add them to your scene, and even update or remove them if they’re no longer needed.
02 FOUNDATIONS FOR THE FIRE SIMULATION
For this tutorial, we will be mainly utilising a field system for the fire and smoke. Fields are a great way to replicate fire, as they are based on fluid simulation which is ideal when it comes to creating smoke and vapour effects.
Start by adding a Field Root and a Bounding Box connected to it. By default, fields are 2D and use only one axis in depth, so increase the
Root node size of the depth to make sure this effect is being created in 3D.
03 VISUALISE THE FIELD
Next, add a Field Renderer and a Primitive Emitter and connect them to the Field Root. The Primitive Emitter will emit ‘ink’ into the field, and we’ll use this as the fuel for our fire effect. The Field Renderer is going to render the field in the scene, so the voxel grid that makes up a field system is rendered to the camera. Finally, move and resize the Primitive Emitter down so that it emits from the bottom of the field, so that as the smoke moves up it has a greater area to move into.
04 DENSITIES AND TEMPERATURES
Currently this isn’t much of a fluid simulation, so set Densities And Temperatures in the Root, and add a Fluid Affector to the field. Densities And Temperatures will tell the field to use a system that tracks temperature in the fields, which you can use for colouring the field. This
will also allow the use of the Updraft Velocity attribute in the Field Root, which adds a simple upward velocity across the whole system, simulating how heat rises.
05 FLUID AFFECTOR AND TURBULENCE
The Fluid Affector applies a full fluid simulation to the field, adding eddies and swirls like a gas or liquid. When used with the Densities And Temperatures option, it gives a pretty realistic smoke simulation. However the smoke will be a bit too stable moving on its own, so add some turbulence above the field emitter which gets stronger as the smoke moves upwards. Play around with the Fluid Affector properties to get different kinds of fluid motion. With high Vorticity you can create much more swirling and curling as the fire and smoke rises.
06 LIGHTING AND COLOUR
The field should be moving quite nicely, but without lighting it is quite flat. Add a Field Shadows node, and you should see some lighting applied to the field. Increasing the density and lowering the brightness gives a pretty good shadow for the smoke, but it still needs some orange and yellow to work as fire.
Changing the temperature colour and increasing the temperature intensity and fade power adds the colours needed for the flames. By playing with the Tint you can get a nice fade between the fire and the smoke, producing the final realistic effect.
07 ADD EMBERS
A large fire isn’t just flames and smoke. You also need to include the embers that can be picked up and taken away by the updraft. A particle system would be perfect for this, so add a Particle Root and connect it to the Root node. To emit particles from the field, add a Field Emitter and connect the field into the Field Source input. This is one of the things that makes Notch so unique, how quick and easy it is to take two totally different systems and use the information across them.
It’s important to make sure the Particle Root is below the Field
10
Root. This is because Notch uses a hierarchical nodegraph, which means the position of nodes can control the order in which they are executed and rendered. In this case, the particles will be generated and placed before the field, allowing it to be rendered on top. By placing the particles below the field, they will be calculated after and thus rendered above the field.
08 MORE MOTION
Because embers tend to move much faster than the smoke, add an additional Field Affector to increase the effectiveness of the field velocities. Next, add a Point Renderer and a Gradient Generator in radial mode. This will render the particles as lots of 2D circles. In additive mode they will blend together with the field much better.
09 IMPORT ASSETS
Now the fire is sorted, you’ll need to import assets to build up the bonfire system. This can be done by either right-clicking in the Resources window and going through Import Resource, or by
simply dragging files into the Resources window.
Textures will import right away, but with objects and meshes you will be prompted with an Import Object window. Because different modelling packages have different axes, units, and all kinds of other standards, you may find that you need to reset some options for these objects on import.
10 ASSEMBLE A MATERIAL
Add the Ground Textures into the scene, and add a Material node from the node list. To apply the textures to the material you can select them in the dropdown in the Material node, but I prefer to import the images separately and connect them directly to the inputs. This way if I want to change the properties of the texture, I can easily do so in Notch without having to go back to Photoshop.
11 ADJUST THE MATERIAL
In the Material node, set the roughness to 1 so the roughness texture is fully used, and enable ‘Use Diffuse Map As Ambient Occlusion’ if you have it, so the AO map is used correctly. For normal mapping to be applied, you will also need to set the normal map mode to tangent space, then adjust the normal map strength to suit the look you want.
12 MAKE AN OBJECT
Now you have a material. Add a Shape 3D node and apply the material to its material input, to apply the material to the Mesh. Set the Shape 3D node to Plane in the shape type, and make it wide enough to cover the size of your scene. This is going to stretch the textures as well, so go back into the material and set the UV Scale X/Y and Diffuse UV Scale X/Y so they tile a few times. For the displacement, raise the Subdivisions X/Y, and in the Material node slightly raise the displacement.
13 DO IT AGAIN
Next, do the same for the Charred Ground and Paper textures. For the ground I would recommend adding a plain deformer with a slight rise to the mesh, so it can blend in with the
15 16
ground below. Place the Paper objects around the edges of where the logs will go, as randomly as you prefer.
14 ASSEMBLE THE LOGS
Next add the log meshes into the nodegraph, parent to the Root, and apply materials to them. Then, add a Material node from the node list, and continue the same process described previously, before adding the Material node and linking up the textures. There are a 17 few different log meshes here, but they all use the same texture files. They can be controlled from the same material, but in your scenes you may need multiple materials for each mesh.
15 ARRANGE LOGS: PART 1
Now let’s arrange the logs and finish off creating the scene. You could copy-paste the logs around manually, but this could be quite expensive as each copy of the geometry would be loaded separately. Instead, take a Clone To Transform node, place all the logs as children to it, and connect it to the root.
16 ARRANGE LOGS: PART 2
Next, connect a Transform Array to the cloner’s input and add a null to the Transform Array. You should see one of the logs has been added at the position of the null. Move this null to the base of the charred ground, and then add a new null. Now a different log should be selected. Do this repeatedly until all of the space the fire will occupy is filled with the logs.
17 MATERIAL CLEANUP
Let’s finish off the scene by adding some extra detail to the logs. The light of the flames should wrap around the edges of the mesh, so add some rim lighting in the logs’ Material node to simulate this. The logs also need some extra brightness in the crevices for where the logs are on fire, so copy the AO map (or use a cavity map), combine it with a fractal noise node, and apply it to the emissiveness input of the material. You will also need to match the colours, to make the bright spots match the fire colour.
18 ADD LIGHTING
Now everything is built up, it's a good time to work on the lighting. In this scene you want the light to be coming from the fire, so you need to start by adding a light right at the centre of the bonfire. Next, a light above pointing down, faking some of the bounce lighting, and finally an Area Light underneath, facing upwards, lighting the logs from below.
19 COLOUR THE LIGHTS
By default all the notch lights are white, which isn’t the right colour for a large fire. Rather than editing each of these colour properties individually, add a colour node from the node list, and connect it to the colour values of each light. Now you only need to edit this node to change all of the lighting colours in the scene.
Vary the lighting in the scene with the use of some Math Modifiers connected to the brightness of the
lights. This will result in some of the flickering that you would expect to see with a real fire, and by using modifiers we can gain extra control over how much and how fast they flicker.
20 ADVANCED LIGHTING
The scene so far is fine for basic lighting, but you can improve the realism greatly by enabling Deferred Rendering and Linear Space Lighting. Deferred Rendering splits the scene render into multiple passes, allowing for much more advanced effects to be generated. Linear Space Lighting changes the lighting model to use a more realistic curve, which matches the way the eye interprets light in the real world.
The next big step is to enable HDR, which greatly increases the bit depth of the render and allows for much more subtlety in the colours and lighting.
21 MORE EMBERS
You also need some embers to sit and remain on the logs, and the easiest way to do this is with another particle system. Rather than drag out a bunch of new nodes from the node list, copy-paste the embers particle system, and delete the Field Emitter/affector. Next, add a Mesh Emitter, and connect it to the Particle Root. Finally, the embers need to appear to vary in brightness as they heat and cool, so add a Noise Shading node with a slow animation rate, and make sure that it varies reasonably with a high gain value.
22 EMIT PARTICLES FROM CLONES
The Mesh Emitter needs a mesh to emit from, but we can’t just plug Log Meshes directly to the Mesh Emitter. For this we need to convert the clones of the logs to a combined singular mesh of all the clone instances.
Fortunately, we can just use a Combine Geometry node. Connect the Cloner to the mesh input of the Combine Geometry, and connect the Combine Geometry to the Object Nodes input of the Mesh Emitter. Now the particles will emit on the surface of all the logs in the scene.
Contrary to before, these particles need to appear below the field otherwise they appear to be resting on the logs in front of the fire. Again, because Notch is a hierarchical nodegraph, you need to make sure these particles are above the field in the nodegraph so they are evaluated first, and the field is then rendered over.
23 SET THE CAMERA AND GRIDS
Our scene is pretty much perfect now, so I’d recommend finally adding a camera and picking a good angle. A low angle gives a nice dramatic view of the scene, and allows us to see the full height of the smoke as it rises too. Using the Viewport Guides option, you can place a 2D grid over the viewport and align the camera so that the bonfire sits in the bottom middle third.
24 POST-FX
As a final step, add some FXAA (Fast approximate Antialiasing) to clean up some of the aliasing along the edges of the geometry, and a Glow 2 node to add a bit more light and colour to the fire. A low blur size and a bit of a threshold to limit the effect will bring up some of the brightness in the flames and will go a long way in making the effect look complete.
I hope you’ve enjoyed this tutorial and that you’ll share your future Notch projects (using these techniques or others) with the hashtag #madewithnotch, so I get to see the results! For more information and more learning resources, visit www.notch.one.
•