Press in Case of Winter

Press in Case of Winter – Emilia Mason

Press in Case of Winter is part of an idea I had almost a year ago. I come from Nicaragua, a country in the tropics, therefore, I am not a big fan of cold weather. Last December I bought myself a “Christmas Palm Tree”, painted the leafs in different colors and the stem in gold, and decorated it with colorful Christmas lights.

img_0030  img_0065

The project consists a button for one to press when in need of tropical music and colors. I wanted to bring the tropics to a room as soon as someone comes in. Play happy/tropical music from Latin America and show bright colors.

Context:

The concept  is inspired by two ideas:

1. Beat the Seasonal Affective Disorder (SAD) or more commonly known as “winter blues” transforming my apartment into a tropical and colorful paradise. Studies have shown happy and upbeat music has a positive effect on one’s mood.

  1. An appropriation of Christmas. I had never thought of the fact that we use real and fake pines as Christmas trees, decorated as if it is winter. Nicaragua is part of the southern hemisphere, December is the beginning of summer and temperatures oscillate between 26 to 30 degrees during Christmas season. I wanted to use a local tree for my Christmas celebration.

The idea is very simple:

When coming in the apartment press the button to warm up your mood. Pressing the button will start a random song from the songs and animation indicated in the P5.Js folder uploaded to Cyberduck.

Codes 🙂

P5.Js Code (Link to Github)

The code is simple:
-Specify the variables for the different songs, all songs and the variable colors for all the frames used for the simple animation.
-Function Preload for the songs and animation.
-Function Setup for canvas and setting up the serialport.
-Function Pressed for button.
-Function Draw for animation.

Arduino Code (Link to Github)

Button input code:
Press for on and press for off.

Circuit Diagrams:

buttoninput_fritzing_breadboardview

buttoninput_fritzing_schematicview_schem

Process Journal:
My idea began a little too ambitious for my skills.

The initial idea was to connect a weather API (taking the weather from Nicaragua) and two Spotify playlists (one for sunny days and another for rainy days). Depending on the weather in Nicaragua the Spotify playlists were going to play either a hyper tropical song or a more relaxed tropical song when the button was pressed. This way I would be able to bright and warm my day here in Toronto and I would also have an idea of how the weather was in Managua (the city I am from).

Since this seemed a little too complicated I decided to start from a very simple idea and start building up from there.

img_9425-1

Step 1: Build and Code the Arduino.
I thought this was very simple, I used an example I found on the internet and I only changed the pin number. I was only going to use 1 button as an input.

screen-shot-2017-11-13-at-12-24-08-am

Step 2. Code P5.Js to preload sound
For this, I used the P5.Js manual and the help of our friend in the rainbow train.

screen-shot-2017-11-12-at-11-18-52-pm

Those resources were very helpful but I still had issues preloading several files of sound and making them random everytime the page would load.

At first, I was trying to make an array to randomize the 3 songs I started testing with. In theory, this was very simple but I was having trouble making it work.

screen-shot-2017-11-07-at-4-43-45-pm

Then, I remembered that Yiyi and Jad did something similar in the past assignment so I asked Yiyi if it would be ok to use her code as an example.

screen-shot-2017-11-12-at-11-24-01-pm

I went to their project’s GitHub and used their code as an example to modify my code. I must say this was very helpful.

screen-shot-2017-11-08-at-4-56-24-pm

Having done the basic for my code, which was to make p5 preload the songs, I wanted to make sure I could connect the P5 code and the Arduino. My plan was that once I had the P5 and Arduino running I would start adding more songs and images and/or GIFs.

Once I had added my p5.serialport.js library to the HTML file and opened p5.serialcontrol and connected the Arduino I realized I am a genius who never wrote a command on the P5 code of what to do with the Arduino.
Orlando from the second year was in the studio and he helped me a little (in Spanish).

img_9426

After that, I was able to write the function pressed and function serial event.

ALAS! The Arduino and P5 were connected and I actually had a reading on my console. But I had a big problem, I had a lot of noise.
screen-shot-2017-11-08-at-5-31-06-pm

That day I had my office time with Kate and she recommended soldering my button and fixing the wires to get rid of the noise.

So, I spent the rest of that day trying to understand WHY ON EARTH I had so much noise.

img_9352-1 23514523_10214722742245113_973481933_o

I tried different buttons, pins, solid and stranded wires, regular breadboard, mini breadboard, no breadboard, and soldering everything I could.

NOTHING.WORKED. !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

At this moment I was starting to stress A LOT  because  I still hadn’t done the playlists on Spotify or had any images/GIFs/Animation show on the screen. The worst part was that the console was reading so much noise and my buttons were hardly working. And I still needed to build a box for the button. I was really concerned about this because my plan was to have a small box that I could stick to the wall next to my door but since my button and board was not working I had no idea what size the box should be.

Finlay and Roxanne H. saw me hyperventilating and were generous with their time. They helped me realize the problem was not with the wires, board, feather, pins, buttons or the USB cable. IT WAS THE ARDUINO CODE!
I fixed it and the noise was gone!

screen-shot-2017-11-13-at-12-24-36-am

That was frustrating, to say the least.

Having my button and code working, after two days lost and wasted. I was finally able to work on the images. I downloaded lots of GIFs to use but I was recommended to work with animations instead. Since I was running out of time I decided to do the easiest animation possible using the P5 Play library and making frames the size of the screen in different colors.

Then I proceeded to make the box:

When I had all the basic pieces I tested everything together and failed:

I changed the button AGAIN and it was FINALLY working!

What would I do to make this better?
1. Not use the arcade button. Find another type of button, a less finicky one.
2. Make a small box and stick it to a wall instead of having it next to the computer.
3. Use a projector. After I presented I realized that what I wanted to accomplish was an experience not just pressing a button.
4. Connect to Spotify playlists and weather API.

References:

Yiyi’s and Jad’s code for assignment 2: https://github.com/JadRabbaa1/phonelessxmas/blob/master/phonelessxmas1/libraries/sketch.js

https://www.mayoclinic.org/diseases-conditions/seasonal-affective-disorder/symptoms-causes/syc-20364651

http://munews.missouri.edu/news-releases/2013/0514-trying-to-be-happier-works-when-listening-to-upbeat-music-according-to-mu-research/

https://www.arduino.cc/en/Tutorial/InputPullupSerial

https://www.youtube.com/watch?v=Pn1g1wjxl_0

http://p5play.molleindustria.org/examples/index.html?fileName=animation.js

https://github.com/antiboredom/p5.gif.js/tree/master

https://itp.nyu.edu/physcomp/labs/labs-serial-communication/lab-serial-input-to-the-p5-js-ide/

https://developer.spotify.com/web-api/tutorial/

Leave a Reply