Final project writeup

This writeup reviews Navya and Diego’s final project

Concept: What was your project about? How did you use technology to accomplish this? What design principles did you apply?

Dwelling on the theme of space, we decided to work on a game that would combine travelling across outer space and also travelling an actual (but small) distance. For that reason, we decided to do a project that would allow the user to “travel” space by controlling a spaceship.

For that reason, we settled on creating a final project that was comprised of a) a spaceship, b) a controller and c) a playground.

The player controlled the spaceship (a) using a controller (b), and he or she moved it around a designated space (c) that represented the galaxy. On a monitor we displayed different tasks that the player had to complete by moving the spaceship to certain planets. We used sensors hidden beneath the playground to control the progress of the game.

To create these elements, we used different materials (electronic components, like motors and arduinos; and manmade and natural elements, like acrylic and wood). In terms of technology, we used electronic components (motors, XBees, shields, arduinos, and others) and software (arduino, processing) to achieve movement and communication.

We used XBees to communicate the movement of the joystick to the motors through arduino. By reading the joystick movement, we would return a “case” (1 = forward, 2 = left…) and that would be sent to the motors which then would act accordingly. That way, we controlled the movement of the spaceship.

Secondly, we used sensors to control the story line. These sensors were wired beneath the plywood and they sent information to arduino. Then, communication with processing ensured that the progress was recorded and it changed the story line displayed in the screen.

In short, we used electronic components and other materials, programs like arduino and processing to allow the player to drive a spaceship through space in a mission.


Hand drawn sketch, computer drawing, or a photograph of the overall project


Discuss the materials and construction techniques. Why did you chose these? Knowing what you know now, would you have chosen different materials or techniques?

To create this final project, we used several different materials and technologies.

For the spaceship we used an Arduino, an XBee, XBee and motor shields, two 9V batteries, two motors with wheels attached as well as a normal wheel. The components were mounted onto a piece of acrylic and on top of all, we had a Lego Star Wars spaceship. We mounted the components using screws and zip ties, ensuring that the motors and most of the wiring were hidden underneath the acrylic. Only the arduino and the shields were slightly visible, but they were mostly covered by the spaceship.

For the controller, we used a joystick that was connected to an Arduino, with its correspondent XBee and XBee shield. The controller was overall made out of laser-cut acrylic, using the website We mounted the joystick with screws, and had the arduino, XBee and batteries hidden inside the controller.

We wanted the project  to be as clean and straightforward as possible, keeping in mind that the simpler the interface, the better the user experience will be.

Lastly, the playground was a combination of hardwood, plywood and sensors. Eight sensors were hidden beneath a plywood platform that we painted black to recreate space. Over the edges of the playground, we built barriers that aimed at preventing the spaceship from falling as well as showing the player where each planet was. We had the sensors wired up beneath and connected to a breadboard and an arduino mega. The latter was directly connected to the computer, and it sent the information received by the sensors.


What did you have to learn in order to complete your project? How did you learn this? (Include links to any useful resources)

We had to learn a lot in terms of improving the quality of the materials and presentation of our project. With regards to hardware, we had to ask for help from both the wood and scene shop to gather the materials and build the playground. In terms of software and circuity, we had to learn how to use wireless communication to control the spaceship remotely. We had to learn how to use a MotorShield to control the movement of our spaceship. Furthermore, we also had to understand the circuitry and design of the spaceship.

There are a host of YouTube videos and online resources that explain how to establish wireless communication using XBee modules. After browsing through a few, we managed to get a brief understanding of how they function. We then approached Professor Shiloh and he helped us set up the communication between two XBees.

Adafruit has a comprehensive tutorial on how one can get started with using the MotorShield. After reading through this tutorial and running the example program on a motor, we could understand how to control the MotorShield to move as we needed. The library is pretty straightforward, and the tutorial gave us everything we needed to know.

Lastly, in terms of “hardware,” working with wood was a bit difficult due to the fact that none of us had the proper tool training. Using the jigsaw was challenging because we had to find materials of the right length, and finding nice surfaces to use the tool was very hard, but nonetheless we had a lot of fun. We really enjoyed building and painting the playground because it was a very practical, rewarding activity.


Describe the electronic and electrical part of your project

We had 3 main components in our project and there were electrical components in each of them.

  1. The Spaceship: The Spaceship consisted of an Arduino, a MotorShield, a XBee shield, a XBee, 2 DC motors, 2 wheels and 2 9V batteries. It moved according to the values sent by the joystick (b)
  2. The controller: The controller was made up of an analog Joystick that was connected to an Arduino with its correspondent XBee and Xbee shield, as well as a 9V battery.
  3. The playground: as stated before, the playground was made of wood but it had a set of sensors underneath. We had 8 sensors, a capacitor and an Arduino Mega. 

Overview, describing the general operation

The player controlled the spaceship with the joystick. He or she moved it around the playground and was asked to complete tasks (i.e. go to Mars). These tasks were completed by moving the spaceship to different locations. When the task was completed, the player was prompted to the next mission.




Play area:

Describe the software part of your project

We had 4 sketches running at the same time, each taking care of different parts of the project:


  • Spaceship controller: records the movement of the joystick
  • Spaceship move: uses the information from the first sketch to move the spaceship
  • Play area Arduino: reads the position of the ship (has it been to each planet yet?) and send to processing
  • Play area Processing: displays the story line and prompts the player to each mission


Overview, describing the general operation

We had three different parts which required individual arduino sketches to run. With one sketch, we recorded the movement of the joystick. The second sketch transmitted this information to make the motors move.

A third sketch read the position of the spaceship, then transferred the information to processing. The processing sketch directed the user to different planets in the play area.

Upload your program(s)

Spaceship controller:

Spaceship move:

Play Area Arduino:

Play Area Processing:

Describe the mechanical part of your project

The playground was constructed of a 1,2 x 1,2 m plywood piece that was nailed to a frame that elevated it 2 inches. Lastly, 3 of the sides were protected with barriers that were made out of thin plywood. It was all painted black to simulate space.

What were the 3 most difficult parts of your project?

What we initially assumed to be the most difficult aspects of our project were not really that difficult. Learning how to work with XBees and the MotorShield took no time at all. The most difficult parts of the project were construction of the different components and getting them to work.

We had a lot of problems with the batteries, since they kept running out of juice. Furthermore, finding the materials for the playground was hard and we also required a lot of help from the Wood Shop people. Lastly, having the XBee inside the box of the controller made communication harder.

Knowing what you know now, what would you have done differently?

Definitely we would have started the project earlier. That would have given us room for improvement.

We would have liked to have a bigger joystick, and maybe instead of doing it wireless we could have a bigger box fixed to the table that was wired to ensure that there is no lag in the communication.

More pictures and videos

Available on this album

Progress report

Navya and I stayed after class to work on our project. We figured out the prototype for the spaceship and we took a stab at the code that will control its movement.

Navya wrote the code below, which controls the bot with the arrow keys. We are still figuring out how to make it stop.

Arduino Code

Processing code:

Today, we will finalise the bot and look at how to sense the presence of bot on the playground. Furthermore, here is a short to do list of things we ask ourselves 

  1. Computer vision: how are we going to do the recognition, color or brightness? What is the code for this? 
  2. Figuring out communication: once we have the computer vision code done, how do we make the machine learning software communciate with the Xbee?
  3. Code the story line: this is, after creating the playground, how do we code the story behind it? Is it going to be with for or if statements? how do the sensors we are using work??


Final Project

As you may have seen in Nav’s post, we are working together for our final project. After a short discussion, we came to the conclusion that we had more to gain from merging our projects into a more complex, but also more interesting final project for Intro to IM.

The main idea is to have a space ship that will be moved around a play area by the user. This spaceship would essentially be a mounted on a little robot which would move around according to the movements of the player. The spaceship would interact with this play area and follow a certain storyline that we come up with. The storyline is space based, we still have to think it through. We will use the laptop’s webcam and machine learning to use  some hand gestures to direct movement. 

Nav came up with this diagram which I will use in my post too. 


We will need:

2 Laptops. 1 runs the spaceship, the other runs the play area – refer diagram above.

SpaceShip – Lego spaceship that will move around and interact with the play area.

Runs on Arduino code if processing cannot connect to XBee

Items – 1 Arduino, Acrylic sheets, 2 Motors, Motor Shield, 2 Wheels – choose the right ones, XBee shield on it for reception of commands

Play Area (space) Contains sensors that detect the presence of spaceship

Items – 1 Very large cardboard piece, 1 Arduino, Sensors (depending on number of bases), Black paint/cloth

Human Interaction Controls the movement of spaceship

StoryLine Gives a purpose to the movement of spaceship in the play area and makes it more interactive

The hardest part will definitely be figuring out the communication with XBee, building a robot with a sustainable power source that we can move around and finalise the design before the 14th, time constraints are the hardest part of the assignment, for sure. 

Homework due Monday November 27


Last week, I went to the Louvre, something I recommend to everyone who has spare time and 30 dirhams (if under 22 y.o.). During my visit, I saw two pieces that inspired me for this project. Firstly, a sculpture by Alexander Calder, an American sculptor and originator of the mobile, a type of moving sculpture made with suspended shapes that move in response to touch or air currents. Secondly, I saw a painting by Mondrian, a Dutch artist that is considered to be one of the best of the 20th century. 

Here are some pictures of both pieces I took during my visit:



Since both pieces are very simple (at first sight) and share colour scheme, I thought about how would it be like to have a Mondrian that responded to air or touch. Since I don’t have a sensor that I can use to read air currents, I worked with some code to use the mousepad as a way to change the three-dimensional appearance of one of Mondrian’s most famous paintings.


Using the 2D image (Mondrian’s painting) and using some 3D translation techniques that you can read more about here, we get a rectangle for each pixel in three-dimensional space. The z coordinate is determined by the three variables: the position of your mouse (X and Y axis) and the brightness of the color. Brighter colors appear closer and darker ones appear further.

A few extra comments that I did not mention in the actual code so that it did not get messy:

a) The P3D behind the size is what specifies the P3D renderer and you use it for the 3D functionalities.

b) In the line below, you establish the dimensions of each cell. If instead of 2 you type 1, you get very small cells and a very precise and interesting effect. Warning: it is heavy, and the computer takes a while to run it. The bigger the number, less definition but it runs faster. I would go for 2, since it allows you to have a pretty good effect and it does not slow the computer too much.

c) In the line below is where all the action goes on. Depending on whether you would like to change the effect with your mouse’s X position, Y position, or how does the movement react to those, you do all of that here. Feel free to experiment with it!



Homework due Wednesday November 22

Although I have always been interested in technology, I had never been interested in computing or anything related to the theoretical side of technology. In all honesty, I thought that computing was a boring activity that just consisted in writing code or doing computer-related things. Furthermore, computing is defined as “the use of a computer to process data or perform calculations,” which does not sound particularly amusing or creative, thus I never.contemplated the creative side of coding.

Then, when I started taking this class, I understood that computing is much more than the definition given by different dictionaries. I understood that computing is also a creative process that we can use to manipulate or create different programs or digital art, which is something that I have found extremely important at this point in my life. When this semester started, I was very unhappy with my classes because I felt like I was not getting the chance to create or using the things that I was learning to actually create something. For that reason, as of right now, I see computing as a creative outlet. 


Homework due Monday November 20


Here, we needed to work with the serial communication between Arduino and processing basing our code in the “hello world” and “dimmer” programs. 

Although it was not complicated, for some reason I started overthinking the assignment and thought we had to actually control the brightness with the processing sketch. It was way simpler.


Here is the Arduino code. It has very small tweaking. 


Here is the processing code. I added a couple lines to make the position and movement over the gradient more visual. It helps you get a sense of dimensions thanks to the display of the numbers in the LCD screen. 


I had to change my port in this line after updating to Mac OS Sierra

Watch out for that

Homework due Monday November 7


First of all, I want to thank Miha, Michael and Arantza for their help. They did not only help with the software but also with the design process, user testing and building the box itself. Thank you so much!!

Initially, I intended to make a game of mazes in which you would control your position with two knobs, the same way that an Etch-A-Sketch works but with different backgrounds. 

Unfortunately, I found the coding to be very very complicated and Michael recommended me to put that aside for a little while. Therefore, the game is a Deluxe Etch-A-Sketch in a laser cut box with an ON/OFF switch, LEDs, good-looking knobs and a very nice button to clear the background. 

Design, thought process, and problems:

Initially, I designed the box this way:

Then, with Michael and Miha’s help, I figured out the final design. We changed the interface, the design, the size and the position of the buttons and knobs, as well as the on and off toggle. I believe it is a very clear interface, therefore I did not deem necessary to add any labelling, and I hope the affordances of the design are intuitive and effective. I still want to work on my final design, and hope that at a certain point it can be bettered and created a box in Illustrator and laser-cut the material and the holes for the hardware. After a little bit of soldering and glueing, this is how it ended up:


There is an interaction between Processing and Arduino; and the code is based off the sketch “graph,” available in the examples that come with Arduino. Below, find both commented codes. Do not hesitate to contact me if you find any ways of optimising the code or do not understand something!






Not this time! Come to Open Studios and you will see the box in action!!

Homework due Wednesday November 1


This assignment had two parts. The first asked us to control a servo with our mouse, which is very similar to the way we control the brightness of an LED. The second assignment was writing a program so that when clicking on a rectangle, your LED would turn on or off.

First part:

As we mentioned in the foreword, this is very similar to controlling the brightness of an LED. In actuality, we just have to map the angle of the servo with the brightness so that when our mouse is on the left, the brightness (and therefore the angle) is 0, which points to the left. Same thing with the highest brightness, which makes the servo point 180º.

Below there’s the code and a video:


Arduino code:

Processing code

Second part:

I am not sure if the code is absolutely working because you can still turn the LED off by clicking on the same part of the square. I will try to figure out a way to avoid this, and will update the code if I find a way!

Arduino code

Processing code



Homework due Monday October 30


For this project, we had to create a piece of computer art. Mine is a symmetrical design that starts as a circle in the middle of the canvas and grows to create a design surrounded by ellipses and other graphics. It is an animation, so it is worth checking out how the designs build up. I was not sure about which final design I liked better, so I will post both projects with their respective code. Let me know which one do you like better!


Depending on the strokeWeight you use, you can see how the animation starts building up until you can see all the shapes. Also, it is really interesting to work with the frameCount by multiplying it to see how it affects the repetition of the designs. 

Check these out to learn more about it:




First animation:

Second animation