Using an Arduino with Touch Designer – Beginner exploration

Working With the Derivative Wiki:

There are videos that go along with each section:
Sending data from the Arduino
Receiving data from the Arduino
Controlling an RGB LED with TouchDesigner

Sending data from the Arduino:
Pre-reqs:

• Some experience with simple Arduino projects like the one that comes with this kit: 
• Elegoo Uno Project Super Starter Kit
• Some experience using TouchDesigner. 
• Have both touchDesigner and Arduino installed on computer already ( I will not be including these steps.

Steps:

1. Connect an Arduino to your computer.  (Don’t overthink it.  Just the Arduino.  Absolutely nothing needs to be attached for the example on the wiki to work.)  
2. Open a new Arduino sketch and paste in the simple sketch that Derivative supplies for you on their wiki page:   https://www.derivative.ca/wiki088/index.php?title=Arduino
3. Upload the sketch to the Arduino.
4. Open a new TouchDesigner file.
5. Add a Serial DAT.  
6. Ensure the Port parameter is set to the proper port.  
• This can be checked by viewing the bottom of the ardiuno IDE screen
• Then make sure the same com is being used in the node parameters
• In this case, the port is com3.
  
  
  
  
7. Now you should be able to see info in the Serial node.
   
8. You can see ‘1234’ and ‘321.70’ being printed
9. Communication between TouchDesigner and Arduino has been verified!

Hello World:

You can modify the above to say ‘Hello World’ instead of 1234 by adjusting the Arduino sketch like so:

1. Make sure to disactivate the serial DAT in touchdesigner before attempting to upload any new scripts to the Arduino.  You will receive an error that the port is busy.
   
   
   
   
2. Upload the new sketch:
• void setup()
  {
    // start serial port at 9600 bps:
    Serial.begin(9600);
  }
  void loop()
  {
    delay(1000);
  
  
    // Hello World, instead of int i = 1234
    String s = "Hello World";
    Serial.print(s);
    Serial.print('\n');
    float f = 321.7;
    Serial.print(f);
    Serial.print('\n');
  }
3. Activate the port on the serial DAT.
4. The new output is shown.
   

Sources:

https://www.derivative.ca/wiki088/index.php?title=Arduino

Receiving data on the Arduino:

Steps:

1. Upload the following to the Arduino:

//

// Parse incoming messages consisting of three decimal values followed by a carriage return

//  Example  "12 34 56\n"

//  In TouchDesigner:     op('serial1').send("12 34 56", terminator="\n")

//

char buffer[16];   //maximum expected length 

int len = 0;

void setup()

{

  Serial.begin(9600); 

}

void loop()

{

    if (Serial.available() > 0) 

    {

        int incomingByte = Serial.read();

        buffer[len++] = incomingByte;

        //

        // check for overflow

        //

        if (len >= 16)

        {

            // overflow, resetting

            len = 0;

        }

        //

        // check for newline (end of message)

        //

        if (incomingByte == '\n')

        {

            int red, green, blue;

            int n = sscanf(buffer, "%d %d %d", &red, &green, &blue);

            if (n == 3)

            {

                // valid message received, use values here..

                Serial.print("n equals 3!");

                Serial.print('\n');

            }

            else

            {

                 // parsing error, reject

                 Serial.print("UH OHHH");

            }

            len = 0; // reset buffer counter

        }

    }

}

2. Add a text DAT to the touchDesigner project.  

3. Go to viewer mode and type in the following:  op('serial1').send("12 34 56", terminator="\n")

4. Right click the view mode button and click “run script”.

5. The serial DAT should print ‘n equals 3!’

Now we have successfully read data from the Arduino, and sent data to the Arduino.  Let’s see if we can use this knowledge to control an led via a switch on touchdesigner…

Controlling an LED with TouchDesigner:

We are very close to actually doing something cool… In this section we’re going to take the basics from the last two tutorials and use what we’ve learned to control an LED on the Arduino with the same line of python code we used in the last section.

So first we’re going to need to do some setup on the Arduino to make sure that is working and then we’ll move on to Touch Designer.

Set up the RGB LED on Arduino:

Use this diagram as a guide. 

You will need:

• An Arduino (I’m using the Elegoo Mega 2560)
• A breadboard
•  (4) Male to Male wire (preferably black, red, green and blue for mental ease)
• An RGB LED
• (3) 220 ohm resistors

Steps:

1. Make your Arduino look like the picture above.
2. Connect Arduino to your computer

Checking the RGB LED:

Use the script provided below to check that the Arduino is set up correctly.  DON’T SKIP this step.  It will save you headache later should problems arise.

• Copy and paste the below script into Arduino IDE

//Test script for RGB LED and Touch Designer tutorial

//12.24.18

// Once uploaded, the LED should be red

//Define Pins

#define BLUE 3

#define GREEN 5

#define RED 6

void setup() {

  //define the three pins as outputs

  pinMode(RED, OUTPUT);

  pinMode(GREEN, OUTPUT);

  pinMode(BLUE, OUTPUT);

  digitalWrite(RED, HIGH);

  digitalWrite(GREEN, LOW);

  digitalWrite(BLUE, LOW);

}

//Define variables

int redValue;

int greenValue;

int blueValue;

//Main Loop

void loop() {

  redValue = 255; // 1 to 255 to change the color

  greenValue = 0;

  blueValue = 0;

  // Input color mix into RGB LED

  analogWrite(RED, redValue);

  analogWrite(BLUE, blueValue);

  analogWrite(GREEN, greenValue);

}

Upload the Script:

Now we upload the correct script to the Arduino.

• Copy and paste the below script into Arduino IDE

//

// Parse incoming messages consisting of three decimal values followed by a carriage return

//  Example  "12 34 56\n"

//  In TouchDesigner:     op('serial1').send("12 34 56", terminator="\n")

//

//Define Pins

#define BLUE 3

#define GREEN 5

#define RED 6

//Setup buffer

char buffer[16];   //maximum expected length

int len = 0;

void setup()

{

  Serial.begin(9600);

 

  //define the three pins as outputs

  pinMode(RED, OUTPUT);

  pinMode(GREEN, OUTPUT);

  pinMode(BLUE, OUTPUT);

  //set all pins to be off (the led will remain off until we run the script in TD)

  digitalWrite(RED, LOW);

  digitalWrite(GREEN, LOW);

  digitalWrite(BLUE, LOW);

}

void loop()

{

    if (Serial.available() > 0)

    {

        int incomingByte = Serial.read();

        buffer[len++] = incomingByte;

        //

        // check for overflow

        //

        if (len >= 16)

        {

            // overflow, resetting

            len = 0;

        }

        //

        // check for newline (end of message)

        //

        if (incomingByte == '\n')

        {

            int redValue, greenValue, blueValue;

            int n = sscanf(buffer, "%d %d %d", &redValue, &greenValue, &blueValue);

           

            if (n == 3)

            {

                // Input color mix into RGB LED

                analogWrite(RED, redValue);

                analogWrite(BLUE, blueValue);

                analogWrite(GREEN, greenValue);

            }

            else

            {

                 // parsing error, reject

                 Serial.print("PARSING ERROR, REJECTED!!!");

            }

            len = 0; // reset buffer counter

        }

    }

}

Set up Touch Designer:

Now that the Arduino is setup and tested, we can set up touch designer as a controller. 

1. Open a new TD project

2. Add a Serial DAT

a.       Connect to the correct COM port

b.       9600 Baud Rate

c.       One Byte Per Line

      3. Add a Text DAT

a.       Open viewer mode and add this line of code (same as before):

                                                               i.      op('serial1').send("12 34 56", terminator="\n")

      4. Right click the view mode button and press ‘Run Script’

a.       Or press Ctrl+r with text DAT selected.

      5. The LED should now be on and be a light blue color. 

•        Now play around with different color mixes to ensure it’s working and that you understand what it’s doing!

a.       For red: “0 0 255”

b.       For green: “0 255 0”

c.       For blue: “0 0 255”

d.       For purple: “255 0 255”

e.       For yellow: “255 255 0”

Please visit my YouToube page for a walkthrough!

That concludes this tutorial!  You should now have a basic understanding of how to communicate between Touch Designer and an Arduino.  With these fundamentals, you can do much more.  The only limit is your imagination and your patience.  Please let me know if this tutorial was clear.  I want to make it easy for us all to learn and grow!  Thank you all for your time.

-