- Workshop TouchDesigner version - 2025.32460
- TouchDesigner MediaPipe plugin
This short 2-hour workshop will give an introduction to TouchDesigner via a crash-course in network building, working with different operator families, and exploring realtime inputs via the TouchDesigner Mediapipe plugin.
This repo contains all of the exercises we've gone over together in the workshop, along with additional examples to learn more of the fundamentals of TouchDesigner.
To see a step-by-step walkthrough of the first couple of excercises check out the following blog posts:
The first time you open any new application it can be frustrating or confusing as you try to understand how the interface works. TouchDesigner is a node based toolkit, and while it's similar to many tools, it's also distinctly unique. We'll take a little time to cover the basics of getting around the environment, and how to understand what we're seeing. Before you know it you'll be zooming around your networks like it's second nature.
Half of learning a new tool or development environment is just figuring out where all the knobs and buttons are. In this first course we’ll focus on getting your bearings in TouchDesigner, learning the essential interface elements and controls, as well as the fundamental principles of each operator family.
Learn more at Navigating the TouchDesigner Environment
Operators are the building blocks of our TouchDesigner networks. In a typically TouchDesigner project you'll find a series of operators connected by wires into a network. These networks make up the code for your project. The operators in our networks are separated into families which also represent that kinds of data that they contain.
While it’s great to see how we connect operators of like families together, most of the work we do with TouchDesigner often requires connecting operators of different families together. We’ll look at simple examples of how we can start building relationships between operators of different families, and how we can use these ideas to build responsive and interactive networks.
We'll also take a look at how we can work with TouchDesigner Mediapipe plugin in our projects: from downloading it from the main repo, optimizing for project performance, smoothing and manipulating sensor data, to simple techniques for realtime hand-tracking.
Please visit the TouchDesigner MediaPipe releases page to download the plugin. Once downloaded, drag and drop the MediaPipe.tox into the Base Rendering component. To finish getting setup: (1) connect the DAT output for hand tracking to the hand_tracking COMP and (2) connect the TOP output to the 'null_webcam' to get the webcam video from MediaPipe.
We'll pull all of our elements together to render them in a simple scene that overlays a butterfly on our webcam, and shows how we can transform the butterfly into a swirl of noisey magic.
Real time rendering in TouchDesigner requires a few primary ingredients. These are made up of both Component Operators, Texture Operators, and Surface Operators. Our most basic set-up starts with a Light, Camera, and Geometry COMP. Component operators can hold entire networks, and the Geometry COMP typically holds the SOPs we plan on rendering. In order to actually render our scene we need to add a Render TOP to our network. The Render TOP uses the Light, Camera, and Geo COMPs to create a 2D view of our 3D scene.
Learn more at TouchDesigner Basic Render Setup