Week 12: Amina & Susanne Update

This week, Amina and Susanne worked independently on the physical and visual sides of their project. Amina built the Arduino circuit while Susanne created the visuals in P5.js. The main challenge for Amina working on getting input from Arduino in the form of entering a password was how to send the input to Processing (used for prototyping purposes before connecting to P5.js) without breaking. Susanne’s main challenge was to arrange video input in P5.js as x and y coordinates behaved unexpectedly.

Now, we need to debug the Arduino side of our project possibly sending multiple input at once and figure out the serial communication between Arduino and P5.js which needs another ‘communicator’ in between as we cannot send directly to the web.

After the independent work stretch, we now shared our code to debug together, looking at previous examples and seeking support from Aaron and the Internet.

Finals Update – Nathan

Arduino Board

Currently, I have wired up the Arduino with everything I want to include in my final. It includes:

  • An ultrasonic distance sensor
  • A piezo
  • A photoresistor
  • A button
  • A knob (potentiometer)

Here is a picture of the layout:

Code

For code, I currently have coded in the conditions for when the piezo is making sounds, as well as how its sound is being made. I also have the distance sensor and photoresistor coded in as functions, but I have not fully integrated them with the system in general.

I haven’t gotten to the processing side of the code yet, but I am planning to make several boolean values on the Arduino side to represent the signals being sent to processing. For example, if there is a friendly ghost, I will simply send the boolean to processing. I think this approach simplifies communication between the platforms. In my opinion, the more complicated alternative would be to send the raw values of the sensors and buttons on the Arduino to processing.

Here is the code I have now:

#include "pitches.h"

int piezo = 2;
bool piezoState = false;
int trig = 3;
int echo = 4;
int button = 5;
int buttonState = 0;
int prevButton = 0;
//photoresistor A0;
//knob = A1;
long timer;
int timerlength = 200;

void setup() {
  Serial.begin (9600);
  timer = millis() + timerlength;
  pinMode(trig, OUTPUT);
  pinMode(echo, INPUT);
  pinMode(button, INPUT);
}

void loop() {
  
//  int knobValue = analogRead(A1);
////  Serial.println(knobValue);

  buttonState = digitalRead(button);
  Piezo();
}

void Piezo() {
  if (piezoState == false){
    if (millis() > timer){
      tone(piezo, C5);
      timer = millis() + timerlength;
    }
    else if (millis() == timer){
      noTone(piezo);
    }
  }
  
  if (buttonState == HIGH && prevButton == LOW){
    piezoState = true;
  }

  if (piezoState == true){
    noTone(piezo);
  }

  prevButton = buttonState;
}

void Brightness(){
  int brightness;
  brightness = analogRead(A0);

  return brightness;
}

void Distance() {
  int time;
  int distance;
  
  digitalWrite(trig, HIGH);
  delay(0.01);
  digitalWrite(trig, LOW);
    
  time = pulseIn(echo, HIGH);
    
//  speed of sound = 343 m/s = 0.0343 cm/µs
//  distance = time * speed
  distance = time * 0.0343 / 2;
  Serial.print(distance);
  Serial.println(" cm");

  return distance;
}

 

[UPDATED] Refined Final Project Idea + Progress

Last time I spoke in class, I was very much set on the idea of making a “big brother” surveillance camera. BUT, I realized that I would require a few equipments that are not in our sparkfun arduino kit. These equipments included a set of female jump wires, a separate breadboard(?) that can be attached to the servo, and another type of converter looking wire that I forgot the name of. Due to these technical difficulties, I thought my surveillance camera would become boring to the audience and so I decided to switch to a different idea.

Therefore, I resorted to my initial idea, which was to make a “spacewar” game. It is a game in which a spaceship (player) defends objects falling towards the earth from the outer-space. This has always been one of my favorite games since childhood and I loved the idea that I could realize it on my own.

Space War X on the App Store

I am currently in the process of developing the processing part first. I will get to the arduino once I have a working version on my computer. The arduino part will be incorporated with a push buttons to shoot shrapnels/bullets, another push button to accelerate, and a potentiometer to maneuver left and right directions.

I have accomplished my first milestone which is to have the starship maneuver and shoot bullets. I am not entirely sure if I am satisfied with the sprite that I am using, so this is subject to change. Below I have attached the video of the working version of my first milestone and the codes.

/*
David Lee
Main Code - version w/o arduino
*/

ArrayList <Bullet> bullets; 
Player player; 
PImage starship;

boolean [] keys = new boolean[128];


void setup(){
  size(480, 640);
  bullets = new ArrayList();
  player = new Player();
  starship = loadImage("starship6.png");
}

void draw() {
  background(0);
  for(Bullet temp : bullets){
    temp.move();
  }
  for(Bullet temp : bullets){
    temp.display(); 
  }
  //removeToLimit(30);
  
  player.display();
  player.move();
}


void keyPressed(){
  keys[keyCode] = true;
  if(keys[32]){
     Bullet temp = new Bullet(player.pos.x+80, player.pos.y);
     bullets.add(temp);
  }
}

void keyReleased(){
  keys[keyCode] = false;
}

void removeToLimit(int maxLength){
    while(bullets.size() > maxLength){
       bullets.remove(0); 
    }
  }
//Bullet Class

class Bullet{
  PVector pos;
  PVector acc;
  PVector vel;
  
  Bullet(float tx, float ty){
     pos = new PVector(tx, ty);
     acc = new PVector(0,-0.2);
     vel = new PVector(0, -2.5);
  }
  
  void display(){
     stroke(255);
     //point(x, y);
     rect(pos.x, pos.y, 3, 10);
  }
  
  void move(){
    vel.add(acc);
    pos.add(vel);
     //pos.y -= 2.5;
    
  }
}
//Player Class

class Player{
  PVector pos;
  PVector acc;
  PVector vel;
  
  Player(){
    pos = new PVector(width/2, height - 100);
    acc = new PVector(0.0, 0);
    vel = new PVector(4,4);
  }
  
  void display(){
    image(starship, pos.x, pos.y); 
  }
  
  
  void move(){
    vel = vel.add(acc);
    if(keys[LEFT])
      pos.x -= vel.x;
    if(keys[RIGHT])
      pos.x += vel.x;
    if(keys[UP])
      pos.y -= vel.y;
    if(keys[DOWN])
      pos.y += vel.y;
      
    if(pos.x < -50){
      pos.x = width; 
    }
    if(pos.x > width){
      pos.x = -50;  
    }
    if(pos.y > height){
      pos.y = -59; 
    }
    if(pos.y < -59){
      pos.y = height; 
    }
  }
}

 

Final Project Progress

For the final project, I intend to have FRIENDS theme song play as you start the program on loop, and the potentiometer knob acts like a volume knob so the player can change it whenever they want to. There will be six buttons and they will be used to choose answers A, B, C, D, E, or F. The colors of the buttons will match those in the logo of FRIENDS and in the same order (but I might use white instead of yellow). Instructions will display at the beginning, telling the player the knob decreases volume and that each button corresponds to which answer on screen.  The yellow bulb lights up as soon as the game starts, and for 1 second as the player clicks and answer, the blue bulb blinks. Questions will generally become harder (it’s harder for the player to match each answer with a character). When all of the trivia is done, green bulb lights and yellow and blue are dim. The screen will show a picture of the character you are most similar to, and a description based on the answers. There will be a clickable button where if clicked plays a famous catchphrase of that character. Another button will be to restart the trivia questions.

I will use example 6 from the files that Aaron uploaded as a reference for my work.

The questions I have so far:

  1. How do you feel about animals?
    1. Love them! We shouldn’t eat them…
    2. They’re fine.
    3. Monkeys are my favorite animals.
    4. I don’t really like dogs
    5. They taste gooood!
    6. Cats with no hair are cool.
  2. What do you consider to be your best quality?
    1. Your looks
    2. Your intelligence
    3. Your cleanliness
    4. Your sense of humour
    5. Your good taste
    6. Your laid-back approach to life
  3. What is your dream job:
    1. Singer
    2. Professor
    3. Fashion consultant
    4. Actor
    5. Advertising executive
    6. Caterer
  4. What do you consider to be your worst quality?
    1. Clumsiness
    2. Arrogance
    3. Competitiveness
    4. Selfishness
    5. Insecurity
    6. Delusional
  5. You value friendship because…
    1. Friends are not afraid to tell me when I’m wrong
    2. Friends make the best lovers
    3. Friends are the only family I have
    4. Friends are what makes me popular
    5. Friends tolerate my awkwardness
    6. Friends introduce me to all their hot friends

https://www.beano.com/posts/which-friends-character-are-you

https://www.radiox.co.uk/games-quizzes/which-friends-character-are-you/

https://heywise.com/quiz/which-friends-character-are-you/3/

https://www.zimbio.com/quiz/O6sFuc_NvOh/Friends+Character

Final Project Progress – Sarah & Ons

For this week, we decided to focus on the Processing side of things, since Arduino will only play a basic role in our project (control x and y positions using potentiometers).

research

When the two users’ paths meet on the screen in an area where they have something in common, a blooming effect gets triggered. (PS: Determining a commonality is done through comparing the answers to questions that are collected at the beginning of the program).
This is the part we needed to do the most research on. We wanted to get some inspiration to figure out what the blooming effect should look like, and how it should work.
We found two concepts that seemed interesting to us so far, and messed around with the code so that it would fit our project a bit better:

        • The first one draws fireworks, which we thought would be cool as it can represent a spark between the users if they have something in common. However, in the case that we end up choosing this effect, we are still trying to figure out how to make the fireworks stay displayed on the screen properly after the “animation” bit of it is over.

        • The second one is represented by the blooming of a flower.
          We added the option to add the number of “petals” so that we can see how different it would make the sketch look. We were also thinking of using this functionality to go along with how similar the answers of the users are.
          The possible answers for each of our questions are going to be: 1, 2, 3, 4, which signify how much you agree or disagree with the question. So we thought that the number of petals could increase the more the answers of the users are closer together.
          You can visualize this through this video:

What we got done

        • The first thing we wanted to make sure would work properly is the trace the users would leave when moving around the screen. In our final project, each user will have two potentiometers, one would control the x-position, the other will control the y-position, This allows them to move around and “draw” freely on the screen. Since hooking this up to Arduino will be fairly easy, for now, we are just using 4 keys on the keyboard to simulate this for each user.
          We wanted the current position of the user to be represented by a point that is fully opaque, and the trail it leaves behind it to be a bit more transparent.
          This took a lot of time for us to figure out but the solution turned out to be quite simple. All we needed to do was draw a black rectangle with the screen dimensions, that had a really low alpha value (3 in our case) each frame, i.e., in the draw loop.

        • The second thing we did was try to detect collisions between the traces of the two users. We did this by turning the screen into a grid. Every time a user crosses a square on the grid, a boolean for that user turns to True. If both the booleans for both users become True, then a collision is detected. For now, we are representing the collision by a big dot. But this will later be replaced by the blooming effect we mentioned earlier.
          To fix: One issue we still have with this, however, is that if the user’s path is between two squares of the grid (each half in a different square), two dots may be displayed to represent one collision. We are working on fixing this.

        • Finally, we also started working on our Question class. This will be a “template” for all of the questions we are going to include in the beginning of our program. We started to think about all of the variables that the class should have.
          Here is the current code for it, it’s just a start as most of our work on it was brainstorming and discussion:
class Question{
  //variables to store input answers
  int user1Answer;
  int user2Answer; 
  //question location (corresponding to area on screen)
  int x,y;
  //question box dimensions (it could be something that we design and upload to processing(?))
  int w,h; 
  
  String questionText; 
  
  boolean user1Answered;
  boolean user2Answered;
  
  boolean sameAnswer; 
  
  
  
  void displayQuestion(){
   rect(x,y,w,h);
   text(questionText,x+w/2, y+h/2);
   //rect();
   //rect();
   //rect();
   //rect();
  }
}

 

Week 11: Final Project process

Right after Wednesday’s class last week, I bought a hot glue gun, and used the quarantine Blue Mart Cardboard box to start working on creating the dollhouse. This task was mostly fun, but a bit frustrating because the cardboard was so thick I needed a knife to cut most of it. Measuring all the pieces and getting straight lines with a knife were probably the most difficult parts.

I created the dimensions of the dollhouse so that the background of the rooms matched perfectly to the screen of my laptop. I also had to create a bit of a stand so that it didn’t rest on the laptop, and also fit in a way were it was perfectly centered without relying on the user to adjust it.

 

 

Next, Aayush and I discussed what each room could do, and what kind of interactivities we could incorporate. Here’s what we decided:

  1. Bedroom: The background scenery changed from day to night
  2. Game room: A small, interactive game starts (user can play)
  3. Balcony: has a piano that plays music, scenery can change, as well as whether
  4. Living room: A tv where a movie can play
  5. Dining room: Food starts sizzling/ food is made/ kettle ..etc

While Aayush created a prototype of the triggers of each room, I created simple ‘wallpapers’ of how the dollhouse may look. Here is what we have:

For clarification, this is what the dollhouse looks like in comparison to the laptop:

 

Next steps:

  1. Creating animations for each room
  2. Creating furniture like beds and chairs
  3. Adding sensors for each room
  4. Adding LEDs for each room
  5. Making the dollhouse prettier 🙂

Final Project – Phase 1

  1. This week I thought about how to incorporate the physical components first into Arduino so that I can get the mechanisms working first before I go into creating a more artistic design.
  2. I plan to create a keyboard like design of aluminum tape keys that resemble the piano keys. Each key is a capacitative sensor that also trigger a different musical note.
  3. At the moment when the key is pressed, the duration of how long it is pressed will display an image on screen with the respective sound(synthesizer scale). Each key acts like a switch to activate the image.
  4. For now the images on screen are simple to make sure it works first.
  5. The composition of the visuals is the next part. Despite this being Phase 2 ,I managed to  experiment on processing the different effects I can achieve with sound and shapes. These aren’t guaranteed to be used in the final version but it allowed me to familiarize myself with the minim library in processing.

Troubles creating the capacitative sensor:

This was arguably a tricky part to fix because of the limited number of Ohms in our resistor, in order for a capacitive sensor to work you need a higher number, so after trial and error, I lined up the resistor in a series form and finally could get a reading from the serial port.

The black wire in my hand is the capacitive sensor

Screenshot from Max msp real time audio software that I am considering using with processing as a library exists for it. In this patcher image I created a synth with a virtual keyboard.

#include <CapacitiveSensor.h>

/*
   CapitiveSense Library Demo Sketch
   Paul Badger 2008
   Uses a high value resistor e.g. 10M between send pin and receive pin
   Resistor effects sensitivity, experiment with values, 50K - 50M. Larger resistor values yield larger sensor values.
   Receive pin is the sensor pin - try different amounts of foil/metal on this pin
*/


CapacitiveSensor   cs_4_2 = CapacitiveSensor(4, 2); // 10M resistor between pins 4 & 2, pin 2 is sensor pin, add a wire and or foil if desired

int ledPin = 12;
void setup()
{
  cs_4_2.set_CS_AutocaL_Millis(0xFFFFFFFF);
 // turn off autocalibrate on channel 1 - just as an example
  Serial.begin(9600);

}

void loop()
{

  long start = millis();
  long total1 =  cs_4_2.capacitiveSensor(30);


  //    Serial.print(millis() - start);        // check on performance in milliseconds
  //    Serial.print("\t");                    // tab character for debug windown spacing

  Serial.println(total1);                  // print sensor output 1

  //    Serial.print("\t");

  //  delay(10);
  // if (total1 > 0) {
  //    digitalWrite(ledPin, HIGH);
  //  }
  //  else {
  //    digitalWrite(ledPin, LOW);
  //  } worked to turn LED on

  // arbitrary delay to limit data to serial port
}
import processing.sound.*;
import ddf.minim.*;
Minim minim;
AudioPlayer song;
int spacing = 100;
import processing.serial.*;
Serial myPort;
int signal=0;
int border = spacing*2; 
int amplification = 50;
int y = spacing; 
float ySteps;
void setup() { 
  printArray(Serial.list());
  String portname=Serial.list()[4];
  println(portname);
  myPort = new Serial(this, portname, 9600);
  size(800, 800); 
  background(255); 
  strokeWeight(1); 
  stroke(0); 
  noFill();
  minim = new Minim(this);
  song = minim.loadFile("song.mp3");
}
void draw() {
  if (signal>0) {
    song.play();
    float amplitude = song.mix.level();
    noStroke();
    fill(random(255), amplitude*155);
    int x = int(map(song.position(), 0, song.length(), 0, width/2));
    float frequency = song.mix.get(int(x))*spacing*amplification;
    ellipse(width/2, height/2, frequency, frequency);
  }
}

void serialEvent(Serial myPort) {
  signal=myPort.read();
}

Refined Final Project Idea – Ons & Sarah

Idea

Inspired by our initial idea and a long conversation with Aaron and among ourselves, we came up with a new concept.

Our idea is to create a 2-person interactive generative art experience in which two people fill in a yes-no questionnaire about themselves, and then use an etch-a-sketch – like set up (two potentiometers) to generate a visualization of how alike they are and how much they have in common.

Arduino

Our Arduino will have two potentiometers per user as mentioned above to simulate the etch-a-sketch setup. One knob would control drawing on the x-axis, and the other would control drawing on the y-axis.

Etch-A-Sketch

Additionally, we will have three buttons. Two buttons for the yes-no questionnaire, and one to “save” the artwork so that the users can keep it afterward.

 

 

 

Processing

We’re thinking of mapping sections of the processing screen to correspond to different categories (e.g. hobbies, age…etc.), and then as the users make their way on the screen, they leave traces that reflect the data they gave us in the beginning. When two traces meet at a point that symbolizes something in common a more complex shape “blooms” there.

At this point, it feels a bit difficult to visualize what it will exactly look like as it will require a lot of experimentation and trial and error!

Experience

For now, we’re thinking of having it all on one processing screen. So the users alternate filling in the questionnaire, and then continue to generate the art. However, if we find that we satisfied all the other elements we’re thinking of, we might try to make it across two devices

 

Midterm Refined

Inspiration

For this week’s project, I wanted to use Arduino controls to refine what I did in my midterm. To refresh your memory, my midterm was a two-player game where the players ran around the map competing for candies. The game was ok, but the main bug was that I couldn’t have the two players moving at one time. This was due to the limitations of “Keypressed function”, as it wasn’t able to differentiate which player was pressing the keys.

By introducing Arduino into the game, I could simply create another “console” for player 2, so the player controls won’t be mixed up in the game.

Limitations

There were two limitations to using Arduino as a “console.” One is more obvious, which is the fact that the kit buttons aren’t that responsive, and aren’t really stationary. While I was playing the game with it, the buttons would slip off a lot of the times.

The second limitation is the problem of the breadboard. There are four buttons in the kit, so just enough for the four directions. However, the breadboard didn’t have the horizontal space to put an “up” and “down” button next to each other. As a compromise, I had to put the four buttons in a row, with the middle right being “up” and middle left “down”. Here is the final layout:

Challenges

The main challenge I ran into for this project was trying to integrate Arduino into my midterm project code. My midterm code was rather chaotic with a lot of functions, so it took a lot of time trying to piece together where the Arduino parts of the code would fit into the logic.

Full code

Arduino:

int button1 = 2;
int button2 = 12;
int button3 = 6;
int button4 = 8;

void setup() {
  // put your setup code here, to run once:
  pinMode(button1, INPUT);
  pinMode(button2, INPUT);
  pinMode(button3, INPUT);
  pinMode(button4, INPUT);
  Serial.begin(9600);
}

void loop() {
  int buttonState1 = digitalRead(button1);
  int buttonState2 = digitalRead(button2);
  int buttonState3 = digitalRead(button3);
  int buttonState4 = digitalRead(button4);
  char inByte=Serial.read();
  Serial.print(buttonState1);
  Serial.print(',');
  Serial.print(buttonState2);
  Serial.print(',');
  Serial.print(buttonState3);
  Serial.print(',');
  Serial.println(buttonState4);
}

Main Code:

PFont font;                              

import processing.serial.*;
Serial myPort;
boolean left = false;
boolean right = false;
boolean up = false;
boolean down = false;

import processing.sound.*;            //all the sounds in this game
SoundFile eat;
SoundFile die;
SoundFile music;

Ball b1;                              //initializing the two players
Ball b2;
PImage ninja, warrior, bg;
PImage[][] ninjawalk;
PImage[][] warriorwalk;
int ndirection = 0;
int wdirection = 0;
int nstep = 0;
int wstep = 0;
int speed = 5;

Candy[] candy;                        //initializing all the candy
int count;
color chosen;
int livecount = 0;                    //how many edible candy there are

boolean go = false;                   //start game value

void setup() {
  size(1200, 800);
  bg = loadImage("bg.jpg");
  
  printArray(Serial.list());
  String portname=Serial.list()[3];
  println(portname);
  myPort = new Serial(this,portname,9600);
  myPort.clear();
  myPort.bufferUntil('\n');
  
  //sounds
  eat = new SoundFile(this, "eat.mp3");
  die = new SoundFile(this, "die.mp3");
  music = new SoundFile(this, "music.mp3");
  music.loop();
  
  //slicing the two sprite sheets for player 1 and 2
  ninja = loadImage("ninja.png");
  ninjawalk = new PImage[4][3];
  int w = ninja.width/3;
  int h = ninja.height/4;
  for(int iy = 0; iy < 4; iy++){
    for(int ix = 0; ix<3; ix++){
      ninjawalk[iy][ix] = ninja.get(ix*w, iy *h, w, h);
    }
  }
  warrior = loadImage("warrior.png");
  warriorwalk = new PImage[4][3];
  int ww = warrior.width/3;
  int wh = warrior.height/4;
  for(int wy = 0; wy < 4; wy++){
    for(int wx = 0; wx<3; wx++){
      warriorwalk[wy][wx] = warrior.get(wx*ww, wy *wh, ww, wh);
    }
  }
  //use this function to restart the game
  reset();
}

void draw() {
  menu();
  if (go == true){
    begin();
  }
}

void serialEvent(Serial myPort){
  String s=myPort.readStringUntil('\n');
  s=trim(s);
  if (s!=null){
    int values[]=int(split(s,','));
    if (values.length==4){
      println(values);
      if (values[0] == 1){
        right = true;
      }
      else if (values[0] == 0){
        right = false;
      }
      if (values[1] == 1){
        left = true;
      }
      else if (values[1] == 0){
        left = false;
      }
      if (values[2] == 1){
        up = true;
      }
      else if (values[2] == 0){
        up = false;
      }
      if (values[3] == 1){
        down = true;
      }
      else if (values[3] == 0){
        down = false;
      }
    }
  }
}

//this function restarts the game from the gaming interface directly
void reset(){
  float unit = 200;
  b1 = new Ball(width/4, height - 20, 1);          //player 1 character
  b2 = new Ball(width*3/4, height - 20, 2);        //player 2 character
  
  int wideCount = width / int(unit);               //calling the candies, initializing different candy colors
  int highCount = (height*3/4) / int(unit);
  count = wideCount * highCount;
  candy = new Candy[count];
  int index = 0;
  color[] colors = new color[6];
  colors[0] = #FF0011;
  colors[1] = #BA00FF;
  colors[2] = #2500FF;
  colors[3] = #00FFE8;
  colors[4] = #00FF01;
  colors[5] = #FFAF00;
  chosen = colors[int(random(0,5))];
  for (int y = 0; y < highCount; y++) {
    for (int x = 0; x < wideCount; x++) {
      candy[index++] = new Candy(x * unit + unit/2, y * unit + unit/2, 20, 20, colors[int(random(0,5))]);
    }
  }
  
  for (Candy candy : candy) {                      //counting how many edible candies there are to know the win condition
    if (chosen == candy.c){
      livecount ++;
    }
  }
  
  for (int i =0; i<count;i++){                     //candy speed initializing
     candy[i].xSpeed = random(-2,2);
     candy[i].ySpeed = random(-2,2);
  }
}

//this is the starting menu
void menu(){
  background(bg);
  fill(255);
  font = createFont("BreatheFire-65pg.ttf", 60);
  textFont(font);
  textAlign(CENTER);
  text("CANDY RUSH \n even heros like candy", width/2, 185);
  font = createFont("Georgia", 40);
  textFont(font, 30);
  text("This is a two player game. Ninja and Warrior wants to take a break \n on their quest, so they are going to catch candy. Some candies are \n poisonous, and only the candy indicator can tell you which candies are edible. \n The first player to catch all the edible candy wins. \n NINJA: WASD, WARRIOR: direction keys", width /2, 370);
  stroke(0);
  fill(0);
  rectMode(CENTER);
  rect(width/2, 680, 200, 72);
  fill(255);
  textFont(font, 60);
  font = createFont("BreatheFire-65pg.ttf", 42);
  textFont(font);
  textAlign(CENTER);
  text("PLAY", width/2, 700);
  if (mouseX>=(width/2 - 100)  & mouseX<=(width/2 + 100) & mouseY>=650 & mouseY<=720){
    stroke(255);
    noFill();
    rect(width/2, 680, 200, 72);
    if (mousePressed){
        go = true;
    }
  }
}

//this is the game starting function. the actual game is ran here
void begin(){
  background(bg);
  textSize(24);
  text(b1.score, width/4, height - 50);
  text(b2.score, width*3/4, height - 50);
  
  //calling candy functions
  for (Candy candy : candy) {
    candy.display();
    candy.collision();
    candy.update();
    candy.checkEdges();
  }
  
  //this is the candy indicator
  stroke(0);
  fill(chosen);
  ellipse(width/2, height - b1.diameter, b1.diameter, b1.diameter);
  
  //calling character functions
  b1.display();
  b1.move();
  b2.display();
  b2.move();
  checkwin();
}

void checkwin(){
  if (livecount == 0){                      //win condition
    for (Candy candy : candy) {
      candy.xSpeed = 0;
      candy.ySpeed = 0;
    }
    rectMode(CENTER);
    if (b1.score > b2.score){
      fill(0);
      rect(width/2, height/2, width, height);
      fill(255, 255, 255);
      textSize(32);
      text("Ninja Wins! \n (Press r to restart)", width/2, height/2); 
    }
    else if (b2.score > b1.score){
      fill(0);
      rect(width/2, height/2, width, height);
      fill(255, 255, 255);
      textSize(32);
      text("Warrior Wins! \n (Press r to restart)", width/2, height/2);
    }
    else if (b2.score == b1.score){
      fill(0);
      rect(width/2, height/2, width, height);
      fill(255, 255, 255);
      textSize(32);
      text("Tie! \n (Press r to restart)", width/2, height/2);
    }
    
    //restart button
    if (keyPressed) {                            
       if (key == 'r' || key == 'R') {
          reset();
       }
    }
  }
}

Player Class:

class Ball {

  float x;
  float y;
  float diameter;
  int score;
  int player;
  int w = ninja.width/3;
  int h = ninja.height/4;
  int ww = warrior.width/3;
  int wh = warrior.height/4;

  Ball(float tempX, float tempY, int tempPlayer) {
    x = tempX;
    y = tempY;
    diameter = 45;
    score = 0;
    player = tempPlayer;
  }

  void display() {
    imageMode(CENTER);                                    //displaying player 1
    if (player == 1) {
      image(ninjawalk[ndirection][nstep], x, y, w, h);
    }
    if (player == 2) {                                     //displaying player 2
      image(warriorwalk[wdirection][wstep], x, y, ww, wh);
    }
  }

  void move() {  
    if (player == 1) {
      if (keyPressed) {
        if (key == 'w' || key == 'W') {
          y = y - 5;
          ndirection = 0;
        }
        if (key == 'a' || key == 'A') {
          x = x - 5;
          ndirection = 3;
        }
        if (key == 's' || key == 'S') {
          y = y + 5;
          ndirection = 2;
        }
        if (key == 'd' || key == 'D') {
          x = x + 5;
          ndirection = 1;
        }
        if (frameCount%speed == 0) {
          nstep = (nstep + 1) %3;
        }
      }
    }

    if (player == 2) {
      if (up == true) {
        y = y - 5;
        wdirection = 0;
      }
      if (left == true) {
        x = x - 5;
        wdirection = 3;
      }
      if (down == true) {
        y = y + 5;
        wdirection = 2;
      }
      if (right == true) {
        x = x + 5;
        wdirection = 1;
      }
      if (frameCount%speed == 0) {
        wstep = (wstep + 1) %3;
      }
    }
  }
}

Candy Class:

class Candy {
  float x;
  float y;
  float w;
  float h;
  float xSpeed, ySpeed;
  boolean caught = false;
  color c;

  Candy(float tempX, float tempY, float tempW, float tempH, color tempC) {
    x = tempX;
    y = tempY;
    w = tempW;
    h = tempH;
    c = tempC;
    xSpeed = ySpeed = 0;
  }  

  void display() {

    ellipseMode(CENTER);
    if (caught == false){
      fill(c);
      ellipse(x, y, w, h);
    }
  }
  
  //collision function for when players catch the right and wrong candy
  void collision() {
    if ((b1.x - b1.w *3/4 < x && x < b1.x + b1.w*3/4) & (b1.y - b1.h*3/4 < y && y < b1.y + b1.h*3/4)){
      if (c == chosen){
        x = -50;
        y = -50;
        caught = true;
        b1.score ++;
        livecount --;
        eat.play();
      }
      else if (c != chosen){
        b1.x = width/4;
        b1.y = height - b1.diameter;
        die.play();
      }
    }
    if ((b2.x - b2.w*3/4 < x && x < b2.x + b2.w*3/4) & (b2.y - b2.h*3/4 < y && y < b2.y + b2.h*3/4)){
      if (c == chosen){
        x = -50;
        y = -50;
        caught = true;
        b2.score ++;
        livecount --;
        eat.play();
      }
      else if (c != chosen){
        b2.x = width*3/4;
        b2.y = height - 20;
        die.play();
      }
    }
  }
  
  void update(){
    x += xSpeed;
    y += ySpeed;
  }
  
  void checkEdges() {
    if (y>(height*3)/4) {
      ySpeed = -ySpeed;
    }
    if (y<0) {
      ySpeed = -ySpeed;
    }
    if (x>width) {
      xSpeed = -xSpeed;
    }
    if (x<0) {
      xSpeed = -xSpeed;
    }
  }
}

Demonstration

Week 10: Arduino and Processing

IDEA:

I wanted to create the popular game Flappy Bird, but using the distance sensor and my hand to control the movement of the bird.

PROCESS:

I started by creating an array of rectangles that formed at a distance apart, and at random heights. For some reason, this was my most frustrating part because I didn’t realise how quickly I could forget Java. Eventually figured out how to move the screen, and the ball, to make it seem like the bird was moving.

 

ARDUINO:

This was the first time I was using the Distance sensor so it took me some time to understand it, but some research and help from my peers did the trick. Once I kept experimenting using my hand, I constrained the results to a distance I thought seemed appropriate, which was between 1 and 10 inches. After that, I connected the Arduino and processing using the sendBytetoProcessing example and was happy to have found that process easy for me.

FINAL TOUCHES:

I added a collision if statement, to end the game, and also added some fun graphics to have the game seem more fun!

OBSTACLES:

I couldn’t manage to get the bird to mimic my hand movements exactly, The bird seemed to keep bouncing. I played around a lot with constrain, mapping, time, and framerate, but am still not sure what exactly the issue is. I would love some insight if anyone knows!