16. Interface and Application Programming¶

Assignments for this week

Group Assignment
compare as many tool options as possible
Individual Assignment
write an application that interfaces a user with an input &/or output device that you made

Individual Assignment¶

Processing¶

I used processing to create my first app and controlled LEDs hooked up with Arduino via serial communication.

Processing is an open-source graphical library and integrated development environment (IDE) / playground built for the electronic arts, new media art, and visual design communities with the purpose of teaching non-programmers the fundamentals of computer programming in a visual context.

Creating UI¶

Download processing from here.

For creating custom user interfaces, download/install the ControlP5 library.

Next, open a new sketch and give it a name. In my case, as this was my first app so I used MyFirstApp.

First, You need to create a window of any size (size(300, 400)) and you can give any color to it(background(150, 0,150)).

Next, write any text using text(“xyz”, length, width) syntax.

Add buttons. Here, you have to define the size, position, and name of the button.

I created 4 buttons.

I tried various settings for fonts, size, and position so the text looks a little bigger and readable.

Here, I set up the serial communication and added on to which port the commands would be sent.

Functions to tell on which function would be executed on pressing/sending a particular character.

clilck here) to download the Program.

Arduino Code¶

This code, I wrote to turn on the red, green, blue led on pressing r, g, b button respectively.

int RED = 9;
int GREEN = 10;
int BLUE = 11;

void setup() {
  pinMode(RED, OUTPUT);
  pinMode(GREEN, OUTPUT);
  pinMode(BLUE, OUTPUT);

  Serial.begin(9600);
}

void loop() {

  if (Serial.available()) {

    char val =  Serial.read();

    Serial.println(val);

    if (val == 'r') {
      digitalWrite(RED, HIGH);
      Serial.println("red");
    }

    if (val == 'b') {
      digitalWrite(BLUE, HIGH );
      Serial.println("blue");
    }

    if (val == 'g') {
      digitalWrite(GREEN, HIGH);
      Serial.println("green");
    }

       if (val == 'o') {
      digitalWrite(RED, LOW);
      digitalWrite(BLUE, LOW );
      digitalWrite(GREEN, LOW);
    }

  }
}

clilck here) to download the program.

Connections¶

Positive legs of the LEDs- red, green, blue are connected to pin no. 9, 10 and 11 pins of the Arduino. The cathode of the LEDs is grounded using a 220ohm resistor.

Final Outcome¶

In the video, you can see the LEDs are turning on and off on pressing the buttons in the processing app.

MIT App Inventor¶

MIT app inventor is an open source web application program provided by Google to create software applications for the Android OS.

Creating UI¶

To start with, first, go to app inventor’s website and create an account or sign in with google account.

After signing in, you are ready for creating an application. At the left-hand side of the page, there are various options which can be added in the app. I added a few buttons to turn on/off the LEDs.

At the right-hand side, there are the properties of the palette you are using in your app. Here you can change the size, position, color, add text, etc to the buttons and other interfaces.

I added five buttons to my app. 3 for turning on the three LEDs, one for turning off all LEDs and one for the animation of the LEDs.
Next, to control the board with the mobile, add the Bluetooth connectivity. This you will find again at the left-hand side under connectivity option. I also added the image of the Bluetooth button so that it is easier to understand the purpose of the button in the app.

Now when the UI is ready, Click on the blocks tab at the top right corner to program your buttons.

First, I added blocks for searching the available Bluetooth devices and connecting to the selected device.

Then define the functions of the buttons. Here, you have to define when a button is pressed, what would be written to the serial port.

Next, click on build option(at the top of the page) and create the .apk file of the app. There are two options, first one is to generate the QR code and the other one is to save the .apk file to your computer which then you will have to copy and install in your phone.

Download app)

Arduino Code¶

In the code, first, we have to add the Bluetooth serial library and set up the communication between the phone and the esp32 board over inbuild Bluetooth hardware of the ESP32 module. Then I programmed the board to turn on/off the LEDs on receiving the characters from the phone/app.

#include "BluetoothSerial.h"

#if !defined(CONFIG_BT_ENABLED) || !defined(CONFIG_BLUEDROID_ENABLED)
#error Bluetooth is not enabled! Please run `make menuconfig` to and enable it
#endif


String res = "";

BluetoothSerial SerialBT;

void setup() {
  Serial.begin(115200);
  pinMode(12, OUTPUT);
  pinMode(13, OUTPUT);
  pinMode(14, OUTPUT);
  SerialBT.begin("ESP32test"); //Bluetooth device name
  Serial.println("The device started, now you can pair it with bluetooth!");
}

void loop()
{
  while (!SerialBT.available()); // Wait Until anything is coming from bluetooth client

  while (SerialBT.available()) // Read until the bluetooth client is sending.
  {
    char add = SerialBT.read();
    res = res + add;
    delay(1);
  }



  // Assigning Actions on particular conditions
  if (res == "T")
  {
    Serial.println("Connection Established!!!");
  }
  if (res == "r")
  {
    Serial.println("Turning ON Red led");
    digitalWrite(13, HIGH);
  }

  if (res == "g")
  {
    Serial.println("Turning ON Green led");
    digitalWrite(12, HIGH);
  }

  if (res == "b")
  {
    Serial.println("Turning ON blue led");
    digitalWrite(14, HIGH);
  }



  if (res == "a")
  {
    Serial.println("Animation");
    digitalWrite(12, HIGH);
    delay(1000);
    digitalWrite(12, LOW);
    digitalWrite(13, HIGH);
    delay(1000);
    digitalWrite(13, LOW);
    digitalWrite(14, HIGH);
    delay(1000);
    digitalWrite(14, LOW);
    delay(1000);


  }
  if (res == "o")
  {
    Serial.println("Turning OFF all led");
    digitalWrite(12, LOW);
    digitalWrite(13, LOW);
    digitalWrite(14, LOW);

  }


  res = ""; // clearing the string.


}

Download code)

Connections¶

Connect the anodes of the three LEDs to pin no. 12, 13, 14th pin of the ESP and cathode to gnd with a resistor in series.

Final Outcome¶

Group Assignment¶

This week group assignment was to Compare as many tool options as possible. Here is the snapshot of various interfaces, programming languages and tools we looked at as a group. You can refer to our group page for more details. Here is the attached summary of what we tried as a group.

Cloud¶

AWS
Azure
Google

Conclusion

AWS is the market leader on Cloud and have wide varities of services available.

AR/VR¶

Various games engine
Unity
Cloud Options like AWS Sumerian

Conclusion

Need programming background like C# for Unity, good for creating immersive experineces.

Programming languages¶

Python
Java
Scala
Node.JS

Conclusion

Python is most widely used programming language, Scala is quite difficult for a beginner level. Java is more object oriented and procedural language where Python is functional language. But now Node.js is widely framework for creating full stack applications.

LabView¶

A bit difficult to learn but widely used in industrial applications. LabView does not interfaces directly with any other party hardwares such as Arduino, Raspberry Pi etc but since its a modular programming language it is able to program and read data from external party hardwares through VISA Modules.

MIT App Inventor¶

This I found really easy as we just need to pick and place the blocks.

Learning Outcomes¶

I learned about various ways of making an application to communicate with the microcontroller.
I created an application in processing successfully.
I successfully build an android app to control the LEDs hooked up with Arduino/ESP.

This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.