Experiment 5 — Leave A Window Open For Me

1.Project title: Leave A Window Open For Me

2.Project description: 

For this project, I’m aiming to create an installation that has space within a box build with mirror acrylic sheets and wood. It is meant to be filled with mirrors to form a room that has infinite reflections. It is meant to reflect my own experience in new york when I was going through an emotional break down for a long period of time. I was suffering from insomnia and depression that I had no motivation to do anything, the window was the only thing that I stare at the most, from day to night, from rain to shine.

I managed to step out of the emotional trap eventually, but looking out of the window seemed to become one of my daily routines. Except for this time, things have changed.

There will be a 3D printed bed placed in the middle of the installation to represent my room and my mental status. One side of the board would have a cutout and play the role of the window, which will have the led matrix panel placed behind it.

The audiences are expected to observe the installation from the peek hole at the front board.

3.Parts / materials / technology list:

LED matrix panel, Arduino UNO, acrylic sheets with mirror backing, glue gun, 3D printer, laser cutting machine, transformer adapter, tool power cord, etc.

4.Work plan: 

Nov 21-22: Proposal & Discussion

Nov 23-24: Coding & Researching

Nov 25-26: Purchasing materials & Building small prototype & test

Nov 27-28: Coding & 3D printing & Laser cutting

Nov 29- Dec 3: Debugging & Assembly

Dec 4: Open show

5.Physical installation details: 

The small room in the graduate gallery which is always used to play films because preferably a darker space, a pedestal that has the installation on will be placed against the wall.

 

Initial sketches:

img_3487 img_3488 img_3489 img_3490 img_3491 img_3492

img_3860

Experiment 3: Weave Your Time

screen-shot-2019-11-04-at-22-20-06

Project Title: weave your time

Name of Group Member: Neo Nuo Chen

Project Description: People in this modern society are going under a lot of stress lately, they can’t focus on one task because there are so many distractions. This project is to help them to calm down and take some time to focus on one thing, and it’s something that is simple but grants major satisfaction after they finish. Based on my previous professional background, I decided that a relaxing activity would be weaving. It is an ancient technique that has been around for over xxx years. The anticipant is asked to place their cups onto the coaster that I laser cut earlier. The pressure sensor underneath the small rug that I weaved would detect the weight of the liquid, it will then trigger the reaction on the screen. What happens is the intro page would be gone and the background color would change.

 

Project Process

October 22

Since this project was a solo project, I wanted to somehow collaborate what I’ve learned in the past with it, so I started to think of ways of interaction and the use of a loom came into my mind, the aesthetic is very old-fashion but mixing with laser-cut transparent acrylic would be interesting. Also, I wanted to wrap aluminum foil onto the loom and the head of the shuttle, so that whenever the head touches the edges of the loom(which were wrapped with aluminum foil), it would trigger something. But the more I think about it, I realized that it was not possible since the cable has to be attached along and would be weaved into the piece. 

I then decided to focus on the pressure sensor first, to see what it could be used for. Because it was a pressure sensor, the reading value would alter base on how much pressure I’m putting on it, it would be interesting to somehow control the range and leads to a different reaction.

October 24

I started experimenting with the pressure sensor by using the code Kate and Nick shared with us on Github.

img_2659-2 img_2658-2img_2656-2

 

October 25

I personally really like the sound of rain, as well as the visual of it, hence the reason why I wanted to show them both on the screen. I found out that there are a lot of different effects that you can create by using processing from Daniel Schiffman’s coding challenge. And the purple rain that he made was exactly what I was looking for. So I worked with that code and changed a few parts so that I could alter the rain from only being purple to constantly change colors throughout the whole thing.

screen-shot-2019-11-04-at-19-49-16screen-shot-2019-10-28-at-14-10-52

I also went to laser cut a loom with 1/4 inch wood for an early test.

img_2003 img_2004

And I weaved a small sample with the loom.

img_2168 img_2169

October 28

Had my pieces laser cut with transparent acrylic to create the post-modern aesthetic that I was looking for.

img_2237 img_2256

October 29

Ever since I had the idea of having people to experience my work, I got a bunch of plastic cups and ran the test to see the value. The sensor was not as stable as I imagined especially when the cup is small, it was hard to navigate the exact value for different amounts of liquids.  So I just decided to put an intro image which would be taken off once the cup is filled with any amount of liquid and when the cup goes empty the image comes back. I think that this could be a good idea to work as a reminder to tell people that their cups are empty and in need of a refill. Also works well when multiple guests are around, they can read the intro image and follow the instruction individually.

October 30

Continue working on some more weaving so that I could give my breadboard and cables a disguise:)

img_2378 img_2400 img_2416 img_2477

img_2580 img_2581 img_2585

 

Code Repository:

https://github.com/NeonChip/NeoC/tree/Experiment3

Reference:

5.2: If, Else If, Else – Processing Tutorial https://www.youtube.com/watch?v=mVq7Ms01RjA

How to add background music to Processing 3.0? https://poanchen.github.io/blog/2016/11/15/how-to-add-background-music-in-processing-3.0

Coding Challenge #4: Purple Rain in Processing https://www.youtube.com/watch?v=KkyIDI6rQJI

Las Arañas Spinning and Weaving Guild https://www.lasaranas.org/

Medium rain drips tapping on buckets and other surfaces, Bali, Indonesia https://www.zapsplat.com/?s=Medium+rain+drips+tapping+on+bucket+&post_type=music&sound-effect-category-id=

EAT ME!

• project title 

EAT ME!

• names of group of members 

Neo Chen & Rajat Kumar

• project description 

This game that we created was first inspired by the classic game ——SNAKE, which we believed that most people have played before. We want to bring this game into a more physical interactive form. It is a game that requires all the players to use their phones, and the number of players is preferably to be even since the game plays in pairs in each round. (When there’s a player singled out, he/she will be given an extra number to balance  out the game.)

Instruction:

Shake the device to generate your random number and don’t let anyone else see it 🙂

You will be competing in pairs, show your number to your opponent 

The person with bigger number wins

The person who loses will have to follow the winner for the rest of the game(forming the snake)

But that doesn’t mean your game is over

Ever since you joined the winner, your number goes to the winner

So when they go to the next round, they are comparing numbers including the loser’s number

Same for the rest of the rounds, the person who singled out will get extra points towards the total to balance out the game 

The last person standing wins the game!

Extra: The final winner will have a long line of “losers” following behind, forming the shape of the SNAKE, the winner will be asked to take a selfie with everyone else standing behind.

• visuals (photographs & screenshots)

img_9596

img_0091 5fd94222-be73-42d2-8cc9-cbed9fb7d4bd img_0309

 

we found some existed code online for creating face tracking and filter in P5js that we wanted to collaborate with, but unfortunately it could only work on the website and when we try on the phone, the image we got was lagging and the filter would not show up, this is not what we were looking for, so we decided to give up on this as part of our game.

img_0443img_0384img_0384

 

 •edited video of the 20 screen experience (1 minute or less)

•code https://github.com/Rajat1380/CODE_OCAD/tree/master/EXPERIMENT_1

 

• Project Context 

Our first intention was to make a mini ice breaker game since all of us just joined the program and barely know each other, so we did some research on the social games and was looking for a good one to transform into our game, but we could not agree on one that represents our idea the most. One day this thought just popped up in my mind, why don’t we have everyone to play the snake game that the most of us have been played before, but this time, we are giving it a twist so that players are given more chances to be interactively involved. 

After finalizing the concept of our game we brokedown development into the minimum viable product of coding to function the game. We first prioritized the random number generation and started building. Preload function came to rescue us and initially, it was working fine with 4-5 images to generate randomly but failed with 21 images. We spend most of the time figuring it out and then Jun Lee came to us and pointed the error out. The main problem was with the for loop, It ran fast before loading all the images and we see nothing on the screen. We have to preload all the images manually. Images showing on the desktop but not on the mobile. The problem was that we were previewing in the present mode and it got solved by previewing in fullscreen mode. We had to fight with adobe XD for 3 hours to get the png format for the images.

untitled-2

%e6%9c%aa%e5%91%bd%e5%90%8d%e4%bd%9c%e5%93%81-3

img_0734  img_0736 img_0737

We originally wanted the game to be a combination of the snake game and the bluffing game by granting the players to bluff about the number they randomly draw, which would also be more challenging, like a psychological game. But it’s going to lengthen the game time for each round and we were having trouble with how to get people in pairs (which we decide later to use the hand written card for help). Not getting to use the network between phones was no doubt a huge issue we faced because we wanted to lower the chance of people drawing the same number, to solve this, we came up with the solution of having the ones who compete for each other and have the same number to redraw. (Although the chance for people to get the same number and also getting paired are pretty low.)

We implemented the random number generation with device shake ability. We have MVP of our game and we tested game with the numbers. We did playtest with more number of players and found one flaw in our game. We did the math of pairing and after the 3rd and 4th round of game one player got left out. We need to balance the gameplay in order to maintain the fun aspect of the game.

img_0319img_0326

After some maths, we decided to give 15 points in 3rd and 25 in 4th round to the player who got left out.

img_0148-2

Then we decided to develop some more functionality. We implemented the button, as we were thinking about the bluffing aspect of the game. Surprisingly button was showing on the desktop but not on the mobile phone. We searched on StackOverflow and got one clue that there is some openGL that we have to write in HTML. We tried but failed. All we wanted with buttons to hide the number and show them when required. It did not work out, so we shifted our focus to change the background of the number in order to make it less readable. At the end of the game, we thought of creating a selfie function along with a face tracking filter, we found some existed code online for creating face tracking and filter in P5.js that we wanted to collaborate with, but unfortunately it could only work on the website and when we try on the phone, the image we got was lagging and the filter would not show up, this is not what we were looking for, so we decided to give up on this as part of our game.

The major issue we had during the whole process, was to bring what we wrote on the P5js web editor into mobile devices, we found out that a lot of functions that we wanted to put into our game could only work on the computer which limited the final result that we wanted to present. 

• Presentation

img_0470 img_0471 img_0472

photo_20190927151904_6553767_0

(The snake formation)

• Reference

Face Tracking and Filter https://editor.p5js.org/jeeyeonr/sketches/Hyy5W3GiQ

Input and Button https://p5js.org/examples/dom-input-and-button.html

Create Button https://p5js.org/reference/#/p5/createButton

Device Shaken https://p5js.org/reference/#/p5/deviceShaken

Set Shaken Threshold https://p5js.org/reference/#/p5/setShakeThreshold

Snake (Video Game Genre) https://en.wikipedia.org/wiki/Snake_(video_game_genre)

Bluff (Poker) https://en.wikipedia.org/wiki/Bluff_(poker)