Now that we’ve started learning about operators, it’s important to move onto TouchDesigner parameters.
Parameters are what we call the values that are available and can be changed for each given operator to control its functionality.
Every single operator has them. They can be scripted, manually controlled, tied to UIs, or they can be random numbers that are generated.
There’s so much flexibility in what you can do with custom parameters that it gives TouchDesigner the power to basically do whatever you want it to do.
The first thing you need to know is where the parameter window is.
If you open up TouchDesigner, you have this area in the top right here. This is the parameter window, and by default, it starts the project with it open:
The first thing you should know is how to open and close this parameter window because sometimes it accidentally gets closed and new users don’t know how to open it again.
Hit the ‘p’ key on your keyboard (remember, lowercase p) to open and close that parameter window. Sometimes you might be working on a project, but you aren’t working with parameters, and you just want to see more of your network and have more real estate, you might choose to close that parameter window, but most of the time you’ll probably be working with it open.
Now, if you wanted to take this parameter window and disconnect it from the Network Editor (because right now it’s locked to our Network Editor), you could go to an operator, right-click on it and click parameters which will open a floating window version of your parameter window.
So now let’s start by changing a few custom parameters and thinking about how that works.
An easy one that we can do is go to a Movie File In (that’s probably going to be an operator you’re going to use a lot). You’ll see immediately there’s lots of different types of parameters:
If you want to change the movie file, you would go to the File parameter and either type the path of a new file or click the plus button which would open up a file selector.
If you wanted to do things like turn the playback of the video on and off, then you could go over to the Play command parameter, which has the little on and off button you can click. There’s also have a speed slider below it which can slow the video down, or speed it back up.
There’s different pages of parameters under this one operator too. Some of them you probably won’t use, but we’ll go into more of these parameters later as we start looking at some of the more useful operators that you’re going to need to know as a beginner.
I encourage you to play around with the parameters as this can be a great exploration for you as a beginner!
For custom parameters that have number values, they can be entered in a few different ways. Depending on the situation, some parameters may require a static value, and some may need to be driven by other values and inputs.
Each parameter has three modes. Each mode is quite different, and defines how the parameter behaves. We have constant mode, expression mode, and export mode.
Constant mode is the default for most parameters, and is represented by a grey colour scheme in the value field.
Expression mode is used for Python, tscript, or mathematical operations and scripts, and is represented by a dark grey and light blue colour scheme.
Export mode is used to directly reference CHOP channels, and is represented by a light green colour scheme.
Each of an operator’s parameters can be independently changed between the three modes. To change the mode of a parameter, hover the mouse over the parameter’s name, and ‘+’ sign will appear near the name. Click this and it will expand the parameter, displaying more information and options.
You should see three coloured squares, and these squares represent the different modes for the parameter.
Operator parameters set to constant mode are represented by a filled grey square. This can be changed to expression mode by clicking on the outline of the light blue square (once you click it, the light blue square will be filled, and the value field to the right will also be coloured to reflect the parameter’s mode).
To change the parameter’s mode to export mode, a CHOP channel needs to be dragged and dropped on the parameter, at which point it will become export mode’s colour scheme (green), and the green box will be filled in.
The third element of the expanded parameter is the value field. The value field displays a different piece of information depending on the parameter mode.
In constant mode, the value field displays the current value, and can be edited by clicking and typing in the field.
In expression mode, the value field displays the script of Python or tscript that is being evaluated. The expression can be edited by clicking and typing in the value field.
In export mode, the value field displays two pieces of information separated by a colon. The text before the colon displays the path of the CHOP that is exporting to this parameter, and the text after the colon is the name of the channel being exported from the CHOP. Because these values are being imposed by another operator, the value field cannot be edited while the parameter is in export mode.
Going back to our Movie File In, one thing you may notice right away is the speed slider attached to the Speed parameter goes from zero to one by default.
But what if we wanted to go faster? I mean, does TouchDesigner really limit us to zero to one speed on a video? Of course not, it’s just that the default range is between zero and one on the user interface gadget.
If you want it to go two times speed, what you have to do is click inside of the little value field of the Speed parameter, delete the one, put something like two, hit Enter. Then all of a sudden, you’ll see your movie is running at two times speed. You can also type in 30 if you want to make it 30X speed and have it go crazy.
However, because our work is generative, you might not know which exact parameter value you need so you’re going to have to play with it and change the values to move them up a little bit or down a little bit, and see how it looks. For these purposes, we have something called the Value Ladder.
The Value Ladder is very useful because it basically eliminates the need for us to type a lot of these values. There’s two different ways to use the Value Ladder (and this goes back to why it’s nice to have a good mouse).
The easiest way to use it is to hover your mouse over a parameter.
For example, hover it over the Speed value, then middle-click and hold. And when you do that, you’ll have a little grey box appear on top of your parameter (we call this the value ladder). And this defines which increments you want to change that value by:
Let’s say your Speed parameter is currently at 1.15, and you want it to move by increments of 0.01, to see what 1.16 looks like, 1.17 etc. To do that, once you middle-click and hold in on it, you would come down to the increment of 0.01 that’s in the grey box. And then when you’re hovering your mouse over 0.01, drag off of the left edge or the right edge, while still holding down the middle mouse button.
When you do that, you’ll see it’s increasing or decreasing that value in increments of 0.01 as you move your mouse to the left or the right:
Once you decide that you like where the value is, simply release the middle mouse button and your mouse will snap back into place, and that value gets written to that parameter.
This is a very useful thing to learn how to use, and you can use it on basically any kind of value-based parameter.
Now, if you don’t have a good mouse with a middle-click that you can hold and drag easily, or if you’re on a laptop, there is another way.
Hover your mouse over the value, then left-click and hold. Hold it for a few seconds, and then the value ladder pops up and you can do exactly what we were talking about but using the left-click and hold.
One final thing to know about the value ladder is a small trick that a lot of people don’t know about.
If you have a parameter like source midpoint, which has two different parts to it (the X and the Y/the horizontal and vertical amounts of where the midpoint is), and you want to change both values equally, you can hover over the name of the parameter and then start your value ladder there.
This can be really helpful if you’re working with things like translations or transforms where you’re trying to move stuff around on X and Y together. Or if you have maybe some RGB values that you want to change in the grey scale, you don’t have to go through and change every single one individually.
The final thing we want to learn about parameters and operators is that there’s something called the Operator Info Modal. You’ll notice there’s no information area of the parameter, but there’s two ways we can open up this operator modal that gives us a lot of information.
The first is the method that I use, and a lot of people use. If you hover your mouse over the operator and you middle-click, you’ll get this white little pop-up:
And it has a lot of very useful information.
You can see the CPU cook time or the GPU cook time (that’s how much time it takes every frame for it to cook). You can see resolution, aspect ratio, format, the start and end frame, the sample rate (which is the fps in this case for a movie), how much GPU memory it takes, and more.
There’s so much information in there. It’s extremely useful when you’re just getting started and maybe there’s troubleshooting that you need to do.
What happens if you want to get this information and again you don’t have a middle-click because you’re on a laptop?
If you go to the parameters of that operator, you’ll see on the top left corner, an “i” icon. If you left-click on that, you’ll get the same pop-up box:
You can open up this info modal on any family of operators, and you’ll actually get different kinds of data that’s contextually based on that operator.
If you do it on a TOP, which is the texture operator, you get all kinds of texture information.
If you do it on a CHOP, you’ll get different information, like the number of channels, how many samples are inside of that channel, and whether it’s time slice.
If you have a SOP, maybe a sphere, you can see information like the number of points, primitives, vertices, the bounding box position, the centre position, etc.
That should give you a good idea of how parameters work, how to use the value ladder, and how to get the information of an operator.
Next in our series, we discuss the TouchDesigner User Interface.
I possess a deep knowledge in many professional fields from creative arts, technology development, to business strategy, having created solutions for Google, IBM, Armani, and more. I'm the co-founder of The Interactive & Immersive HQ. Yo!
Building off of previous Python workshops, this class aims to demystify a few of the elements often used when doing advanced Python development work in TouchDesigner. From using storage to writing your own extensions we’ll work through the several concepts that will help you better leverage Python in TouchDesigner for installations and events. From the conceptual to the concrete, by the end of the workshop you will have both worked with abstract concepts in the textport and created a functioning tool for saving presets.
Matthew Ragan
We all know user interfaces in TouchDesigner are hard. If you’ve taken our Perfect User Interfaces training you’ll know all the ins-and-outs of creating your own user interface elements from scratch. But what if you need a UI made quickly? What if you want to skip building your own UI pieces? Widgets to the rescue! Widgets are the new and powerful way to make user interfaces quickly and easily in TouchDesigner. What they lack currently in their customization, they make up for in speed of deployment and out-of-the-box features that are easy to access through their custom parameters. Combined with new features to TouchDesigner such as bindings, creating quick, scaling, and aesthetically-pleasing user interfaces is a breeze. .
Everyone has seen pictures of TouchDesigner projects with hundreds of operators and wires all over the place. Impressive, right?
No! In fact, the opposite is true. If your projects look like this, you’re seriously hampering your TouchDesigner installations – and your potential to consistently get high-profile gigs:
If you want to create large-scale installations or consistently work on projects in a professional capacity, you need a project architecture that is clean, organized, and easy to use.
The best project architectures – those used by the pros – are so streamlined that they make programming TouchDesigner look boring.
I share how to do this in my training, “TouchDesigner Project Architectures for Professionals.”
In “TouchDesigner Project Architectures for Professionals”, I give you my exact project architecture system – the same system that’s made it possible for me to create installations for Nike, Google, Kanye West, Armani, TIFF, VISA, AMEX, IBM, and more.
With my project architecture system at your disposal, you will:
We accomplish this through my 3 core project architecture concepts:
I’ve spent over 8 years refining my project architecture into an easy-to-implement, repeatable system that any designer can use. Once you learn my system, you’ll be able to take on projects you didn’t think you were capable of. You will also have the confidence you need to land better gigs and meet challenging client demands with flexibility and ease.
Want to level-up your TouchDesigner skills and create projects that can intelligently make content and generative decisions using weather and climate data?
How about installations that span forty-story high-rises that use Twitter posts to prompt generative designs?
Big clients – with big budgets – demand a level of immersion deeper than the use of Microsoft Kinect and Leap Motion interaction. They want to integrate social media, custom web apps and their own CMS to create interactive installations that bring people together in a way they haven’t experienced before.
In short, they want to use technology to become part of the broader conversation.
Fortunately for us, we’re able to deliver this level of immersion by integrating external data sources into our TouchDesigner projects.
The catch? Bringing external APIs into TouchDesigner can be challenging:
That’s why I created my latest training, “Join the Broader Conversation: How to Use External Data and APIs in Your TouchDesigner Installations”. Made for the complete Python beginner, the training provides you with everything you need to begin integrating external data sources with your TouchDesigner projects.
When you’re done you’ll be able to charge more and secure bigger projects than you would previously.
In this 1.5 hour video training (which includes example project files), we will:
Without any guidance, I’ve found that learning to integrate external data natively into TouchDesigner takes new designers between 20-40 hours – and that’s not including the trial and error phase that comes with implementing these concepts for the first time. Many people quit out of frustration.
Want to avoid spending $50,000+ on the wrong computer hardware?
Or having to look your client in the eye and say “I don’t know” when they ask why their shiny new immersive media installation looks like a stuttering, jaggy hot mess?
Then you need this training.
When I first started working with TouchDesigner in 2011, I thought the most valuable skill I had to offer was my ability to code beautiful interactive and immersive media projects for my clients.
While this IS important, I quickly realized that that what my clients valued most was my ability to create an installation that performed perfectly – no tearing, stuttering, judder, or any other issues. If you think this sounds easy, you haven’t been working with Touch long enough.
This is one of the reasons my clients pay me $1,500 per day.
When I first started, I encountered all the issues mentioned above. I overcame them with a combination of all-nighters, hiring the right (and expensive) experts, and in some cases, luck. I also wasted a lot of time and money.
With experience, I was able to preemptively solve for all these performance issues.
That’s why I created the “Creating Flawless Installations with TouchDesigner” training. Now you can benefit from my 7+ years of experience without having to make the costly mistakes I did.
After this training, you will have the confidence you need to deploy immersive design and interactive technology installations for big brands who pay top dollar for your skills. And you’ll be one of the select few individuals in this industry that know how to do what I do with TouchDesigner.
In this 1.5 hour video training (which includes example project files), we will cover:
Want to create large-scale video arrays and real-time LED facades that span high rises?
How about installations that use GPU particle systems, volumetric lighting, and multi-composite operators?
As lots of you know, this is all possible with TouchDesigner – sort of.
Out-of-the-box TouchDesigner is great when you’re just starting out. But as your interactive installations grow larger and your clients begin to want more generative and technical content, there are several challenges that arise and the cracks begin to show.
Problems typically fall into two broad categories:
When problems due to scale such as these inevitably occur, the standard TouchDesigner functionality and nodes only gets you so far. And it doesn’t take very long before you have to explain to your client that you’re unable to deliver what they’re asking for.
Lucky for us, we can leverage the code that powers a lot of TouchDesigner to create installations of virtually unlimited scale and technical possibility.
We do this by learning how to program GLSL Shaders. GLSL is the programming language on which many of the features of TouchDesigner are created even now.
When you understand how to apply GLSL to TouchDesigner, you’re effectively turning on “God Mode.”
That’s why I created my training, “Turn on God Mode in TouchDesigner with GLSL Shaders.” In it, I cover the following concepts:
TouchDesigner is the leading platform for interactive media and immersive design, and is used to create the world’s largest installations. Elburz Sorkhabi explores and explains concepts in TouchDesigner revolving around network optimization and performance bottlenecks.
The user interface (UI) is an integral part of any TouchDesigner installation.
Most clients want dynamic installations that they can control as needed, without consulting a designer or programmer for every change. This is usually through a control panel and UI they can access.
Even more important are user-facing UIs – think interactive panels, turntable additions for live shows, and customizable remote controls. This is what many clients have in mind when they decide to contract someone to design an interactive installation.
But if UIs are so central to TouchDesigner installations, why is it so hard to make them not suck? Most UIs slow down installations and break when you try and resize a component or add multiple pages. They’re also ugly.
So as always, I’m fixing the problem by providing a training.
In my latest 2-hour training, you will learn how to:
A great TouchDesigner installation needs a great user interface. Get the training you need to provide professional UI for top clients today.