What is the network graph in TouchDesigner?

- So I've just downloaded and installed TouchDesigner, and what I get is if I open it up it's something that looks like this. Now, if I've never seen a program like TouchDesigner before, I might be thinking, "What the hell is going on?" So let's just talk about it very quickly. Now the first thing we'll see in the main part of the screen is something called a network. These boxes work together to make our final generative art, and at the moment, the generative art that we're making is some jelly beans that move around, which is not particularly exciting, but we'll come onto that a little bit later.

But these boxes are called operators. They're something that does something to a texture, or a shade, or some kind of wave for instance, like down here, they do things. So all of these boxes do something. What it does is dependent on the box. Now we can drag around in our kind of network, and we can zoom in and out just as we'd normally do on basically any kind of map, for instance, and we can also kind of see these lines between things. So our operators have these wires that go between their outputs and their inputs.

The inputs are on the left and the outputs on the right of every single box, and we can connect 'em up in different ways depending on what they do. Now over here on the right is we have something called parameters. Parameters are basically what we have if we select different boxes. So if I select this outbox or this displace box, or this noise box, they do different things. So depending on what they do, all of these will have different settings depending on what we want from them.

We'll be changing things on these boxes to get different kind of outputs. So we'll be going through all of these different things, adding and creating all of these operators, and then changing them to basically fit what we want to do. Over on the left hand side is something called a palette. Now, we are not gonna be using palette at all for any part of this course, mainly because we don't really need anything that's off the shelf. We're gonna make it all ourselves.

Now, one thing we might wanna do is actually see some of the output. So, how do we do this? Now you might notice if I zoom in on out, you'll see these kind of two little bits in the bottom right hand corner, and I can hover them as well. So if I hover over on my mouse, I can see display, and something called viewer active. Now what I want to do is display this out, this output. So here what I can do is click on the display, which is currently a kind of circle in blue that's grayed out.

So if I click it, what we'll see is the jelly beans being really big in the background of this screen. If I want to go back and see other things, I can just zoom out and shift across, maybe see the original movie file in. I can just click on this and see this original movie. I can display them both. I can also display multiple things at the same time. I can leave that blue tag on, and I can also select this blue tag on here. So you can see in the background here, I've got my input, my original movie in, and this is my output.

So between this here and here, we are doing things, we are doing some displacement, we're doing some different things in this geometry, and then eventually we have something that goes out on the far side. Now what you might notice is it's quite of hard to see these wires between these different operators in this kind of way. You might like it like this. You might like to see this really big background every single time.

But for me, when I'm recording this, what I'm gonna do next is talk about how we set up our layout to make it so that we have this kind of output just on the left-hand side instead.