[arcade week 5] controller drawing

Screenshot 2016-03-03 17.10.22

I made this three-sided illustration of my controller above, which doesn’t include the components I will mount (like the joystick or the soft button), mostly because I couldn’t figure out how to draw them in Vectorworks in a way that wasn’t confusing with the actual holes I need to lasercut out of my wood. On the left will be the joystick, and on the right will be my button made of fabric and covered with fur. (Hence the two holes – one for power and one for ground).

Screenshot 2016-03-03 17.06.13

I’ve also been working on my game in Unity. There’s still a ways to go but at least I’ve gotten my sprites working so far.

[arcade week 4] midterm idea: a game about petting cats

pink cat sitting

For my midterm, I want to make a game about petting cats. Specifically, I want to make a game about how hard it is to pet a cat. In real life, it’s already a bit of a game – you never know exactly where the cat wants you to pet it, or for how long. One wrong move and you get scratched. Hopefully, this little game I make will capture a bit of that feeling.

pink cat tail

I’m very much not good at drawing, or visual art in general, but I had a good time using Piskel to make these sprites. (For this post I’ve exported them as gifs.)

pink cat lying down

For my controller, I’ll be making something that has a joystick  to allow you to move the petting hand around the screen, and then a piece of furry fabric that you actually have to pet in order to trigger the action. The fur will be on top of a fabric button made with Velostat that connects to the Arduino.

hand

 

[arcade week 3] the golden age of videogames

Screenshot 2016-02-17 16.43.38

We were to play three games from this list these week, and I went with three that I’d never heard of: BurgerTime, Elevator Action, and Track & Field.

BurgerTime was my favorite of the three. It’s sort of Pac Man-esque, in that you run around the screen avoiding enemies. But instead of collecting stuff, you’re stepping over the burger parts to make full burgers that cascade down the screen. The silly theme of the game appealed to me, and the objective was pretty straightforward once you began. I found it to be rather soothing to play for some reason – it just felt satisfying to complete a burger.

Screenshot 2016-02-17 16.47.54

The next one I tried was Elevator Time. I like the look of this game and was intrigued by the idea of an entire game where you ride an elevator, but found it sort of confusing to play. I wasn’t sure what my goal was, or how to interact with the different elements of the game. I bet that playing it on a real cabinet vs. a poorly-explained emulator online would probably help, but I didn’t get into it enough to be hooked to try again and again once I died.

Screenshot 2016-02-17 18.13.59

The last one I played was Track & Field – the hurdles, specifically. This is the only game that reflects a real game in the world (sports), so it was interesting for that reason. There’s something different about doing a simulation of something that exists in “real life,” because you come in with preconceived notions about how it’s supposed to work in the game.

I figured the hurdles game would be relatively easy, because all I had to do was jump at the right moment. But of course, like all arcade games, it wasn’t.

While I also enjoyed the aesthetics of this game, it didn’t hook me, but for the opposite reason Elevator Action didn’t hook me. I felt like I understood how the game works, but it was almost boring for that reason. It simulated something I understand in real life, but didn’t surprise me with anything new. (In contrast with something like QWOP, of course).

Now I think I’m going to play more BurgerTime.

[arcade week 2] Two Buds

Screenshot 2016-02-11 12.45.15

Click here to try Two Buds (only works in Safari or Firefox).

This week I started learning about Unity in 2D, as well as using scripting. I made a game called Two Buds, where you have to control two characters at the same time. The penguin catches the fish and the monkey catches the bananas, and if any object hits the floor, the game ends. The scoring is just by how long you last in the game.

I had problems upon exporting, mostly with the way I had set up the text because the resolution size changed the positioning once it was exported. Also, it seems to kind of slow down and freeze when I play it? Not sure if that’s just me…

Anyway, glad I made a working game – looking forward to making my own sprites soon.

[pcomp week 6] Allergic to Love, Joystick Version (serial communication)

2015-10-14 00.00.59

I ran into a lot of problems this week!

While doing this week’s labs on serial communication, lots of weird things kept happening — it would work sometimes and not other times, my computer crashed, Arduino couldn’t find the right port…

A few hours in, I realized that 95% of my problems were because I kept forgetting to turn on and off the serial monitor in P5. Even when I realized this I would forget to do it, or do it in the wrong order. This was very irritating.

Eventually, I got it sorted out. In the labs, it was suggested that we wire up one button and two potentiometers. Luckily for me, the joystick that I got for this assignment was literally those three things in one, so once I figured out the code on the Arduino side, I could easily move it into my p5 sketch.IMG_0500

The sketch I decided to add a sensor to was a game I made the other week in ICM, Allergic to Love. In the original version, you use your mouse to move your character along the x-axis, and then clicked to shoot your laser. Using a joystick to replace the mouse was fairly straightforward. The pot in the joystick that controls x-axis movement would replace mouseX, and the button on the joystick would replace mousePressed.

(This joystick also allows you to control movement on the y-axis, and even though this particular game doesn’t require it, I decided to keep that code in just in case in the future I decide to add some kind of movement up and down.)

Like in the lab, I made an array of data in P5 for the 3 sensor inputs: x, y, and button press. The P5 code using the sensor data ended up looking like this:

function serialEvent() {
  // read a string from the serial port
  // until you get carriage return and newline:
  var inString = serial.readStringUntil('rn');
 
  //check to see that there's actually a string there:
  if (inString.length > 0 ) {
    var sensors = split(inString, ',');            // split the string on the commas
    if (sensors.length > 2) {                      // if there are three elements
      if (sensors[0] == 539) { 
          cannon.dir = 0
      } else if (sensors[0] < 200) {
          cannon.dir = -1
      } else if (sensors[0] > 900) {
          cannon.dir = 1
      }
      buttonPress = sensors[2];      // element 2 is the button
    }
  }
}

You can see how I made sensors[0], the x-axis, change direction depending on input, and how I set sensors[2], the button, to a simple variable.

It’s pretty fun to play the game with a joystick. It definitely makes it feel more arcade-y. Even though I had to make it a bit easier to accommodate the joystick, it’s still pretty hard!

My P5 code and my Arduino code are below.

Continue reading “[pcomp week 6] Allergic to Love, Joystick Version (serial communication)”

[icm week 4] Allergic to Love, v2.3

Screenshot 2015-10-01 00.33.44

[TLDR: Here’s the second iteration of my game, Allergic to Love.]

Our assignment this week was to clean up the code of a previous assignment, which was quite welcome because my code from last week was a total mess. I’m not completely sure that it’s now sparkling clean, but it’s definitely much better than it was before.

Before I made any changes to the game, I went in and reorganized the code. Having not yet learned arrays or objects in class, I was wandering about in the array wilderness a little bit last week and ended up doing something really weird with them. I think I fixed them up now after looking up how to do an array of objects. I found the jitterbug example  to be particularly helpful. Now my falling hearts are arranged like this:

function Falling() {
  this.x = random(width);
  this.y = random(-650, 0);
  this.broken = 0;
  this.hitByLaser = false;
  this.hitTheGround = false;
  this.speed = random(1, 4);
  this.clr = color(255, random(0, 255), random(0, 255));

  this.move = function() {
    this.y += this.speed;
  };

  this.display = function() {
    strokeWeight(7);
    stroke(this.clr);
    fill(this.clr);
    bezier(this.x, this.y, this.x - 12, this.y - 12, this.x - 11, this.y + 8, this.x, this.y + 14); //left 
    bezier(this.x, this.y, this.x + 12, this.y - 12, this.x + 13, this.y + 8, this.x, this.y + 14); //right 
  };

 

I went in and created a lot of my own functions as well.

Finally, I started adding on to the game itself.

Screenshot 2015-09-30 23.21.22

Adding sounds made a big difference. I found music from the Free Music Archive and sounds from Free Sound. I’m not really sure where the proper place to attribute would be…I put it in comments in my code for the time being.

Screenshot 2015-09-30 23.23.11

Besides sounds, I made a few other changes — the girl now bounces up and down, the landscape is a bit different, and she smiles if you win the game. (But it’s still pretty hard to do so!)

Play the game here.

My full code is below.

Continue reading “[icm week 4] Allergic to Love, v2.3”

[icm week 3] Allergic to Love v. 1

Screenshot 2015-09-24 03.21.50

[TLDR: Here’s my (unfinished but finished-enough-for-this-assignment) game, Allergic to Love.]

Oh man, this was a rough one. The beginning was good: Esther and I partnered up to start this project. I really wanted to make a game, so we went down the path of trying to build something that involved shooting at objects that moved on the screen.

Together we got as far as making things fall down, making things shoot up, and coming up with an interim solution for making objects disappear as they got hit. Esther did some pretty awesome work figuring out how to use arrays and create functions, and then we took that code and built separate things on top of it.

I quickly realized that what I wanted to do this week was beyond the scope of what we’ve learned so far in class, so it was quite difficult to sort out some specific things. Once I came up with the theme of the game, it took me a really long time to figure out how to make all the falling objects in the shape of hearts. After some experimenting with for loops, making functions, arrays and bezier curves, I got it!

Screenshot 2015-09-23 19.55.00

This was very exciting. I started adding things like making them fall from different heights and at different speeds. Some of the trickiest stuff to figure out was how to make things happen in the win state and lose state. I ended up having to add a bunch of Boolean arrays. It also started to come together aesthetically.

Screenshot 2015-09-24 03.20.04

I added some fun things, like making the girl’s skin turn green every time a heart hit the ground. (She’s allergic, after all.)

//if the heart hits the ground
    if (hearts.y[i] == height) {
      if (hearts.hitTheGround[i] === false) {
        hearts.onGround++; // skin changes color
        skin.r = skin.r - 10;
        skin.g = skin.g + 5;
        skin.b = skin.b + 5;
        hearts.clr[i] = (0); //hearts turn black
      }
      hearts.hitTheGround[i] = true;
    }

I also had some crazy mishaps experimenting with the gradient that frankly look way cooler than what I was going for.

Screenshot 2015-09-24 00.55.23

There’s still a lot I want to do, and the code is incredibly unfinished and messy. But it’s almost 4 am and I got this thing in a playable state, so I guess now is as good a time as any to stop. And even though I’ve been playing it all evening, it’s pretty hard! I feel like there’s still a lot to improve on here, but this will have to do for version 1.

Screenshot 2015-09-24 03.38.15

Check out Allergic to Love, v.1!

My (extremely messy) code is below.

Continue reading “[icm week 3] Allergic to Love v. 1”

[pcomp week 2] Electronics labs, switches, and CHOP TO THE TOP!!!

IMG_0067

This week in pcomp we got our hands dirty with circuits and components.

IMG_0020 IMG_0022

I spent a good amount of time getting to know the multimeter, learning how to measure resistance, voltage and current. One of the hardest parts about it was holding the tiny components, measuring them with the multimeter and trying to take pictures at the same time!

I also started building basic circuits with switches and LEDs.

To do the exercise with the potentiometer, I realized I had to solder wires on to the sensor, so I also learned to solder for the first time. It definitely wasn’t the prettiest solder-job in the world, but it worked.

Applying what we learned in the labs, our assignment was to make a switch. We were encouraged to be creative — “A switch is nothing more than a mechanism to bring two pieces of conductive material together and separate them.”

I decided to make a game.

I wanted to do something that tested people’s ability to use chopsticks. I decided to make something that would have two conductive parts with a wide space in between them. The pieces would be connected when people moved other conductive things together in between them so that the circuit could be completed, at which point a light would turn on.

In order to encourage people to use chopsticks to pick things up rather than push things around, I had to make the space between the two conductive points vertical rather than horizontal on the table. Aluminum foil—cheap and abundant—was my material of choice for conducting electricity. So I made a bunch of balls of aluminum foil of different sizes as the things people had to pick up.

The tubes I used were originally pen holders that I had cut the bottoms out of,  glueing foil at the bottom and the top. I had to test if a bunch of foil balls stacked on top of each other would be conductive enough to connect the bottom to the top, so I first used the multimeter, and then wired up a circuit that made an LED light up.

IMG_0044IMG_0045

In order to make this game a race between two teams, I had two tubes and wired up two switches and LEDs of different colors in parallel on my breadboard. So now there’s a green team and a yellow team.

IMG_0070 IMG_0072

I’m not 100% sure the schematic I drew is accurate, mostly because I’m not sure if the line in the middle is correct. But I think it is?

It started to come together, and I wrote the rules:

Light your color first to win. Turn on your light by filling your tube to the top with the balls. You may only touch the balls with chopsticks.

(2 players: each player holds a pair of chopsticks)

(4 players: divide in 2 teams, each player holds 1 chopstick)

A silly game deserves a silly name, and thus I call it CHOP TO THE TOP!!!

IMG_0054

IMG_0055

And voila. I had Aaron (yellow) and Sam (green) play the game to demo. The LEDs are tiny so they’re a little hard to see, but it works!