Interface and Application Programming

This week I hoped to use an input device I had planned during input devices week but never got to make and debug - a simple keyboard. So this week I made a 4-button input board to interface with a browser and display the input interactively. I wanted to make a simple display window showing the numbers "1" "2" "3" or "4" depending on the button pressed. This week turned out to be much more difficult than I thought but my friend and I were eventually able to get it off the ground using p5.js as an interface. My first step was programming the keyboard to output the desired characters.

A friend of mine who works in software design suggested using p5.js as a web interface, so I took some time to get familar with it and then attempted to build a pop-up browser window to display the characters transmitted over the serial-USB line. I was familar with how to construct a window of a specified size and color in html, but struggled to understand how to interface it. p5 actually makees this very simple and allows you to communicate with the serial port using javascript commands. You are able to specify in the javascript code when to commect and disconnect from the port, which port to connect to, and to refresh the display when new data arrives.