Logo academy

WEEK 16

INTERFACE AND APPLICATION PROGRAMMING

Fab Academy 2017 at Fab Lab Barcelona By Trinidad Gomez Machuca

Learning outcome W16

Interpret and implement design and programming protocols to create a Graphic User Interface (GUI).

inter[FACE].

For this assignment i want to try python and processing. I already know what to do for my final interface, i designed a face in rhino, that i made it also in copper with the vinyl cutter, and i've programed it like a touch response with the capacitive sensor. In hardware, when you touch the copper, it triggers a led, a air pomp, servomotor, etc, but in software everytime i touched the copper i want to visualize exactly the area that a i touched, so i will see wich one is better for what i want.

File

Python

First i wanted to try to make my interface in Python code, but I got so many errors that took me one day to fix them and I need to work in my final project. I tried before to programming in python and in my opinion is not difficult lenguaje but my problem is that i just can't fix the problems they appear, i read the comments from a lot of people like me that are starting with this lenguaje, but I just could not fix it.

error

In this case I've installed the Serialpy library wich is the library for the exchange of information between arduino and processing, but it alwaysappear this error so the farthest I've come was to draw manually my draw with the command turtle. It is easy and funny if you are not doing a complex draw. In this case i did line per line and when i finished one half I mirrored the coordenates for the other half. At the end of my draw i just trigger when you click over the circle to disable it and when you press the up button from my keyboard it activate it again.

Processing and Arduino

So after python I decided to go for the easiest, Processing. I'm familiar with this lenguaje because I used before in my master with the kinect. Besides that this lenguaje is very similar with the interface with arduino, is very easy to find how to do something and how to fix a problem because there is so much information on internet that even a 5 year old kid can install a library hahahahahaha.

So the best tutorial i found was this one, Sparkfun tutorial for Arduino and Processing. Here you can understand how this two can interact together in the both ways, either you want to draw a button in processing and trigger a servo in arduino or when you receive data from a sensor you can visualize in Processing. It's a very good tutorial and the best that you dont need to connect nothing, only the arduino, no jumpers, no leds need, anything, so this make your first exercise very easy.

This is how it works. First you have to decide which one will send the data, in my case i want to trigger outputs depending on the capacitive sensors, this i do it with arduino,so Arduino will send data. Then when the processing read this information, it will show in my 3d drawing with part you touched.

Sketch

Arduino

Is very IMPORTANT to know about what kind of variables are you sending, I didn't know this before and it took hours to fix it. In the this video in the 5 min, you can what i mean. Something similar happend to me, i was sending int variables to the serial and in my processing was reading other kind of values. Although I was sending the number 1, the processing was reading the number 10, but the problem was the kind of variable, you need to send this information as a byte inter, after this, everything was ok.

After declare my variables as bytes the only thing i want to do, before to put this code in my final programme, is to send to the serial 4 diferent numbers, thats it, so here you can see i used a delay and send one variable, then delay and send other variable and so on.

Arduino

Here you can see the code that I sed fot sending information to the serial port and eventually after sending, I read the bytes data in the Processing.

Processing

First the Serial library. Serial library is already installed in the processing, so the only thing you need is to call it in your program.

Serial

You have to write the number of your port, the only options in mac are 0,1 and 2. In my computer is the number 1, i know because this is the only option that allows me to see information.

Port

An here is the part where you read the data and compare. So i'm telling the Processing, if you receive information bigger than the number 0, stored in the val variable. Then if this val is the same as the number 1, change the color of my object, if not, let the object with the default color, in this case white, and so on. In arduino I'm sending the information every second, that is why is changing color all the time.

if

Here you can see the code that used to read the information in the Serial port and then I changed the color of the 3d models that I sed to visualize which part it is being touched

Final result applied on my final project

In my final project, every time i touched the copper I triggered outputs and combined with assignment i also sending the byte variables and i can see it in the processing digital draw.

SOFTWARE USED

//Processing

//Arduino

//Python

//Rhinoceros

Links for the Assignment

Interface and Application Programming

Interface and Application Programming Class

Interface and Application Programming Assignments and Assessment

Sparkfun tutorial about connecting Arduino and Processing

DOWNLOAD

Arduino and Processing Files


Fab Academy 2017 Fab Lab Barcelona Trinidad A. Gomez Machuca
IAAC trinidad.gomez@iaac.net