Month: April 2018

To be honest, I did not get much new information from this reading. It talks about the phenomenon of the digitalization of everything in the second Machine Age and how the large and comprehensive database and the almost free nature of reproduction of digital data have completely changed the way we do science, invest in real estates, find our way to work and so much more.

On the other hand, the availability and size of data are so powerful that, if used inappropriately, could be very damaging. For example, many personal data have been used by companies like Cambridge Analytica to swing elections and place ads.

I created the game “Snake” using three classes: the board class, the snake class, and the food class. The movement of the snake is controlled by the w, s, a, and d keys.

The win/game over functions were integrated directly into the draw function.

The following is a quick video demonstration of the game in action:

This is my code:

ArrayList<Integer> positionsX = new ArrayList<Integer>();
ArrayList<Integer> positionsY = new ArrayList<Integer>();

int dimSquare = 40;
int dim = 800;
int positionX = 5;
int positionY = 5;
int foodX = 15;
int foodY = 15;
int [] dirX = {1,-1,0,0};
int [] dirY = {0,0,1,-1};
int direction = 0;
int speedOfGame = 10;
boolean gameover = false;

class gameBoard{
gameBoard(){}

void drawLines(){
noFill();
stroke(0);
strokeWeight(1);
for(int i = 0; i < dim; i++){
line(dimSquare*i, 0, dimSquare*i, dim);
line(0, dimSquare*i, dim, dimSquare*i);
}
}
}

class snake{
snake(){
positionX = positionX*dimSquare;
positionY = positionY*dimSquare;
}

void drawSnake(){
fill(0,255,0);
noStroke();
for(int i = 0; i < positionsX.size() ; i++){
rect(positionsX.get(i)*dimSquare, positionsY.get(i)*dimSquare, dimSquare, dimSquare);
}
if(frameCount % speedOfGame == 0){
positionsX.add(0, positionsX.get(0) + dirX[direction]);
positionsY.add(0, positionsY.get(0) + dirY[direction]);
//positionsX.add(0, dirX[direction]);
//positionsY.add(0, dirY[direction]);
positionsX.remove(positionsX.size() – 1);
positionsY.remove(positionsY.size() – 1);
}
}

void growSnake(){
positionsX.add(1, positionsX.get(0) + dirX[direction]);
positionsY.add(1, positionsY.get(0) + dirY[direction]);
}
}

class food{
food(){
}

void drawFood(){
fill(255, 0, 0);
rect(foodX*dimSquare, foodY*dimSquare, dimSquare, dimSquare);
}
}

gameBoard a;
snake b;
food c;

void setup(){
size(802, 802);
a = new gameBoard();
b = new snake();
c = new food();
positionsX.add(5);
positionsY.add(5);
}

void draw(){
if(gameover == false){
background(255);
//a.drawLines();
b.drawSnake();
c.drawFood();
if(positionsX.get(0) == foodX && positionsY.get(0) == foodY){
foodX = (int)random(0,20);
foodY = (int)random(0,20);
b.growSnake();
}
if(positionsX.get(0) < 0 || positionsY.get(0) < 0 || positionsX.get(0) >= 20 || positionsY.get(0) >= 20){
gameover = true;
fill(0);
textSize(30);
textAlign(CENTER);
text(“GAME OVER.”,width/2,height/2);
}
if(positionsX.size() == 20){
gameover = true;
fill(0);
textSize(30);
textAlign(CENTER);
text(“YOU WINNNNN.”,width/2,height/2);
}
}
}

void keyPressed(){
int keyInput = 0;
if(key == ‘d’){
keyInput = 0;
}
if(key == ‘a’){
keyInput = 1;
}
if(key == ‘s’){
keyInput = 2;
}
if(key == ‘w’){
keyInput = 3;
}
if(keyInput != -1){
direction = keyInput;
}
}

For this assignment, I have worked with class and objects.

I based the idea on the work I replicated for Assignment 6 and came up with the code with the help of Getting started with Processing and online resources.

Here is the code that I used:

CrazyShape circle1, circle2, square3;

void setup() {
size(500,500);
smooth();
circle1 = new CrazyShape(20, 1.5, color(random(255), 125, 0));
circle2 = new CrazyShape(10, 3, color(255, 0, random(155)));
square3 = new CrazyShape(30, 2.5, color(0, random(125), 255));
}

void draw() {
circle1.move();
circle1.displayCircle();
circle2.move();
circle2.displayCircle();
square3.move();
square3.displaySquare();
}

CrazyShape

class CrazyShape {
float x;
float y;
int diameter;
float speed;
color c;

CrazyShape(int id, float ispeed, color ic) {
x = random(width);
y = random(height);
speed = ispeed;
diameter = id;
c = ic;
}

void move() {
x += random(-speed, speed);
y += random(-speed, speed);

if (x < 0+diameter) {
x = random(width);
c = color(random(255), random(255), random(255));
} else if (x > width-diameter) {
x = random(width);
c = color(random(255), random(255), random(255));
}

if (y < 0+diameter) {
y = random(height);
c = color(random(255), random(255), random(255));
} else if (y > height-diameter) {
y = random(height);
c = color(random(255), random(255), random(255));
}
}

void displayCircle() {
fill(c);
ellipse(x, y, diameter, diameter);
}

void displaySquare() {
fill(c);
rect(x, y, diameter, diameter);
}
}

I struggled a lot with just trying to figure out how to work the ‘class’ thin, even though I understood the overall concept. Eventually, after watching a few videos and getting help from classmates, I worked it out.

My code is as follows:

//Main CircleDrawing
Shape shape1;
Shape shape2;
Shape shape3;
Shape shape4;
Shape shape5;
Shape shape6;
Shape shape7;
Shape shape8;

int x1= mouseX;
int y1 = mouseY;
color red = color(255, 0, 0, 20);
color green = color(0, 255, 0, 30);
color blue = color(0, 0, 255, 10);

int counter = 1;

void setup(){
size (500,500);
smooth();
colorMode(HSB);
shape1 = new Shape(x1, y1, 250, 150, 250, 250, 100, 100);
shape2 = new Shape(x1, y1, 150, 250, 250, 250, 400, 200);
shape3 = new Shape(x1, y1, 400, 250, 250, 250, 100, 400);
shape4 = new Shape(x1, y1, 250, 400, 250, 250, 50, 290);

}

void draw(){
background(250);
shape1.display();
shape2.display();
shape3.display();
shape4.display();
noStroke();

if(counter == 1) {
fill(red);
}
else if(counter == 2) {
fill(green);
}
else if(counter == 3) {
fill(blue);
}

if (mousePressed == true) {
ellipse(mouseX, mouseY, 50, 50);
}

}

void mouseReleased() {
counter++; // increase the counter
if(counter == 4) {
counter = 1; // loop after 3
}
println(counter);
}

//Class

class Shape{

//Variables
int x1, y1, x2, y2, x3, y3, x4, y4;

//The Constuctor
Shape(int px1, int py1, int px2, int py2, int px3, int py3, int px4, int py4){
x1 = px1;
y1 = py1;
x2 = px2;
y2 = py2;
x3 = px3;
y3 = py3;
x4 = px4;
y4 = py4;
}
//Functions

void display(){
//x1 = int(random(x1-10,x1+10));
//y1 = int(random(y1-10,y1+10));
x1 = mouseX;
y1 = mouseY;
quad(x1, y1, x2, y2, x3, y3, x4, y4);

}

}

 

This is the final product:

 

I think this could be improved by designing more organized shapes to create an image perhaps.

       

I replicated the work done by Edward Zajec.

Here is the code that I used:

void setup() {
size(380, 500);
}

void draw() {
background(255);
noFill();
smooth();
strokeWeight(1);
stroke(0);

//circle1
for (int i=25; i<359; i+= 25) {
ellipse(140, 150, i, i);
}

//circle2
for (int i=10; i<200; i+= 8) {
ellipse(355, 380, i, i);
}

//square1
stroke(150);
pushMatrix();
{
rotate(PI/5);
for (int i=2; i<120; i+=4) {
rectMode(CENTER);
rect(250, -20, i, i);
}
popMatrix();
}

//circle3
stroke(100);
for (int i=2; i<80; i+= 3) {
ellipse(280, 180, i, i);
}

//square2
stroke(120);
pushMatrix();
{
rotate(PI/6);
for (int i=2; i<200; i+=6) {
rectMode(CENTER);
rect(380, 180, i, i);
}
popMatrix();
}

//triangle
stroke(0);
for (int i=2; i<30; i++){
triangle(40,15,44+i,17+i, 37-i, 13+i/2);
triangle(45,15,48+i,13-i,48+i,17+i);
triangle(30,13,7+i/2,25-i/4,68-i,-27+i);
}
}

Cinema Section:

The first thing I noticed when reading this was the author is tying together a bit too many metaphors/similes and so it makes it a bit confusing. In one page he likens books to films; movies to computer culture; the mobile camera being essential to computer culture and the “3D-ness it brings” along with a whole other plethora of comparisons and expressions. And this was all just on the first page.

He then goes on to talk about various objects such as VR, (computer) games, more on 3D space and models, and perspective. I can see his intention in this, but the jargon made it difficult to process.

HCI: Representation versus Control Section:

He then talks about remediating. I particularly liked how he brought up the example of Xerox making basic standards of interfaces, and how these were repurposed. He then talks more about these interfaces, and how they differ from books… for some reason…

Overall, some aspects he mentioned that I want to keep in mind are how culture affects design. (Such as with computer icons)

When looking at the art work displayed in the presentation, I was conflicted on whether or not I liked it. I genuinely enjoyed the idea of how he made the artworks, as I am interested in generated, repeated patterns, but I didn’t actually love the end results too much. To quote Kristopher in class, some of the pieces did look a little too “crowded” or “busy”.

I enjoyed how there is a balance of semi-abstraction vs. complete abstraction, as in the pieces (including some of the other artists he talks about such as mondrian who did the colorful squares we all have seen at least once [mondrian works] )

Overall, I agree with my peers that the video tended to be a bit on the monotonous side, but overall, some interesting concepts of chaos and abstraction were explored.

Last week, I went to an Institute talk regarding recent discoveries in the universe that has been found using a new type of telescope that is able to act like a satellite.

One of the coolest ideas that I found in that talk was the idea that there are certain “moon” like structures that have a gravitational pull that allows “planets” and asteroids to orbit it. However, because of the different mass of the asteroids/planets, there exist different orbit distances and speeds that they travel at. On top of this, sometimes, there even exists orbits around the asteroids/planets that are orbiting the bigger moon – much like Earth’s moon.

I wanted to replicate this idea and so instead of a game, I wanted to create a moving art piece that basically shows what the speaker was talking about.

The code can be seen below:

Moon moon, moon2;
Orbits orbits, orbits1, orbits3;

void setup() {
size(600, 600);
smooth(8);
background(0);
moon = new Moon(80);
orbits = new Orbits(150, 0.2, 2.5);
orbits1 = new Orbits(400, 0.05, 4);
orbits3 = new Orbits(200, 0.1, 6);
}

void draw() {
//frameRate(1200);
moon.draw();
//moon.stopTurning();
orbits.draw();
orbits1.draw();
orbits3.draw();
}

These are the class tabs:

//class definition of Moon
class Moon{
PVector v1, v2; //attribute of moon
int diameter; //another attribute of moon

Moon(int d){ //this is the constructor 
//does nothing over here
diameter =d; //this is a parameter of the constructor
}

void draw(){
fill(0);
rect(0, 0, width, height);

noFill();
strokeWeight (0.3);
stroke (255, 12); 

for (int i = 0; i < 7000; i++)
{
float angle1 = random (TWO_PI);
float angle2 = random (TWO_PI);
v1 = new PVector (width/2 + cos (angle1) * diameter, height/2 + sin (angle1) * diameter);
v2 = new PVector (width/2 + cos (angle2) * diameter, height/2 + sin (angle2) * diameter);

line (v1.x, v1.y, v2.x, v2.y);
}
//noLoop();
}


} //end of class definition

class Orbits {
float a, x, y, diax, diay;
float d = 23;
int para;
float speed;
float speed4orbit;
float b;

Orbits(int p, float s4o, float s){
para = p;
speed4orbit = s4o;
speed = s;;
}

void draw (){
// earth

pushMatrix();

translate(width/2, height/2);
fill(255);
ellipse(x, y, d, d);

// moon
pushMatrix();
translate(x, y);
rotate(radians(a));
ellipse(0, d, d/3, d/3);
popMatrix();

// orbit line
stroke(255, 100);
smooth();
noFill();

ellipse(0, 0, diax*2, diay*2);


x = sin(radians(-a)*speed)*diax;
y = cos(radians(a)*speed)*diay;
a += 4;

diax = lerp(diax, para, speed4orbit);
diay = lerp (diay, para, speed4orbit);
popMatrix();
}
}

 

Here is a screenshot of one of the frames.

One thing I am not happy with, and I can’t seem to figure out, is how not smooth the movements are. I tried to change the frameRate but that didn’t work out.

One new thing that learned for this project was PVectors, which I found out how to use through examples.

In describing this project, space invaders was mentioned a bunch of times, and I decided that it sounded reasonably fun to work on.

I set up my game as if there would be multiple enemies who would shoot back, though in my current implementation enemies win by reaching the end, and are all simple circles, ship the ship is a triangle.

The main code is very simple, creating a game and having the win logic.

Game game;
float divisions= 50;
void setup(){
  size(500,500);
  game= new Game();
  frameRate(30);
}
void draw(){
  game.draw();
  if(!game.update()){
    int score= game.getScore();
    game=null;
    background(0);
    textSize(32);
    text("Game Over",width/7,height/2-50);
    text("Score: "+score,width*3/7,height/2+50);
    noLoop();
  }
  
}
void keyPressed(){
  game.keyPressed(key);
}

The game is also simple, just facilitating the interaction of the enemies, ship, and projectiles, and containing each. Also tracks the larger game logic like score and lives.

import java.util.Iterator;
class Game{
  ArrayList<Enemy> enemies;
  Ship ship;
  ArrayList<Projectile> projectiles;
  float timer;
  float enemyRate= 500;
  float levelTimer;
  float levelRate= 30000;
  int lives;
  int score;
  Game(){
    enemies= new ArrayList<Enemy>();
    ship= new Ship(this);
    projectiles= new ArrayList<Projectile>();
    timer= millis();
    levelTimer= millis();
    lives= 10;
  }
  void keyPressed(int key){
    ship.keyPressed(key);
  }
  boolean update(){
    Enemy enemy;
    Iterator<Enemy> enemyIterator= enemies.iterator();
    while(enemyIterator.hasNext()){
      try{
          enemy=enemyIterator.next();
        }
        catch(Exception e){
          break;
        }
      enemy.update();
      Projectile projectile;
      Iterator<Projectile> projectileIterator= projectiles.iterator();
      if(enemy.reachedEnd(ship)){
        enemies.remove(enemyIterator);
        enemies.remove(enemy);
        score-=100;
        lives--;
      }
      while(projectileIterator.hasNext()){
        try{
          projectile=projectileIterator.next();
        }
        catch(Exception e){
          break;
        }
        if(projectile.checkImpact(enemy)){
          enemies.remove(enemyIterator);
          enemies.remove(enemy);
          projectiles.remove(projectileIterator);
          projectiles.remove(projectile);
          score++;
        }
      }
      if(levelTimer+levelRate<millis()){
        enemyRate/=1.3;
        score*=1.3;
        levelTimer=millis();
      }
    }
    ship.update();
    for(Projectile projectile: projectiles){
      projectile.update();
    }
    if(timer+enemyRate<millis()){
      enemies.add(new Enemy(width/divisions,height/divisions,game));
      timer=millis();
    }
    return lives>0;
  }
  void draw(){
    background(0);
    for(Enemy enemy: enemies){
      enemy.draw();
    }
    ship.draw();
    for(Projectile projectile: projectiles){
      projectile.draw();
    }
    fill(255);
    textSize(8);
    text("lives: "+lives,10,10);
    text("score: "+score,width-50,10);
  }
  void addProjectile(Projectile projectile){
    projectiles.add(projectile);
  }
  int getScore(){
    return score;
  }
}

The first component class is ship, moves according to controls (z,x,’ ‘), mostly just creates projectiles

class Ship{
  float x;
  float step;
  float y;
  boolean shooting;
  float sWidth;
  float sHeight;
  float timer;
  float fireRate;
  Game game;
  Ship(Game game){
    this.game= game;
    x= width/2;
    step= width/divisions;
    y= width*(divisions-2)/divisions;
    sWidth= width/divisions;
    sHeight= height/divisions;
    timer= millis();
    fireRate= 250;
    shooting=false;
  }
  void keyPressed(int key){
    if(key=='x'&&x<width-sWidth){
      x+= step;
    }
    else if(key=='z'&&x>sWidth){
      x-= step;
    }
    else if(key==' '){
      shooting=!shooting;
    }
  }
  void update(){
    if(timer+fireRate<millis()&&shooting){
      shoot();
      timer= millis();
    }
  }
  void draw(){
    triangle(x-sWidth/2,sHeight+y,x,y,x+sWidth/2,sHeight+y);
  }
  void shoot(){
    game.addProjectile(new ShipProjectile(x,y));
  }
  float getY(){
    return y;
  }
}

Since in theory projectiles can be made by enemies (though collision detection would need a re-write, mostly an if instance of or separate detection logic for each projectile type.), there is a parent and child version

class Projectile{
  float x;
  float y;
  float xVelocity;
  float yVelocity;
  Projectile(float x, float y){
    this.x=x;
    this.y=y;
  }
  void update(){
    x+=xVelocity;
    y+=yVelocity;
  }
  void draw(){
    stroke(255);
    point(x,y);
  }
  boolean checkImpact(Enemy enemy){
    return((x-enemy.getX())*(x-enemy.getX())+(y-enemy.getY())*(y-enemy.getY()))<enemy.getR()*enemy.getR();
  }
}

class ShipProjectile extends Projectile{
  ShipProjectile(float x, float y){
    super(x,y);
    xVelocity=0;
    yVelocity=-height/divisions*3/4;
  }
}

The logic is the same for each, the child simply gives numbers

Last class is enemy, walks down the screen from side to side.

class Enemy{
  float x;
  float y;
  float r;
  float xVelocity;
  int direction;
  Game game;
  Enemy(float x, float y, Game game){
    this.game=game;
    this.x=x;
    this.y=y;
    r=sqrt(width*height/(divisions*divisions));
    xVelocity=r/2;
    direction=1;
  }
  void update(){
    if(r<x&&x<width-r||direction==0){
      if(direction==0){
        if(x<width/2){
          direction=1;
        }
        else{
          direction=-1;
        }
      }
      x+=xVelocity*direction;
    }
    else if(x<=r&&direction!=0){
      y+=2*r;
      direction=0;
    }
    else if(x>=width-r&&direction!=0){
      y+=2*r;
      direction=0;
    }      
  }
  void draw(){
    fill(255);
    ellipse(x,y,r,r);
  }
  float getX(){
    return x;
  }
  float getY(){
    return y;
  }
  float getR(){
    return r;
  }
  boolean reachedEnd(Ship ship){
    return y>ship.getY();
  }
}

End result: