14. Interface and Application Programming

Individual Assignment

Write an application that interfaces a user with an input &/or output device that you made.

Group Assignment

Compare as many tool options as possible. Link to group assignment

This week was fun as I learned how to develop a app as well as interfacing with Processing. Attending the sessions of Professor Neil and Rico was the main source of this week’s learning. For this week I decided to use Processing to interface with an output device(led) of my input board. So first off I started experimenting with some of the processing codes that Rico introduced us to.

You can download processing from here and almost everything you need to learn about processing, you can find it here.

Rico gave us a nice hands-on live tutorial on how to go about Processing and with his help I could experiment and learn alot about how the processing codes are similar to arduino codes. So with the help of his lecture, I did the following experimentations;

Creating canvas

I tried to draw a canvas with the size of 300 by 300 pixels with the color code of 150 where ‘0’ is black and ‘255’ is white and anything in between the number range will result in the mixture of white and black in the ratio of the number given. For the following it came out grey but with more of black since I used ‘150’.

Creating shapes in canvas

Making a circle and using RGB colors.

Making a Rectangle using RGB colors.

Creating button for mouse

You can write texts, make basic 2d shapes, make shapes that moves with the movement of your mouse, animations, transformations and lots more. You can learn how to do so from this basic tutorials.

I used a simple mouse click processing code where by if left clicked on the canvas it would turn on the led of my input board and when I left clicked it will turn it off. I used the following processing and arduino codes for interfacing;

The successful working of the led turning on when I left click the mouse and turning off of the led when I right clicked my mouse is shown in the video below;

Original files

Arduino code

#include <SoftwareSerial.h>

#define Rx = 0
#define Tx = 1

SoftwareSerial Serial (0, 1);

  int ledPin = 3; //led pin 

void setup(){
  Serial.begin(9600); //initiate serial communication at 9600 baud/sec
  pinMode(ledPin, OUTPUT); //sets pin 3 as output
 }

void loop(){
  if (Serial.available() >0) {
  char val;                             
  val = Serial.read(); //create 'character' datatype variable 'val' 

  if (val == 'g'){ //if 'g' received over serial
      digitalWrite(ledPin,HIGH); //turn LED ON
     } 
     else if (val == 'h'){
      digitalWrite(ledPin,LOW); //turn LED OFF
    }
  }
}

Processing code

//LED glow program for fabacademy assignment
//Written by Thinlay Namgyal
//Date: 12/06/2022

import processing.serial.*; //Import processing serial library

Serial port; //create local seral object from the serial library

void setup(){
  size (300,300);
  String portName = Serial.list()[0];
  port =  new Serial(this, portName, 9600); //set 'port'variable 
}

void draw(){
  background(0,0,0);
  if (mousePressed && (mouseButton == LEFT)) {
  port.write('g');
  }else if (mousePressed && (mouseButton == RIGHT)){
    port.write('h');
  } else {
    fill (125);
  } 
}

---

Last update: July 11, 2022