Working with POP normals paves the way for exciting new experimentation in TouchDesigner. Let’s see how to get the most out of them.
The introduction of the POP operator family has definitely been a game changer. Today we are able to work on complex 3D networks directly on the GPU, boosting both computational efficiency and creativity.
As we all know – or at least we should – each POP operator comes with several attributes. The main ones are Position (P), Color (Color), and Normal (N).
What Are POP Normals?
Normals are the attributes that map the 3D direction vectors of a geometry. Basically, they return the direction of each surface point. For those familiar with 3D development, normals are the foundation of every 3D environment.
A good way to understand how normals work in TouchDesigner is by using the popViewer component, which we can find in the Palette. So let’s create a Sphere POP and connect it to the popViewer. Then, in the Vectors tab, we activate the three vectors and assign them to the normals (N). Finally, we activate the viewer, and we can see the three normal vectors. Pretty cool, right?
Being able to know the direction vector of each point is a huge advantage when developing new ideas in TouchDesigner. Manipulating normals opens the door to incredible new possibilities. Let’s look at three examples.
Mapping Normals
In the first example, we’ll use normals to map the parameters of a particle system. Start by creating a sphere to feed the particle system. Then, in the Map parameters, use the N values to set the initial velocity of the system. To spice things up, we can also use the first index of the normal – N(0) – to map the jitter birth position, so the particle birth position is randomly displaced within a defined radius. Finally, render the particle system et voilà: a simple but effective galaxy-style effect.
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.
Animated Grid
In the second example, we’ll use normals to apply math operations on a grid. First, we create a Grid POP and animate its random parameters with a basic Noise-Trail-Math CHOP network. Then create a Sphere POP and copy it onto the Grid with a Copy POP. Apply some math operations by connecting the Copy POP to a Math Combine operator.
In the Inputs tab, bring in the normal values as input attributes and rename them. Then, on the Combine page, sum the P(1) parameter of the Copy POP with the N(0) – now called Vector – of the Grid POP. Next, we subtract the three N parameters of the Grid POP from the three P parameters of the Copy POP to get the Color.rgb attributes.
The result feeds two Connectivity POPs to get horizontal and vertical line strips. We merge them together and render the network. And here’s the result: a nice, colored, animated grid.
Evolving Terrain
In the third example, we want to create a sort of evolving, terrain-style landscape. How do we do it? Let’s start with a Grid POP and pass it to a Math Combine POP, where we create a Uniform called NewN and assign it as N. Basically, with this operation, we are erasing the N attributes of the Grid POP and creating a new set of N attributes.
Then we connect a Noise POP, where we map the N(1) attribute to the noise exponent parameter. We also multiply the N(1) parameter by the Curl3D parameter and output it to the P(1) attribute scope. Next, create another Math Combine POP, where we multiply N(1) by Noise(1) to get P(1), and then divide position and normal to output the Color.rgb attributes. Finally, render the network with an animated camera* and here’s the result: a sci-fi, evolving terrain.
Wrap Up
Manipulating normals opens the door to fresh perspectives in geometry manipulation. Once the overall logic is understood, the process is quite simple and straightforward. So start with some basic ideas, then move on to more complex, high-end solutions. As usual, the sky is the limit.
Download the patch
*The animated camera network is based on an idea from the Derivative forum, so full credit to the original developer.
