Monday, June 11, 2012

Snoop

So on this past saturday I had to put my dog snoop to bed.

This picture of me portrays my anger and sadness, surrounded by gates of heaven. Showing my feelings as he passes through to the other side.



Sunday, June 10, 2012

So I took a picture of the phantom of the opera, and then took a picture of myself and morphed my face into his, and then added his mask afterward.



There's a snake in my boot!

So I decided to place myself in a snake habitat! Here is a photo of me with a snake when they had the zoo come to UT.





I used these photos and added a shadow into my last picture!

Wednesday, June 6, 2012

Poster

So for my poster, instead of taking a badass position on it like everyone else and incorporating blood and guns and so on I decided to take this picture of myself and make it into an empowering poster



I made a few differenent versions,










However this one turned out to be my favorite





Here is a side by side




Sunday, June 3, 2012

Calligram

When I started my calligram project I originally thought I was going to do the Phantom of the Opera mask, but then I realized that it was a little too easy and I wanted something that was slightly more of a challenge. So then I decided to take a look at my recently played songs in my Ipod. Came across lady gaga, and decided to do her born this way song because it reflects my life directly.

The background images I used are these two, 



I added the first picture in the middle, and took the second picture and mirrored it so that her face is looking in both directions then set the transparency around 10 percent. 

I created a cross with the border of "Born this way" and inside the cross is actually a calligram of the christ of the redeemer. This is the picture i used to trace and use area texts inside 


Then I realized I needed to add something else. So the cross was actually added after the calligram of the statue. Then I added some more text ontop of the statue and cross. 

I added "Gay" and "Straight" ontop of each side to symbolize that they go hand in hand with one another. 


This turned out to be the final project 



Monday, May 28, 2012

This is what 600 Lines of HTML gets me!

The Original inspiration:


What I made:



And the code that made it all possible:


<!DOCTYPE HTML>
<html>
<head>
<script>
window.onload = function() {
var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");

////////////////////////////////////// start below this line
//background
context.beginPath();
        context.rect(0, 0, 1280, 800);
        context.fillStyle = 'black';
        context.fill();
        context.lineWidth = 5;
        context.strokeStyle = 'black';
        context.stroke();




//black circle
{
  var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /2.1;
        var centerY = canvas.height /2;
        var radius = 375;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 50;
        context.strokeStyle = "silver";
        context.fillStyle = "black"
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(125, 350, 450, 200, 30, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "silver");
        context.fillStyle = grd;
        context.fill();

}
//ring one
  var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /3.3;
        var centerY = canvas.height /2;
        var radius = 100;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 10;
        context.strokeStyle = "rgb(105,105,105)";
        context.stroke();
       
//ring two
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /2.4;
        var centerY = canvas.height /2;
        var radius = 100;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 10;
        context.strokeStyle = "rgb(105,105,105)";
        context.stroke();
       
//ring three       
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /1.9;
        var centerY = canvas.height /2;
        var radius = 100;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 10;
        context.strokeStyle = "rgb(105,105,105)";
        context.stroke();
       
// ring four       
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /1.556;
        var centerY = canvas.height /2;
        var radius = 100;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 10;
        context.strokeStyle = "rgb(105,105,105)";
        context.stroke();
       
// mini ring 1       
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /5.758;
        var centerY = canvas.height /1.9;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();
       
var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 2       
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /5.55;
        var centerY = canvas.height /2.5;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 3       
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /5.;
        var centerY = canvas.height /3.3;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 4       
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /4.2;
        var centerY = canvas.height /5;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 5       
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /3.28;
        var centerY = canvas.height /10;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 6       
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /2.5;
        var centerY = canvas.height /32;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 7       
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /2;
        var centerY = canvas.height /58;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 8       
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /1.67;
        var centerY = canvas.height /17.5;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 9       
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /1.485;
        var centerY = canvas.height /7.5;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 10       
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /1.374;
        var centerY = canvas.height /4.3;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 11   
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /1.307;
        var centerY = canvas.height /2.8;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 11   
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /1.307;
        var centerY = canvas.height /2.8;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 12   
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /1.285;
        var centerY = canvas.height /1.95;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 13   
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /1.315;
        var centerY = canvas.height /1.5;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 14   
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /1.40;
        var centerY = canvas.height /1.25;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 14   
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /1.57;
        var centerY = canvas.height /1.1;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 15
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /1.85;
        var centerY = canvas.height /1.027;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 16
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /2.4;
        var centerY = canvas.height /1.0255;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 16
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /3.2;
        var centerY = canvas.height /1.1;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 16
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /4.2;
        var centerY = canvas.height /1.25;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
       
// mini ring 17
 var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var centerX = canvas.width /5.2;
        var centerY = canvas.height /1.5;
        var radius = 8;

        context.beginPath();
        context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        context.lineWidth = 5;
        context.strokeStyle = "silver";
        context.fillStyle = "black";
        context.fill();
        context.stroke();

var grd = context.createRadialGradient(150, 300, 500, 200, 40, 0);
        // light blue
        grd.addColorStop(0, "black");
        // dark blue
        grd.addColorStop(1, "white");
        context.fillStyle = grd;
        context.fill();
//AUDI TEXT
var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");

context.font = "italic 100pt Coronet";
context.strokeStyle = "red";
context.fillStyle = "red";
context.fillText("Audi", 475, 700);
////////////////////////////////////// end above this line

};

</script>
</head>
<body>
<canvas id="myCanvas" width="1280" height="800"></canvas>
</body>
</html>

Tuesday, May 22, 2012

First Day








So yesterday was my first day of class, and so far I really like the class my classmates and my professor. However it did seem like there was quite a bit of stuff to take in for the first day using all different numbers to type. Hopefully there won't be too much more of that! I thought my head was about to explode!

















A little about myself
My name is Joey Marrone, and if I had to use three words to describe me they would be spontaneous, fun, and thrilling. I'm not the type of person that likes to sit at home and watch movies or be inside at all for that matter. I would much rather be out and about socializing with people I haven't met before or with my best friends. I love last minute road trips, and adventures! To give you an example of my last minute decisions, last weekend I woke up around 2 am on Friday and couldn't fall back asleep. So while I was laying there I was thinking about what I could do for the next day. I really wanted to go to the beach but I knew the weather wasn't going to be so great. So then I checked the weather for Miami, of course 85 and sunny. So I decided to go to Miami, but instead of waiting till morning I went to my roommates room and told her to get up because we are leaving for Miami in an hour so we will be there by morning. Stevie (my roommate) who is just as spontaneous as I am was all for it. So we packed our bags and left in the middle of the night got some redbull and drove to Miami. We stayed at my parents condo for 2 days on the beach and had one of the most exciting times in awhile!

I'm originally from Scranton, PA. Home of the show The Office. The town is basically as exciting as the show, and by that I mean its not. Some of my favorite things to do there were go to the lake, wake board, go offroading, and just hangout with friends maybe by a bonfire. I also really love Hockey. It's one of my favorite sports and its great that I'm in Tampa because I love going to the lightning games to watch them play!




















I have been in Tampa for two years now, and have met some awesome people along the way! My two best friends names are Liz and Marissa. I'm also in the fraternity Sigma Phi Epsilon and my brothers are some of the best people I've ever met.