The Interactive & Immersive HQ

Thermal Effect in TouchDesigner

Thermal effects are common in almost all vfx systems and video servers. They’re fun and easy to use and can turn even boring content into something interesting by creating the illusion of thermal camera / heat scan. With all that said, it’s not hard to make a fully custom thermal effect inside of TouchDesigner using only a few operators. Let’s dive in!

Setup

The first thing we’ll do is get some kind of video into our project. In this example, I’ll use the Video Device In TOP, set my library to Media Foundation and then select my laptop’s Integrated Camera device.

One thing that is very common in the processing for these fake colourizing effects is to monochrome your image before doing the colourizing. I’ll make a Monochrome TOP after my Video Device In TOP:

So far so good! I find it helpful to also add a Level TOP after our Monochrome TOP so that we can do a bit of adjustments on the contrast and brightness of our mono texture, in case we’d like to make it more or less dramatic:

That’s our general input and processing setup! Now onto the colourizing!

Magic colours

All of the colourizing comes out of two operators. The first is the Lookup TOP which functionally does the colouring and the second is a Ramp TOP which defines our style. Let’s start by making our Lookup TOP and plugging our Level TOP into it’s first input:

Then we can create a Ramp TOP and plug it into the 2nd input:

We’re ready for the fun. Although it doesn’t look like it’s doing anything yet, the forces are in motion. What’s happening already is the Lookup TOP is looking at the brightness of the pixels coming in from the Level TOP and then mapping them to colours found in the Ramp TOP. A good way to imagine it is that dark colours will pull from the left side of your ramp and the brightest pixels will pull from the right side of the ramp. Let’s try changing the colour of the right side key:

In this example, I made it a solid red colour, but there’s nothing stopping you from generating any kind of colour palette you’d like. So far, it’s not that interesting. I’ll go ahead and start adding another key in the middle with an orange colour:

Now we’re starting to see something interesting. We can see the display background is now starting to lookup not just the red colour but also doing natural gradients between that and the second key (orange). We can continue adding a few keys for fun:

As we add more keys and new colours in our ramps, our Lookup TOP starts to introduce more and more interesting outputs! Everywhere in the source image that is darker pixel values will be looking up in the black/blue/green area of our Ramp TOP and then the brighter pixels in the image look up from the orange/red area of our Ramp TOP. That’s about it! Just a few nodes and we can create this fake thermal camera. If you’re planning to use this in an installation, you’d probably want the person to be hotter than the background, so you could use some easy lighting tricks to make the user the brightest element in the camera feed or use and infrared camera and use IR LEDs to light up the person and not the background.

Get Our 7 Core TouchDesigner Templates, FREE

We’re making our 7 core project file templates available – for free.

These templates shed light into the most useful and sometimes obtuse features of TouchDesigner.

They’re designed to be immediately applicable for the complete TouchDesigner beginner, while also providing inspiration for the advanced user.

Other variations

The best part about this system is how easy it is to use and manipulate. Here’s a few variations just based on some different ramps:

Wrap up

With only a few nodes you can build your own colourizing effects. Whether they’re thermal image effects or anything in your imagination, a Lookup TOP and Ramp TOP can quickly and easily give you access to these effects. Enjoy!