Home > ICM, ITP Classes, ITP Projects, Week 8 > ICM Midterm Idea

ICM Midterm Idea

**Update 2:

This is copied over from my Word document. Forgive any typos and/or formatting errors.  The kind of short version is that the Hero character still needs to be programmed to jump and fall. It also needs to reset to the starting platform when an obstacle (ball or post collides with it).

I need to figure out what is going on with the platform creation code. Initially it would draw properly when the draw(){} method was placed without the ball objects or if the background (); was moved into the setup() {} method. Now I receive an error when I run the code no matter what I put in draw() {} or setup() {}. I’ve changed the placement and messed with if statements vs. function definitions. Neither have resolved the error.

Besides that, I need to include additional game elements including a timer, game music, data input for scores and settings and eventually two more levels and an alternative game controller.

I am pleased that I figured out a lot of mistakes I made. That actually took up the vast majority of my time on the project. Still, given where I was just a week ago in terms of understanding everything that has been discussed in class, I have progressed.

For the things I have not completed yet,  I know what needs to be done and have an idea how to do so for the most part. I at least have a slight clue, which is far better than how I felt last week.

The final note for now is that while I feel good about how I broke things into pieces while working on sketches, I did jump around more than I should have. I also ended up putting together sloppy structure around my code. I will clean it up over the next couple of days, putting classes in separate tabs, which will move a lot of the code out of the draw (){} and make things more concise.

By Monday, I would like to tighten up the code and nail the remainder of what I planned to have ready for presentation in class.

Now for the notes, which will be reformatted and moved to another page later…

—-

levelGame initially mocked up just using void setup() and void  draw() methods

Initially the line would follow the mouse, but now this code unintentionally created a short streaking trail:

float ballX=200;

float ballY=0;

float ballW=50;

float ballH=50;

float speed=3;

//run once

void setup() {

size(800,800);

smooth();

frameRate(30);

}

//run forever

void draw() {

background(#4CACED);

//setting ellipse and rectangle modes to CENTER

ellipseMode(CENTER);

rectMode(CENTER);

//draw game background objects

stroke(#000000);

strokeWeight(1);

fill(#000000);

rect(400,700,800,110); //bottom border

noStroke();

fill(#4CACED);

rect(100,700,75,150); //spike bars

rect(205,700,75,150);

rect(306,700,75,150);

rect(407,700,75,150);

rect(508,700,75,150);

rect(609,700,75,150);

rect(710,700,75,150);

//draw ball obstacle

stroke(#DDDDDD); //light gray

strokeWeight(1); //setting stroke thickness for ball

fill(#97CDF3); //deep sky blue

ellipse(ballX,ballY,50,50); //ball is drawn at coordinates

ballY=ballY+speed;//sets ball speed on y-axis

if((ballY>height) || (ballY<0)) {

speed=speed*-1;

}

//draw starting platform

stroke(#FFFFFF);

strokeWeight(10);

line(25,385,35,385);

//draw exit platform

stroke(#FFFFFF);

strokeWeight(3);

fill(#F68A03);

triangle(715,60,735,80,696,80);

rect(715,100,30,30);

//draw hero character’s head

stroke(#768E12);

strokeWeight(1);

fill(#768E12);

ellipse(30,349,8,8);

//draw hero character’s body

stroke(#768E12);

strokeWeight(1);

fill(#768E12);

rect(30,360,10,10);

//draw hero character’s arms

stroke(#768E12);

strokeWeight(3);

line(22,358,22,368); //left arm

line(38,358,38,368); //right arm

//draw hero character’s legs

stroke(#768E12);

strokeWeight(3);

line(28,368,28,378); //left leg

line(32,368,32,378); //right leg

//draw character-controlled platform line

stroke(#FFFFFF);

strokeWeight(7);

line(pmouseX,pmouseY,mouseX,mouseY);

}

//functions, events, methods

Code focusing just on Hero and making a Class and Object for it:

Initial Hero movement issues:

When coding Hero with void keyPressed() {} method, I didn’t map the values correctly, so the ending points for the lines representing Hero’s limbs stay fixed and stretch.

Also, I did not program the UP and DOWN arrow keys properly so they move Hero LEFT and RIGHT instead.

Code follows:

void keyPressed() {

if(key == CODED) {

if(keyCode == LEFT) {

heroHead=heroHead-1;

heroBody=heroBody-1;

heroRightArm=heroRightArm-1;

heroLeftArm=heroLeftArm-1;

heroRightLeg=heroRightLeg-1;

heroLeftLeg=heroLeftLeg-1;

} else if(keyCode == RIGHT) {

heroHead=heroHead+1;

heroBody=heroBody+1;

heroRightArm=heroRightArm+1;

heroLeftArm=heroLeftArm+1;

heroRightLeg=heroRightLeg+1;

heroLeftLeg=heroLeftLeg+1;

} else if(keyCode == UP) {

heroHead=heroHead-1;

heroBody=heroBody-1;

heroRightArm=heroRightArm-1;

heroLeftArm=heroLeftArm-1;

heroRightLeg=heroRightLeg-1;

heroLeftLeg=heroLeftLeg-1;

} else if (keyCode == DOWN) {

heroHead=heroHead+1;

heroBody=heroBody+1;

heroRightArm=heroRightArm+1;

heroLeftArm=heroLeftArm+1;

heroRightLeg=heroRightLeg+1;

heroLeftLeg=heroLeftLeg+1;

}

}

}

When I changed the hard-coded x values for the ending points in the lines representing Hero’s limbs to variable names, movement worked correctly. I stumbled across this fix as I was actually doing it to adhere to coding convention. So, now LEFT and RIGHT key-coded movement works (I am now a big believer in variables. LOL!):

AFTER

//draw hero character’s head

stroke(#768E12);

strokeWeight(1);

fill(#768E12);

ellipse(heroHead,349,8,8);

//draw hero character’s body

stroke(#768E12);

strokeWeight(1);

fill(#768E12);

rect(heroBody,360,10,10);

//draw hero character’s arms

stroke(#768E12);

strokeWeight(3);

line(heroLeftArm,358,heroLeftArm,368); //left arm

line(heroRightArm,358,heroRightArm,368); //right arm

//draw hero character’s legs

stroke(#768E12);

strokeWeight(3);

line(heroLeftLeg,368,heroLeftLeg,378); //left leg

line(heroRightLeg,368,heroRightLeg,378); //right leg}

BEFORE

//draw hero character’s head

stroke(#768E12);

strokeWeight(1);

fill(#768E12);

ellipse(heroHead,349,8,8);

//draw hero character’s body

stroke(#768E12);

strokeWeight(1);

fill(#768E12);

rect(heroBody,360,10,10);

//draw hero character’s arms

stroke(#768E12);

strokeWeight(3);

line(heroLeftArm,358,22,368); //left arm

line(heroRightArm,358,38,368); //right arm

//draw hero character’s legs

stroke(#768E12);

strokeWeight(3);

line(heroLeftLeg,368,28,378); //left leg

line(heroRightLeg,368,32,378); //right leg

}

Setting a speed to 1 was too slow, so I increased it to 3 and eventually 5. I won’t settle on a final speed until the next iteration of the project.

Adding Collision

I tweaked and added code based upon an example included in Processing documentation. While it was fairly clear to follow, I will need to work on more examples before I can come up with everything from scratch. I adjusted settings for gravity, random ball display and spring functions. Of course, I didn’t need another setup() {} or draw{} and to keep things neat, I will move the class/object data into a tab.**

**Update 1:

My class shows midterm projects tomorrow and I went from feeling extremely frustrated and anxious about not getting things to work to feeling relaxed and patient. First, I recognize that my attitude is pretty much killing my ability to enjoy what I am doing. Loosening up hasn’t been an easy concept for me to master, but I don’t think I am going to get very far this semester or for the remaining time in this program if I don’t.

Initially I wanted to create a whole level, but I think a level is probably a better final project idea given that I am just about caught up to where the syllabus is (minus one or two subjects). For tomorrow, I am just going to work on getting the hero character to move, balls to bounce and some kind of interaction between them. I spent way too much time trying to get the line to draw when the balls fall and bounce. While each worked separately, placing background code in the draw() { } method kept the balls from following a weird trailing behavior, but caused lines to streak. Placing background code in the setup() {} method did the opposite, causing the line to draw but trails followed the balls as they moved.

Another issue (now resolved) was getting a line to draw when the mouse was pressed. Initially, I had used the void mousePressed() {} method when I should have used an if statement. It is simple thing, but tricky for me as a novice.

I found that working everything out strictly  using setup(){} and draw(){} were very useful, although time consuming. It actually helped me to think about how I would incorporate modular structure rather than create a big mess that I couldn’t read. It also helped me put together a simple sketch of my sketch (for lack of a better word) even though the pieces were not fully functioning as intended. Due to time constraints, I am going to finish as much as I can using objects, functions and arrays and then perhaps come back to finish the basic sketch as an exercise after.

So, changes in my original midterm idea mayinclude:

  • Making the hero character move left, right, down and jump
  • Making ball objects collide
  • Making the hero character and/or balls react when they collide.

I’ll try to post screen shots and another update before tomorrow’s class. That was part of the assignment anyway. ; -D**

levelGameBasicSketch_plainpng

**Original post:

I had a couple of ideas for the ICM midterm project, but in the interest of doing something that can be completed in a week and expanded upon for the final, I am going to create a level (or three) of a game inspired by Trace, an iPhone/iPod Touch game by Kevin Calderone. The player creates their own platforms to get the character to navigate obstacles to an exit. The game is timed and you can compare scores vs other players after all levels are completed or as each level is completed.

In my game, Level, the scene will be created in Processing (of course). For the midterm, navigation is controlled by the arrow keys on the key board. A mouse controls the ability to draw a platform. Ultimately, I want to control navigation by embedding sensors in a mat to move the character left, right or jump as the player does or by using motion/IR sensors. To draw platforms, the user will either wear a glove that connects to a homemade track pad or IR sensors connected to switches or a Wii nunchuck. I would love to build a display-controller via an ad-hock whiteboard or something that borrow’s from Matt Parker’s Lumarca project.

I drew inspiration from a few people,  including Plusea, who has some terrific projects on Instructables including a glove-touch controller. Johnny Lee inspired me to think about the DIY whiteboard and augmentation.

I have been interested in playing with ways to get physical game (such as board game) and video-game players to interact in one game. I started with a project idea in my PComp class and now that I have a few more concepts in Processing under my belt, I am looking forward to putting this together.**

The chalk level in Trace-- Screenshot from YouTube video by the makers of Trace

The chalk level in Trace-- Screenshot from YouTube video by the makers of Trace

Touch finger trackpad-- Screenshot from Plusea's page on Instructables

Touch finger trackpad-- Screenshot from Plusea's page on Instructables

Johnny Lee's Virtual Reality Demo

Johnny Lee's Virtual Reality Demo

Johnny Lee's whiteboard hack

Johnny Lee's whiteboard hack

  1. No comments yet.
  1. No trackbacks yet.