top of page
  • Writer's pictureacrylicode berlin

Exclusive Touchdesigner tutorial

Updated: Jul 23, 2023

Hi, we are Acrylicode, a Berlin-based couple making generative art and enjoying the journey. We created this exclusive tutorial for generativehut and we hope you like it.


You will learn how to create this:


Enjoy! If you liked this tutorial, please consider subscribing to our Youtube channel and following us on Instagram to support us.


We will first introduce the steps and then we will show them in the video tutorial below.


We will create this animation with TouchDesigner. TouchDesigner is a node-based visual programming language for real-time interactive multimedia content. There is a free license and the software is free to download. You can achieve this tutorial with the free license. You can download it from here.


1. The main idea of the project starts with creating a line SOP (surface operator). In the parameter window, we are going to set the number of points to 600, point A to -6, and point B to 6, so that we have a long line stretching horizontally through the whole render screen.


2. From here we will pass the line SOP to CHOP. We do this because some transformations are easier done on CHOPs and so we are able to deform the line in the y-Axis to achieve the effect of a noisy line. We are going to do the transformations in between and afterwards convert it to SOPs again.


3. After the CHOP TO operator add a geometry, a camera and lights. Connect all three to a render and the render to the Out.


4. At this point we will get a warning in the render. This can be easily fixed by adding a Constant Material. Once we add the Material we drag and drop it onto the Geometry and select Parameter Material. From now we are able to see the line on the render screen.


5. Here we are going to change the background color to black by creating a transform right before the Out. In the parameter window, set the alpha parameter to 1 and turn on Comp Over Background Color.


6. Create a Noise CHOP and in the parameter window change the channel name to ’ty’ (the transformation in the y-Axis). Add a Replace CHOP and connect it to the Noise. This will immediately transform the line to a noisy line.


7. Before the Out, add a Feedback TOP, a Transform TOP and a Composite TOP. On the parameter window of the Composite we’re going to set the operation to ‘add’. Drag and Drop the Composite to the Feedback to automatically set the Target Top to Composite. On the parameter window of the Transform we lower the scale and increase the Translate y value.


8. After the Noise TOP, create a Math Top and connect it to the Noise. In the Math parameter window go to Multi-Add and we’re going to set the Pre-Add to -0,5.


9. For the last step we’re going to animate the noise. We’re going to click on the Noise Node and in the parameter window, we’re going to click on Transform and set the Translate z parameter to ‘absTime.seconds * 10’.


And these were all the steps to achieve the animation. Render away and improvise with the values and colors to have different variations. For more go watch our over an hour long techno mix with a sound reactive version of this animation here: https://www.youtube.com/watch?v=cuWHHNhlfk8&t=961s





You can contact us via Instagram DM or just leave a comment in our most recent Youtube video, we appreciate any feedback, suggestions, etc.


Don't forget to check out our previous tutorial for Generative Hut here.


7,594 views2 comments

Recent Posts

See All

2 Comments


Zahra Soltani
Zahra Soltani
Mar 29, 2022

hello , thanks for your great tutorial , how we can implement the first your text that is converted to line in first of movie ?

Like
acrylicode berlin
acrylicode berlin
Mar 30, 2022
Replying to

Create a text SOP, convert it to CHOP and then use a cross between the sops. You should use a stretch CHOP to make sure they have the same length (check out other tutorials on our Youtube channel, we show how the stretch trick is done)

Like
bottom of page