Skip to content

Interfacing and Application Programming

Katie, John and I shall be comparing 2 tools for our group assignment:

  • Turning a microcontroller into a web server and interfacing in a browser
  • Connecting to a microcontroller using the ‘Processing’ platform

Processing

Katie will be using the 'Processing' platform which is a flexible software sketchbook and a language for learning how to code within the context of the visual arts. I really like this platform. It allows you to create sketches rather like you would for an arduino. The difference is that these sketches run on your local computer and can send and recieve information with a connected microcontroller. You need to download the Processing app and the interface looks rather like the Arduino IDE. It also has libraries and example sketches which are a great way to get started.

greenledon whiteledon simplewrite_box

Katies code

sketch led lights on and off with Processing program

(goes into arduino)


      char val; // Data recieved from the serial port
    int ledWhite = 4; // set the pin digital I/0 4
    int ledGreen = 8; // set pin green

    void setup() {
      pinMode(ledWhite, OUTPUT); // set pin as OUTPUT 
      pinMode(ledGreen, OUTPUT);
      Serial.begin(9600); // start serial communicaition at 9600 bps
    }

    void loop() {
      while (Serial.available()) { // if data is available to read,
      val = Serial.read(); // read it and store it in a val
      }
      if (val == 'H') { // if H was recieved 
      digitalWrite(ledWhite, HIGH); // turn white LED on
      digitalWrite(ledGreen, LOW); // turn green LED off

      } else (val == 'L'); 
      digitalWrite(ledGreen, LOW); // otherwise turn green led on
      digitalWrite(ledWhite); // otherwise turn white led off
      }
      delay(100);
    }

(goes into Processing app)

   /**
    * Simple Write. 
    * 
    * Check if the mouse is over a rectangle and writes the status to the serial port. 
    * This example works with the Wiring / Arduino program that follows below.
    */


    import processing.serial.*;

    Serial myPort;  // Create object from Serial class
    int val;        // Data received from the serial port

    void setup() 
    {
      size(200, 200);
      // I know that the first port in the serial list on my mac
      // is always my  FTDI adaptor, so I open Serial.list()[0].
      // On Windows machines, this generally opens COM1.
      // Open whatever port is the one you're using.
      String portName = Serial.list()[1];
      myPort = new Serial(this, portName, 9600);
    }

    void draw() {
      background(255);
      if (mouseOverRect() == true) {  // If mouse is over square,
        fill(204);                    // change color and
        myPort.write('H');              // send an H to indicate mouse is over square
      } 
      else {                        // If mouse is not over square,
        fill(0);                      // change color and
        myPort.write('L');              // send an L otherwise
      }
      rect(50, 50, 100, 100);         // Draw a square
    }

    boolean mouseOverRect() { // Test if mouse is over square
      return ((mouseX >= 50) && (mouseX <= 150) && (mouseY >= 50) && (mouseY <= 150));
    }

ESP32 Web Server

Jonny and I decided to try another way of interfacing with our controllers. If your ESP32 is connected to the internet, you can set it up as a web server. This has the benefit of allowing anyone to interface with your project. They don't need to be physically connected to your microcontroller as in the method above. They would access an interface in a web browser using an IP address that you give them. Here you can see the webpage that is generated by the server:

group_15_1.

Comparison between the two

Processing pros:

  • quick and simple
  • free download
  • examples provided
  • familiar interface (arduino copied)

Processing cons:

  • you need a physical connection
  • lacks excitement

ESP32 web server pros:

  • works wirelessly. you could be anywhere in the world
  • can add your own html easily into the script
  • well documented examples online

ESP32 web server cons:

  • required chip is more expensive
  • requires internet connection to work
Last update: June 21, 2021