# Midterm – Meera.

When coming up with an idea for this game, I wanted to make a game that tends to the compulsiveness of having things be in order. I started out with just one white box in the center of my screen. I wanted the box to be spinning around itself, once I did that I added two more boxes the same size as the one in the middle. These boxes spun in different orders around themselves and the objective was to strategically make them stop , on command, at a moment they were all aligned. The game was set up with no way of winning, so a different approach was given. The next approach was to have the boxes orbit as though they were in a solar system. Now that the approach was changed the objective was altered too, the objective became that all the boxes must align around a straight horizontal line that went across the middle of the game window. After setting that up, a system of knowing that the boxes were aligned had to be made, and adding a start menu.

desgin notes 1

rotaysqay recoding

solar rotate align recording

boxes start menu and alignment text

Now I had to clean up the idea, I needed a theme and sound and text and better orbiting for my boxes. I started with my theme, I took inspiration from the movement of the boxes and decided on making the theme a solar theme. I put a yellow sun in the middle of my screen and made the boxes into orbiting spheres that circle around the sun. I added an image for my background but it glitched the orbiting spheres, my issue was that I was uploading the image as a pixel rather than just as an image.

the was how it looked before I fixed it.

Once that was done, I working on the orbiting of my spheres. The problem was that only two spheres aligned at a time, it was mostly the outer sphere which was “ ellipse #3” that never aligned well. I messed around with three of the main components of the orbiting: the radian, the speed, and the radius (ring radius, or how far from the center each orbit ellipse is ). When I altered #3’s speed it made a difference but it still didn’t align them enough. I attempted a little with the radius but that did nothing to my alignment, so I ventured off to my final experiment which was the radian. I decreased the number of the radian in #3 and it got very close to the alignment, so I decided to increase the range of acceptance of a coded alignment. Once I did that, the player could finally win. I added text to help the player see that which sphere is aligned once paused.

Orbit fix

post space aligment clean up

Finally, I imported a sound file to the game. At first, I had the sound play when key was pressed, but since I started out with the code “ song.play();” it got chaotic every time the player paused for alignment.  Thus, I had the “ song.play();” moved up to the void setup, but now the sound ended even though the player is still playing. Therefore, I changed it to “ song.loop();” and it finally worked.

Finally, here’s the end result:

```boolean paused = false;
float r;
float t;
float q;
float rX, rY;
float tX, tY;
float qX, qY;
float rSpeed, tSpeed, qSpeed;
int mode = 0;
PImage img;

//sound stuff
import processing.sound.*;
SoundFile song;

void setup() {
size (800, 800);
rectMode(CENTER);
song = new SoundFile( this, "UpBeet copy.wav");
song.loop();
song.amp(.05);
}

void draw() {
image(img, 0, 0);
// if statment that take us to the start menu
if (mode==0) {
background(0, 0, 0);
textAlign(CENTER);
textSize(20);
fill(40, 85, 56);
text( " Press Space to Play  :)", width/2, height/2);
textSize(16);
fill(50, 100, 89);
text (" align the grey circles as horizontally as possible, press 'p' on your keyboard to align.", width/2, height/2+30);
drawStartScreen();
}

// if statment that take us from the start menu to the game
if (mode == 1) {

// line in the center
line(0, height/2, width, height/2);

//  center ellipse- ellipse#1
//rotate(r);
fill(255, 255, 0);

ellipse(width/2, height/2, 60, 60);

fill(55, 64, 80);
rX = cos(r) * radius + width/2;
rY = sin(r) * radius + height/2;
ellipse(rX, rY, 30, 30); // x,y,w,h

//middle ellipse- ellipse#2

tX = cos(t) * radius*2 + width/2;
tY = sin(t) * radius*2 + height/2;

ellipse(tX, tY, 30, 30); // x,y,w,h

////outer ellipse- ellipse#3
qX = cos(q) * radius*3 + width/2;
qY = sin(q) * radius*3 + height/2;
ellipse(qX, qY, 30, 30); // x,y,w,h

if (!paused) {
r+= rSpeed;
t+= tSpeed;
q+= qSpeed;
}

// IF STATMENTS TO LET THE PLAYER KNOW HOW THEY'RE DOING :
//println(abs(rY-height/2));
if (paused) {
if (abs(rY-height/2)<40 ) {
textSize(30);
fill(0, 255, 0);
text("sphere1: good job!", width/2, height/2+50);
} else {
textSize(30);
fill(255, 0, 0);
text("sphere1: try again..", width/2, height/2+50);
}
}
if (paused) {
if (abs(tY-height/2)<40) {
textSize(30);
fill(0, 255, 0);
text("sphere2: good job!", width/2, height/2 +80);
} else {
textSize(30);
fill(255, 0, 0);
text("sphere2: try again..", width/2, height/2+80);
}
}

if (paused) {
if (abs(qY-height/2)<40) {
textSize(30);
fill(0, 255, 0);
text("sphere3: good job!", width/2, height/2 +120);
} else {
textSize(30);
fill(255, 0, 0);
text("sphere3: try again..", width/2, height/2+120);
}
}
}
}

// the drawing for the start menu
void drawStartScreen() {
}

// the function that created the Start menu
void keyPressed() {
if (key==' ') {
if (mode==0) {
mode=1;
} else if (mode==1) {
mode=0;
}
}

}

// the function that pauses the game
void keyReleased() {

if ( key == 'p' ) {

paused = !paused;
}
//img.updatePixels();
image(img, 0, 20);
}```

ZIP: