I worked on the interfacing assignment during the machining week, and I made the user interface for the team's drawing robot.

First things first, what did I need to do to make the user interface? Guillaume had already made a python script that, given an image, converted it into a list of coordinates that the robot could move between to draw an image (gcode-esque if you will); however, this code was all still just python functions. I needed to make a way for the user to input an image, along with providing them the option to tweak the algorithm's parameters, and then output the gcode, along with a simulated image.

I began by making a simple Flask app in python, allowing me to make a nice api backend that the client could connect to. The flask exposed a post request on the localhost with inputs being the required parameters, along with an encoded image; it then decoded the image, and passed it to the python script. The python script then returned the gcode, along with a simulated toolpath. The flask then returned the gcode and encoded image to the client.

Finally, I built the frontend, which consisted of a simple JS + HTML + CSS app. The user could upload an image, and then tweak the parameters, before clicking a button to generate the gcode. The gcode would then be stored within the browser, waiting for another button on the site to be clicked that would send it to the robot and start the drawing process. After the gcode was generated, the user could see toolpath that the robot would take to draw the image, and modify the parameters if they were not happy with the result. The site interfaced directly with modular things, so the gcode that the UI generated could be directly put into the firmware that the team had already made after being uploaded and sent directly to our machine.

As such, the process for the user is super simple: upload image, tweak parameters, click button, wait for robot to draw. The user does not need to know anything about the python script that is running in the background, or the gcode that is being generated. The user just needs to know that they can upload an image, and the robot will draw it. This was super fun to make with everyone, and I'm really happy I got to build the UI!