Author: sehenry@andrew.cmu.edu

Final Project -sehenry

For my final project I decided to create a two player game. I like anime so I wanted to have Goku from Dragonball Z fight Naruto from Naruto. After I tested out different types of game play, I decided to make the game a battle of who can tap the fastest. The player on the left (Naruto) needs to press the “a” key as fast as they can while the person on the right needs to press the “l” key as fast as they can. As each person presses their respective buttons, each character’s “Battle Bar” should increase. The objective of the game is to have the largest bar by the end of the time limit. If your character wins, the character shall initiate their ultimate move. Unfortunately, I was unable to upload the sketch successfully for some reason even after I changed the .mp3 location to WordPress but I still wanted everyone to be able to see how my code looks as well as the result. I included some screenshots to show a clearer view of how my project looks. The video links are found under them. The first link leads to a video that shows Goku winning, and the second link shows a video of Naruto winning. I tried doing a screen record to make it clearer, but it just slowed my computer down so I am sorry for the bad quality.

GOKU WINS SCREENSHOTS
screen-shot-2016-12-09-at-3-10-04-pm

screen-shot-2016-12-09-at-3-10-12-pm

NARUTO WINS SCREENSHOTS

screen-shot-2016-12-09-at-3-10-32-pm

screen-shot-2016-12-09-at-3-10-34-pm

screen-shot-2016-12-09-at-3-10-38-pm

screen-shot-2016-12-09-at-3-10-41-pm

screen-shot-2016-12-09-at-3-10-48-pm
VIDEO LINKS

Goku Wins

Naruto Wins

Looking Outwards-12

A project that I really found interesting and that pertained to project is one by Bjork Digital. The project is very short but consists of a man moving around and colors, lights, and animations are moving around and seem to react to the way that he moves. The reason why it relates is because initially I was going to include a camera in my project that reads the positioning of your hands based on the lighting. So instead of pressing a key on a keyboard to make the bars rise to the top, you could kind of raise them to the top by yourself like the text rain letter project. The other project that I found interesitng and that pertained to my project was Masaki Fujihata. This project was supposed to take a camera and focus on a specific object until a video came to life with the object that you were focusing on. Going back to my want of using a camera in my project, this could be a really cool interaction between the characters I am using and the person who is playing the game. Unfortunately I do not believe that I can recreate anything that this project has demonstrated.

Björk
James Merry

●ProjectPlanning / Produce and Production　
　Dentsu Lab Tokyo　

Creator: Daito Manabe

Creator: Masaki Fujihata

Final Project Proposal

20161118_224233

For my final project, I would like to create a little, simple game involving two characters from some TV shows I used to and sometimes watch. I want to create a game that requires players to tap their respective keys ( Key Press A and Key Press L) as fast as they can in order to win. As they press their keys, a level bar will start to fill up. Once this bar is full, the player will see their character attack the other which symbolizes the end of the game. The reason why I want to do this is because I really enjoy making short animations and I think it would be cool to match up the two characters (Naruto and Goku) that are always being compared to each other. If this project goes the way I envision it, then I will be very pleased and can always have a little game to show people that I created. The project would include sound, turtles?, and perhaps a moving background with clouds.

LookingOutwards-11-sehenry

The piece of computer music that I found very interesting was a video called “Pipe Dream”. If you watch the video you will see a series of different objects interact with one another and make this beautiful harmonious melody. There are any other videos as well that symbolize the same thing but the reason why I found this particular one more interesting than the others was the work that must have gone into it. There were so many pieces and so much animation that if the music was strictly created from the computations, this would have been a very long and treacherous project. If it was played by another instrument and then made to match the music this would be different. I still encourage anyone to listen to this song and watch the video! It is fantastic! The second video under that shows a real life version of “Pipe Dream”. I found this at the last second and I am just in awe of what humans can do.

Website:Animusic

Project 11- Composition-sehenry

I tried a bunch of different ideas for this project but in the end I wanted to keep it simple. I created two turtles that would draw and rotate themselves in two different positions and in the end I thought that it kind of looked like a tire on a car. As a result I drew a road and a sign that says how far carnegie mellon is from my home while the tiring is stitching itself together before it hits the road. I think it worked out well.

screen-shot-2016-11-11-at-4-45-03-pm

screen-shot-2016-11-11-at-4-45-12-pm

screen-shot-2016-11-11-at-4-46-23-pm

sketch

//Seth Henry

//Tuesdays at 10:30

//sehenry@andrew.cmu.edu

//Project 10 Frestyle Playing With Turtles

//Global Variables
var turtle1Length = 20
var turtle2Length = 40
var turtle3Length = 50
var turtle4Length = 60

function setup() {
    createCanvas(400, 400);
    background('teal');
    myTurtle1 = makeTurtle(width/2,height/2) //make turtle 1
    myTurtle2 = makeTurtle(width/2,height/2) //make turtle 2
    myTurtle1.penDown();
    push();
    fill(50)
    rect(0,(height/2)-12,width,12) //road
    pop();
}

function draw() {
    
    push()
    rotate(frameCount) //rotation
    turtleLine1(turtle1Length)
    pop();
    push();
    rotate(-frameCount) //rotation in other direction
    turtleLine2(turtle2Length)
    pop();
    line(60,(height/2)-12,60,(height/2)-50) //sign 
    rectMode(CENTER)
    rect(60,(height/2)-50,50,30) //signrectangle
    textAlign(CENTER)
    textSize(5)
    text("CARNEGIE MELLON",60,(height/2)-50) //CMU Text
    text("238 Miles",60,(height/2)-45) //CMU Miles To my House
    push();
    for(i=0;i<width;i+=10){ //road yellow marks
        noStroke()
        fill('yellow')
        rect(i,(height/2)-6,3,1)
    }
    pop();
}

function turtleLine1 (length){ //turtle 1 Actions
    myTurtle1.setColor('blue')
    myTurtle1.setWeight(1)
    strokeJoin(MITER)
    myTurtle1.left(90)
    myTurtle1.forward(10)
    myTurtle1.left(90)
    myTurtle1.forward(20)
    myTurtle1.left(30)
    myTurtle1.forward(length)
   
    
    
}

function turtleLine2 (length){ //turtle 2 Actions
    myTurtle2.setColor('black')
    myTurtle2.setWeight(1)
    strokeJoin(MITER)
    myTurtle2.left(90)
    myTurtle2.forward(10)
    myTurtle2.right(90)
    myTurtle2.forward(20)
    myTurtle2.right(30)
    myTurtle2.forward(length)
    }




function turtleLeft(d) {
    this.angle -= d;
}


function turtleRight(d) {
    this.angle += d;
}


function turtleForward(p) {
    var rad = radians(this.angle);
    var newx = this.x + cos(rad) * p;
    var newy = this.y + sin(rad) * p;
    this.goto(newx, newy);
}


function turtleBack(p) {
    this.forward(-p);
}


function turtlePenDown() {
    this.penIsDown = true;
}


function turtlePenUp() {
    this.penIsDown = false;
}


function turtleGoTo(x, y) {
    if (this.penIsDown) {
      stroke(this.color);
      strokeWeight(this.weight);
      line(this.x, this.y, x, y);
    }
    this.x = x;
    this.y = y;
}


function turtleDistTo(x, y) {
    return sqrt(sq(this.x - x) + sq(this.y - y));
}


function turtleAngleTo(x, y) {
    var absAngle = degrees(atan2(y - this.y, x - this.x));
    var angle = ((absAngle - this.angle) + 360) % 360.0;
    return angle;
}


function turtleTurnToward(x, y, d) {
    var angle = this.angleTo(x, y);
    if (angle < 180) {
        this.angle += d;
    } else {
        this.angle -= d;
    }
}


function turtleSetColor(c) {
    this.color = c;
}


function turtleSetWeight(w) {
    this.weight = w;
}


function turtleFace(angle) {
    this.angle = angle;
}


function makeTurtle(tx, ty) {
    var turtle = {x: tx, y: ty,
                  angle: 0.0, 
                  penIsDown: true,
                  color: color(128),
                  weight: 1,
                  left: turtleLeft, right: turtleRight,
                  forward: turtleForward, back: turtleBack,
                  penDown: turtlePenDown, penUp: turtlePenUp,
                  goto: turtleGoTo, angleto: turtleAngleTo,
                  turnToward: turtleTurnToward,
                  distanceTo: turtleDistTo, angleTo: turtleAngleTo,
                  setColor: turtleSetColor, setWeight: turtleSetWeight,
                  face: turtleFace};
    return turtle;
}

Looking Outwards 10-sehenry

Loop.ph is a studio based in London and was created by Mathias Gmachl and Rachel Wingfield. This studio focuses on architecture, design, and other sciences. They try and connect reality, the virtual, and the future. One of the projects that I was looking at that they did was very interesting to say that least. They built a small bicycle course that had lights implanted on the course to represent something bigger. The course was supposed to be a way to celebrate the relationship between Taipei and the importance of healthy living styles. Going deeper into the description of the project (found HERE), you can see how they were trying to connect the structure of course to how lungs are structured while the cycling can represent air quality and its effect on the lungs. I cannot do it justice by explaining it here so click on the link to read more.

Rachel Wingfield is a researcher and a designer who trained at the Royal College of Art in London. She works on a lot of environmental and living systems related projects.

I really liked this project because I think it is important to educate people on their environment and how it affects their body. Rachel and her partner just found a really cool way to do it!

Project 10-sehenry

dragon-sketch

spirited-away-gif

sketch

//Seth Henry

//Tuesdays at 10:30

//sehenry@andrew.cmu.edu

//Project 10: Generative Landscape

//Global Variables 


var terrainSpeed = 0.0005;
var terrainDetail = 0.0005;
var clouds = []
var sizeD = 30
var dragonHead;
var stars = []
var star;
var Star;


function preload() {
    dragonHead = loadImage("http://i.imgur.com/vAqmPf5.png"); //loads image of spirited away dragon
}

function setup() {
    createCanvas(600, 400);
    frameRate(10);
    for(i=0;i<100;i++){ //puts a load of random stars in the sky
        stars.push(new Star(random(600),random(250)))
    } 
}

function Star(positionX,positionY){ //Position for stars
    this.x=positionX
    this.y=positionY
    this.draw = function(){
    stroke(255)
    point(this.x,this.y)
    }
}

function draw() {
    background(25,25,112);
    stroke(255)
 for(i=0;i<stars.length;i++){ //Draws stars through many times
        stars[i].draw();
    }
    push();
    noStroke();
    fill('khaki')
    ellipse(width/2, 30, 40,40)
    pop();
    push();
    noStroke();
    fill('midnightblue')
    ellipse(290,28,40,40)
    pop();

 for(i=0;i<20;i++){ //supposed to be scales coming off the dragon
    fill(255)
    rect(random(width),random(400),20,.5)
}
    updateAndDisplayClouds()
    removeClouds();
    addRandomClouds();
    noFill(); 
    beginShape(); //draw dragon body shape
    stroke(255)
    for (var x = 20; x < width-90; x++) {
        strokeCap(ROUND);
        var t = (x * terrainDetail) + (millis() * terrainSpeed);
        var y = map(noise(t), 0,1, 0, mouseY);
        vertex(x, y);
        vertex(x,y-10) 
       }
    endShape();


    image(dragonHead, width-100, y-40, 70,70); //Dragon head attached to the dragon body
}





function updateAndDisplayClouds(){ //
    // Update the cloud's positions, and display them.
    for (var i = 0; i < clouds.length; i++){
        clouds[i].move();
        clouds[i].display();
    }
}
function removeClouds(){
   
    var cloudsToKeep = [];
    for (var i = 0; i < clouds.length; i++){
        if (clouds[i].x + clouds[i].breadth > 0) {
            cloudsToKeep.push(clouds[i]);
        }
    }
    clouds = cloudsToKeep; // remember the surviving clouds
}
function addRandomClouds() {
   //Add a random cloud with probability 
    var newCloudLikelihood = 0.23; 
    if (random(0,1) < newCloudLikelihood) {
        clouds.push(makeClouds(width));
    }
}
function cloudMove() {
    this.x += this.speed; //the cloud speed
}
function cloudDisplay() { //height of cloud
    var floorHeight = 20;
    var bHeight = this.nFloors * floorHeight; 
    fill(150); 
    stroke(0); 
  push();
    noStroke();
    ellipseMode(CENTER)
    translate(this.x, height - 40);
    ellipse(20, -bHeight+40, this.breadth, bHeight);
    ellipse(40, -bHeight+20, this.breadth, bHeight);
    ellipse(60, -bHeight+40, this.breadth, bHeight);
    stroke(200); 
  pop();
}


function makeClouds(beginLocationX) { //function for making the clouds
    var cld = {x: beginLocationX,
                breadth: 60,
                speed: -3.0,
                nFloors: round(random(1,4)),
                move: cloudMove,
                display: cloudDisplay}
    return cld;
}

As I was thinking about what I could do this project on, I realized that I could use the noise line that is used in the plant the flags project as an object or representation of a dragons body. I would just have to upload an image of a dragon head to make it look realistic. As I was thinking about how the project was going to look like, I kept remembering the movie, Spirited Away and how Haku kind of moved like a wavy line. I decided to use the movie as an inspiration. I tried to add rectangles going by to represent the scales coming off of the dragon but I had a hard time focusing the scales around the body so I just left them as wind strokes.

LookingOutwards-09-sehenry

The post that I thought had an interesting yet simple concept was found in Vtavarez‘s week 4 post. He wrote about how an artist made a graphical representation of a musical composition called He’s a Pirate. I listened to the soundtrack and it was the one from Pirates of the Caribbean. If you click on the link, then you can see that the The Wrong Way to Draw a Pirate is a animation of how the song comes to be. In the past LookingOutwards, I loved when we analyzed the relationship between sound and animation and this is just another example of how cool these things can be when they are illustrated clearly. The person who made this composition has made a series called The Wrong Way to Draw Music. On there, they have many different types of songs that are portrayed the same way as the Pirate song was. I do agree that the way that the song is drawn, could have been better. All the layers that were written before hand just get layered over by new sounds and pitches. However, I still think it was a really cool idea.

Project 09 – Computational Portrait – sehenry

For this project I wanted to use a photo that looked really clear and artistic. So as I was scrolling through photos on my phone, I found a photo that my girlfriend took of herself and edited. I thought that the green background of the building would look really good split apart by many pixels. As I looked at the example on the deliverable page, I wanted to include a different shape and background to present itself as the picture comes together. So I decided to use small triangles while allowing the user to use their mouse to drag even smaller circles to reveal more detail in the face or clothing.

I enjoyed this project.

rachelhairflip

screen-shot-2016-10-27-at-5-23-29-pm

screen-shot-2016-10-27-at-5-27-25-pm

screen-shot-2016-10-27-at-5-34-36-pm

sketch

//Seth Henry

//Tuesdays at 10:30

//sehenry@andrew.cmu.edu

//Project 09 Computational Portrait 

//Global Variable 

var rachelImg;

function preload() {
    var rachelUrl = "http://i.imgur.com/z5nysOD.jpg" //Upload Picture
    rachelImg = loadImage(rachelUrl);
}

function setup() {
    createCanvas(600, 500);
    background(255); //white background
    rachelImg.loadPixels(); //Grab pixels
    frameRate(1500);//Pixels Appear Fast
}

function draw() {
  
    var rW = random(width); //Random x Loc
    var rH = random(height); //Random y Loc
    var posX = constrain(floor(rW), 0, width-25); //Will not appear past boundaries
    var posY = constrain(floor(rH), 0, height-25);
    var rachelColor = rachelImg.get(posX,posY) //Retrieve color pixels of image
    noStroke();
    fill(rachelColor);
    rectMode(CENTER)
    triangle(rW,rH, rW+4,rH-4, rW+8,rH); //draw triangles


}
function mouseDragged(){
    var rachelColor = rachelImg.get(mouseX,mouseY) //Retrieve color of pixel where mouse is
    noStroke();
    fill(rachelColor);
    ellipse(mouseX,mouseY,1,1) //Drags smaller, more defined pixels in shape of circle
}

Looking Outwards-08-sehenry

Eyeo 2013 – Memo Akten from Eyeo Festival // INSTINT on Vimeo.

Memo Akten Bio

Memo Akten is a visual artist, director, musician, and engineer which is probably why I admire his work a lot. He takes many aspects of what he is passionate about and illustrates it through his work. He has been involved in the video game industry as well as the music industry. One thing that shows how his wide variety of talents can combine together, is demonstrated by one of his projects called the Webcam Piano 2.0. In his lecture he talks about this project and if you look at it and listen, the Webcam piano really resembles a mixture of a video game and a music performance. He was born in Instanbul Turkey and has lived in London as well. Being in these different places surely shaped part of who he is today. I have a lot of family in England, and I have been there as well and I can tell you that it is a very artistic and expressive place. In his lecture he always tries to bring in his viewers by explaining each project in depth and you can see in his eyes how important these things are to him. He describes himself as someone who wants to illustrate Poetry of Reality and cross back and forth from reality and the digital. Memo takes different projects from other people whether it be musical or other, and recreates it digitally. This can be shown by his Simple Harmonic Function project. His background of being a civil engineer really allows him to tie together his artistic side with his digital experience. He has been involved in many other projects that I have not mentioned that are unparalleled by many projects I have seen from other artists. This is why I admire him. He strives to separate himself from the crowd to create his own brand and he loves doing it.