Tuesday, December 8, 2015

Animation Project: Places Dear 2 You

 
This project was very fun to make. The style of animation was I think called Pixilation. Basically it was a frame by frame animation with some other tweaks made in Photoshop. All of the frames were imported into Photoshop and then, since I had more than one shot, I put them all together in Sony Vegas 7. Other tweaks like the Paper with stock footage of both Virginia and Tampa were done in Vegas with masking and keyframing that mask. The music was created in Garageband and taken out of influence for inspiration from the song Still Suit Pt. C by Restiform Bodies. Overall I think the project turned out pretty good. I loved the process, even though it took about two weeks to complete. 





Just a fun little fact. I used to make animation videos like this a long time ago. A good example from 7 YEARS AGO!






Thursday, November 12, 2015

Resizing Project: Filters, Filters, Filters



So, this project was not my favorite. I felt like nothing really turned out well, but whatever. It was still a fun project.

Painting Project: Son of Man and American Gothi- whoa!

So, this project was surprisingly fun. I put myself into two paintings. The first one I did was The Son of Man painting.
So here is the original image. All I did was just put my face over the face of the man in the picture and then cropped out the apple and replaced it over my face.

This was the image i used to put into the painting.

The other painting didn't turn out as good, but it was still fun to make and it turned out really creepy! And that was one of the goals for the project.

So again, I used the same image above as the original image and then I just composited it into the painting.

Overall, I loved this project. It was really fun, and I got to really make myself look creepy.


Somewhere I've Never Been: The 4th Member of Nirvana???

So the idea for this project I had for a while. Pretty much I got the idea the moment the project was mentioned at the beginning of the semester. I love Nirvana, and I always wished I could have been alive to no only go to one of their concerts, but go to the special unplugged concert in New York that they had. Now if I was to put myself in this picture, might as well have me, instead being part of the audience, be part of the band.

The process for cutting me out of the original image wasn't that hard. I used the pen tool and just made a very complex mask around me and then retouched the image to make sure that I didn't have any of the background on me. After that, it was mainly just color correction and film grains. And Voila! Overall, the project was really fun.

Autoscopy: Eye of the Tiger

So this project was fun and I was really able to show what I didn't like about myself.
So here is the original image. I am very insecure about how skinny I am and how I don't have enough muscle/power. I fixed that with turning myself into a lion and fixing my biceps and such. I used the liquefy tool for the arms and then just used different tiger textures and just used layer masks. The abs were put in by composition and the face was done by much transformation and other adjustment layers. Overall, a fun project.


Retouch Project: I'm Green da ba dee da ba die

The retouch project was pretty fun. Just a quick little painless project that I liked doing. So the pose was an imitation of the famous pose made by Brad Pit in the movie Fight Club. Anyway. Coloring it was fun and it was a fun little project.

Thursday, October 29, 2015

Poster Assignment: Express Yourself

This project was probably the biggest fail I have ever done. Honestly I was very proud of it when i first did it, but obviously it just wasn't good enough. The typographic aspect was put into express my music. All of the lines are taken from different sub-genres of rock. I don't know. I really don't know what happened. I thought it was great, but it just wasn't.

Thursday, October 22, 2015

Mesh Project: Favorite Snack Food of All Time

The mesh project was definitely not my favorite project. Finding an image seemed to be harder than I thought and when i finally landed on the Cosmic Brownie, it just didn't turn out as I wanted to. However, I think it worked in someways. The sprinkles add a lot of color to the mesh and allow for the brownie to stand out more and honestly the 3D nature of the picture isn't that bad either. Overall, I just didn't really have a good time with this project, but it was still a good learning experience and fun to do.



Wednesday, October 14, 2015

Business Card/Logo Design Project: 5 Cards, 5 Professions

I thought this project was a lot of fun. When I was creating some of these cards, I thought to myself, "Wow, I could really use this one day" and I think that tells me that the logos and business cards work for me.

1. Sportsfan1100 Tutorials
So again, Sportsfan1100 is my YouTube account that I actually make money off of for the tutorials that I make regarding Graphics and Web. I wanted the front to be a very simple version of the logo with a more emphasis on the "1" that is shown in between the "S" and the "F". Like we talked in class with the FedEx logo, once it is evident, our mind can't get rid of it. Once I point this 1 out to people, it will immediately leave an effect on them. They will remember that this guy or this account is number one. The Back of the card is an explanation and I actually put the meaning behind what I am number 1 in and that is tutorials.  This one turned out alright now looking back at it.

2. Taylorstutorials.com
 Taylorstutorials.com like I said before is an actual website that was created by me only a few days ago. Its goal is to create a widespread coverage of tech tutorials mainly focusing on Graphics, Web, and Video Editing tutorials. It features only three channels as of right now, however, I hope to make it grow even larger. The front business card if you can't tell already are two T's, one normal and one upside down. It creates a window which represents a window of opportunity which I think is a great motivation for this website. The back of the business card, again has a little more explanation. The logo used on the back is actually the one that I will be using on my website and it is also currently being used on my forum.

3. Taylor's Tech Support
Taylor's Tech support was an idea that I had since this is a possible alternative for a job that I could go into. I love helping the technology impaired and this could be a great start. The front of this business card is very simple. The computer is actually supposed to be a T as well as a computer representing Taylor. The back of the business card is the same logo just bigger with the possible things that this company would fix such as computer bugs, viruses, and help in cybersecurity. I think this was a pretty good turn out especially on the front. The front could definitely be used on the website of this business.

4. Taylor's Swimming Lessons
I have been swimming almost all of my life. I have become pretty advanced at the sport and love to teach what I have learned to others. Taylor's Swimming Lessons is something that I could definitely use as a business. If I were ever to give lessons in the sport, I would definitely give this business card to people. It is simple and gets to the point. The front of the business card is very basic and I think that's what makes it stand out. You know what it is the instant you see it. The arm actually forms a T which was my goal. The back of the business card is also very similar and features the levels of lessons in a nice and easy water brush path. I think this one turned out really well.

5. EZ College Life
So this actually started out as EZ Graphics. A business where we would create logos and graphics for people. But because that shouldn't be done in the first place and that it wouldn't really be a success, I decided to change it. The idea for changing the business name actually sparked when I was drawing EZ on paper. If you look closely you can see a house in between the E and the Z. I decided to turn this into something else. That is where EZ College life came into play. Since being here at UT I have definitely been a little homesick. When my family came down for parents weekend, I didn't want them to leave. This sparked the business idea where the business could create an atmosphere for the college customer that made them feel at home. They would redesign their dorm room according to the needs of the customer. The front of the business card is just the logo. Just like the Sportsfan1100 business card, I would definitely emphasize the house so they would always see it when they looked at the business card. The back of the business card just has the logo again and a slogan that fits the logo perfectly. "We make you feel at home" not only fits the business plan, but also emphasizes that house in the letters. This business card definitely surprised me in a very good way.

All Logos
 Sketches of the original images can be found here










Tuesday, October 13, 2015

Logo Design Start: Converting to Digital

I started to convert some of these sketches into digital images. I used Photoshop for these since instead of Illustrator.

1. Sportsfan1100
     Sportsfan1100 is my YouTube account that I actually earn money off of from its content. I host Graphics and Web tutorials on this site and decided to work on a new logo for the channel. The "1" is something that I thought was very unique about the logo and I think it works well and is subtle enough.













2. Taylorstutorials.com
    Taylorstutorials.com was literally created a little more than a day ago. This project sparked a new beginning! Taylorstutorials focuses on creating a bigger and better tutorial community for users. Sportsfan1100 branches off of this website along with a lot of other channels.
The logo that I recreated was actually put on the forum of this website and I think it turned out pretty good. The best part about it is that it really works as a business card as well.


Logo Design Start: Brainstorming

Here is the start of the logo brainstorming process for me. I have sketched a few ideas down on paper.







Thursday, October 8, 2015

Caligraphy Assignment: Let The Lovin Take Hold

With the Calilgram assignment, I knew that since I was going to have to be adding a lot of text to a certain image, I decided to go with the Sublime logo with all of their lyrics, songs, and looks for the text. I love Sublime and have loved them for a very long time. I love all that they do and all of their songs and thought what better way to express that love with the Caligram project.


Tuesday, September 29, 2015

Final Canvas Project - Meet Some Friends Of Mine

After a long 6 hours and my first all nighter in college, I finally finished my final canvas. While this took a long time I learned a lot from it.

South Park plays constantly in my dorm on Comedy Central. It has grown on me so much that I have dedicated most of my art to it.

The final canvas idea sprung up after I created Kenny. I thought to myself "If I can make one character, why not make three more!" And that is exactly shat I did. Everything is code except for some of the background and some of the accessories including Stan's and Cartman's Balls on the top of their hat and Cartman's hands. Other than that, it's all code. Believe me! :)





Total Elapsed Time: Around 15 Hours
Difficulty: Hard!
Was it worth it? Hell Yeah


<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title> Meet Some Friends Of Mine </title>

<style type="text/css">
body,td,th {
font-family: Helvetica, Arial, sans-serif;
font-size: 12px;
color: #f58821;
}
body {
background-image:url(bgfinal.jpg);
background-repeat:no-repeat;

}
#myCanvas { border: rgb(102,0,255) medium dashed; }


</style>
</head>

<body>

<canvas id="myCanvas" width="900" height="550"></canvas>

<script>
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');

context.font = 'italic 20pt Calibri';
context.fillText('Meet Some Friends Of Mine', 20, 540);

////KENNY - KENNY - KENNY - KENNY - KENNY
////:::::::::::::::::::::::::::::::::::::
//
//Head
context.beginPath();
    var centerXKennyHead = canvas.width / 1.747;
      var centerYKennyHead = canvas.height / 1.63;
      var radiusHead = 72;

      context.beginPath();
      context.arc(centerXKennyHead, centerYKennyHead, radiusHead, 0, 2 * Math.PI, false);
      context.fillStyle = '#fd6013';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();

context.closePath();

//sweatshirt hoodie opening

    var centerXKennyHoodie = 38;
      var centerYKennyHoodie = 45;
      var radiusHoodie = 30;

      // save state
      context.save();

      // translate context
      context.translate(canvas.width / 2, canvas.height / 2);

      // scale context horizontally
      context.scale(1.7, 1.55);

      // draw circle which will be stretched into an oval
      context.beginPath();
      context.arc(centerXKennyHoodie, centerYKennyHoodie, radiusHoodie, 0, 2 * Math.PI, false);

      // restore to original state
      context.restore();

      // apply styling
      context.fillStyle = '#fd6013';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();
     
//Sweatshirt Inside

      var centerXKennyInside = 0;
      var centerYKennyInside = 0;
      var radiusKennyInside = 40;

    
      context.save();
      context.translate(canvas.width / 1.75, canvas.height / 1.61);
      context.scale(1.15, .99);
      context.beginPath();
      context.arc(centerXKennyInside, centerYKennyInside, radiusKennyInside, 0, 2 * Math.PI, false);

      // restore to original state
      context.restore();
     
           // apply styling
      context.fillStyle = '#724130';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();    



//Face
     
      context.beginPath();
      context.moveTo(515, 380);
      context.bezierCurveTo(510, 390, 588,340, 515, 300);
      context.bezierCurveTo(510, 308, 448,330, 516, 380);
      context.fillStyle="#fbd9b4";
      context.fill();
      context.lineWidth = 1;

      // line color
      context.strokeStyle = 'black';
      context.stroke();
     
     
//Left Eye

var centerXLeftEye = canvas.width / 1.815;
var centerYLeftEye = canvas.height / 1.63;


context.beginPath();
for (var i = 0.7 * Math.PI; i < 1.8 * Math.PI; i += 0.01 ) {
    xPos = centerXLeftEye - (18 * Math.sin(i)) * Math.sin(0.7 * Math.PI) + (22 * Math.cos(i)) * Math.cos(0.7 * Math.PI);
    yPos = centerYLeftEye + (22 * Math.cos(i)) * Math.sin(0.7 * Math.PI) + (18 * Math.sin(i)) * Math.cos(0.7 * Math.PI);

    if (i == 0) {
        context.moveTo(xPos, yPos);
    } else {
        context.lineTo(xPos, yPos);
    }
}
context.lineWidth = 2.5;
context.fillStyle="white";
context.strokeStyle = "#232323";
context.bezierCurveTo(475, 340, 490,320,493,319);
context.stroke();
context.fill();
context.closePath();

//Left Eye Pupil

      var centerXLeftEyePupil = canvas.width / 1.779;
      var centerYLeftEyePupil = canvas.height / 1.695;
      var radiusLeftEyePupil = 1.9;

      context.beginPath();
      context.arc(centerXLeftEyePupil, centerYLeftEyePupil, radiusLeftEyePupil, 0, 2 * Math.PI, false);
      context.fillStyle = 'black';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();




//Right Eye

var centerXRightEye = canvas.width / 1.69;
var centerYRightEye = canvas.height / 1.629;


context.beginPath();
for (var i = 0.1 * Math.PI; i < 1.4 * Math.PI; i += 0.01 ) {
    xPos = centerXRightEye - (18 * Math.sin(i)) * Math.sin(0.23 * Math.PI) + (22 * Math.cos(i)) * Math.cos(0.29 * Math.PI);
    yPos = centerYRightEye + (22 * Math.cos(i)) * Math.sin(0.23 * Math.PI) + (18 * Math.sin(i)) * Math.cos(0.23 * Math.PI);

    if (i == 0) {
        context.moveTo(xPos, yPos);
    } else {
        context.lineTo(xPos, yPos);
    }
}

context.fillStyle="white";

context.lineWidth = 2.5;
context.strokeStyle = "#232323";
context.bezierCurveTo(550, 340, 543,350,543,355);
context.stroke();
context.fill();
context.closePath();

     
 //Right Eye Pupil

      var centerXLeftEyePupil = canvas.width / 1.69;
      var centerYLeftEyePupil = canvas.height / 1.695;
      var radiusLeftEyePupil = 1.9;

      context.beginPath();
      context.arc(centerXLeftEyePupil, centerYLeftEyePupil, radiusLeftEyePupil, 0, 2 * Math.PI, false);
      context.fillStyle = 'black';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();
     
     
     

     
     
//String

      context.beginPath();
      context.moveTo(515, 380);
      context.bezierCurveTo(510, 410, 503,410,510, 400);
      context.bezierCurveTo(510, 390, 518,360, 520, 402);
      context.lineWidth = 1;
      context.strokeStyle="black";
      context.stroke();
      context.closePath();
     
     
//Torso

      context.beginPath();
      context.moveTo(465,390);
      context.bezierCurveTo(450, 410, 455,420, 459, 442);
      context.bezierCurveTo(460, 443, 466,440, 464, 439);
      context.bezierCurveTo(510, 450, 548,450, 565, 443);
      context.bezierCurveTo(582, 452, 588,430, 577, 427);
      context.bezierCurveTo(580, 425, 580,425, 565, 390);
      context.bezierCurveTo(525, 415, 505,420, 465, 390);
      context.lineWidth=1;
      context.fillStyle="#fd6013";
      context.fill();
      context.strokeStyle="black";
      context.stroke();
      context.closePath();    
     
//Legs
      context.beginPath();
      context.moveTo(470,455);
      context.lineTo(470,440);
      context.bezierCurveTo(550, 455, 565,440, 559, 444);
      context.lineTo(558,455);
      context.lineTo(470,455);
      //context.lineTo(400,400);
      context.fillStyle="#fd6013";
      context.fill();
      context.strokeStyle="black";
      context.stroke();
      context.closePath();
     
//Feet
      var centerXKennyFeet = 0;
      var centerYKennyFeet = 0;
      var radiusKennyFeet = 20;

      // save state
      context.save();

      // translate context
      context.translate(canvas.width / 1.75, canvas.height / 1.203);

      // scale context horizontally
      context.scale(2.5, .1);

      // draw circle which will be stretched into an oval
      context.beginPath();
      context.arc(centerXKennyFeet, centerYKennyFeet, radiusKennyFeet, 0, 2 * Math.PI, false);

      // restore to original state
      context.restore();

      // apply styling
      context.fillStyle = 'black';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();
     
//Right Thumb

      var centerXKennyRightThumb = canvas.width / 1.933;
      var centerYKennyRightThumb = canvas.height / 1.282;
      var radiusKennyRightThumb = 3.8;

      context.beginPath();
      context.arc(centerXKennyRightThumb, centerYKennyRightThumb, radiusKennyRightThumb, 0, 2 * Math.PI, false);
      context.fillStyle = 'green';
      //context.fill();
      context.lineWidth = 1;
      context.fillStyle="#724130";
      context.fill();
      context.strokeStyle = 'black';
      context.stroke();
      context.closePath();
     
//Right Hand Part 2
     
     
      var centerXRightHandKenny = canvas.width / 1.575;
      var centerYRightHandKenny = canvas.height / 1.265;
      var radiusRightHandKenny = 10;
      //context.translate(200,400);
      //context.rotate(Math.PI/10);
      context.beginPath();
      context.arc(centerXRightHandKenny, centerYRightHandKenny, radiusRightHandKenny, 0, 2 * Math.PI, false);
      context.fillStyle = '#724130';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = '#003300';
      context.stroke();    
     
//Left Thumb

      var centerXKennyLeftThumb = canvas.width / 1.6;
      var centerYKennyLeftThumb = canvas.height / 1.275;
      var radiusKennyLeftThumb = 3.8;

      context.beginPath();
      context.arc(centerXKennyLeftThumb, centerYKennyLeftThumb, radiusKennyLeftThumb, 0, 2 * Math.PI, false);
      context.fillStyle = '#724130';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();
      context.closePath();          

//Right Arm

      context.beginPath();
      context.moveTo(470,427);
      context.bezierCurveTo(460,445,475,420,470,420);
      context.stroke();
      context.closePath();

//Right Arm pt.2
      context.beginPath();
      context.moveTo(557,420);
      context.bezierCurveTo(560,415,560,430,560,430);
      context.stroke();
      context.closePath();
     

     
//Left Hand Part 2

context.beginPath();
      context.moveTo(458,422);
      //context.bezierCurveTo(460,445,476,420,455,422);
      context.bezierCurveTo(450,425,480,420,460,442);
      context.fill();
      context.stroke();
      context.closePath();
     
//Zipper
    context.beginPath();
    context.moveTo(515,410);
    context.lineTo(515,447);
    context.stroke();
    context.closePath();
//    
////KENNY END - KENNY END - KENNY END - KENNY END - KENNY END
////:::::::::::::::::::::::::::::::::::::::::::::::::::::::::
//
//
////STAN - STAN - STAN - STAN - STAN - STAN - STAN - STAN -STAN
////:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
       
//Head
//context.beginPath();
//    var centerXStanHead = canvas.width / 2.26;
//      var centerYStanHead = canvas.height / 1.63;
//      var radiusStanHead = 68;
//
//      context.beginPath();
//      context.arc(centerXStanHead, centerYStanHead, radiusStanHead, 0, 2 * Math.PI, false);
//      context.fillStyle = '#fd6013';
//      //context.fill();
//      context.lineWidth = 1;
//      context.strokeStyle = 'black';
//      context.stroke();
//      context.closePath();

//Hat Pt. 1
      context.beginPath();
      context.moveTo(332,315);
      context.bezierCurveTo(390,220,460,295,465,321);
      context.stroke();
      context.fillStyle="#5062a2";
      context.fill();
      context.closePath();


//Hat pt.2
      context.beginPath();
      context.moveTo(330,332);
      //context.bezierCurveTo(460,445,476,420,455,422);
      context.bezierCurveTo(400,315,470,335,465,335);
      context.bezierCurveTo(470,333,463,315,464,320);
      context.bezierCurveTo(470,333,463,296,332,316);
      context.bezierCurveTo(330,323,330,320,330,332);
      context.fillStyle="#d62144";
      context.fill();
      context.stroke();
      context.closePath();
     
   

     

     
     
//Ball

      var imageObj = new Image();

      imageObj.onload = function() {
        context.drawImage(imageObj, 366, 180);
      };
      imageObj.src="ball.png";
     
     
      //Pants
      context.beginPath();
      context.moveTo(348,448);
      context.lineTo(348,460);
      context.lineTo(442,463);
      context.lineTo(440,450);
      context.stroke();
      context.fillStyle="#5062a2";
      context.fill();
      context.closePath();
     
//Body
    //Sweatshirt
      context.beginPath();
      context.moveTo(349,387);
      context.bezierCurveTo(340,397,340,400,329,433);
      context.bezierCurveTo(340,432,340,430,349,433);
      context.bezierCurveTo(350,437,350,430,342,444);
      context.bezierCurveTo(340,450,420,460,443,448);
      context.bezierCurveTo(440,437,440,430,439,433);
      context.bezierCurveTo(430,437,450,420,456,433);
      context.bezierCurveTo(450,397,445,400,440,390);
      context.bezierCurveTo(400,422,360,400,349,386);
      context.stroke();
      context.fillStyle="#9d5f52";
      context.fill();
      context.closePath();
   
    //Sweatshirt pt.2
      context.beginPath();
      context.moveTo(442,393);
      context.bezierCurveTo(400,435,355,400,351,389);
      context.stroke();
      context.fillStyle="d72245";
      context.fill();
      context.closePath();
     
      //Face - Had to be moved down for layering issues
      context.beginPath();
      context.moveTo(330,332);
      context.bezierCurveTo(340,457,480,400,465,335);
      context.bezierCurveTo(400,320,400,322,330,332);
      context.stroke();
      context.fillStyle="#fbd9b4";
      context.fill();
      context.closePath();
     
      //Right Eye


var centerXStanRightEye = canvas.width / 2.38;
var centerYStanRightEye = canvas.height / 1.589;

      context.beginPath();
for (var i = 0 * Math.PI; i < 2 * Math.PI; i += 0.01 ) {
    xPos = centerXStanRightEye - (18 * Math.sin(i)) * Math.sin(0.71 * Math.PI) + (20 * Math.cos(i)) * Math.cos(0.71 * Math.PI);
    yPos = centerYStanRightEye + (22 * Math.cos(i)) * Math.sin(0.71 * Math.PI) + (17 * Math.sin(i)) * Math.cos(0.71 * Math.PI);

    if (i == 0) {
        context.moveTo(xPos, yPos);
    } else {
        context.lineTo(xPos, yPos);
    }
}

context.lineWidth = 2.5;
context.strokeStyle = "#232323";
context.stroke();
context.fillStyle="white";
context.fill();
context.closePath();







//Left Eye
var centerXStanLeftEye = canvas.width / 2.16;
var centerYStanLeftEye = canvas.height / 1.585;

context.beginPath();
for (var i = 0 * Math.PI; i < 2 * Math.PI; i += 0.01 ) {
    xPos = centerXStanLeftEye - (17 * Math.sin(i)) * Math.sin(1.27 * Math.PI) + (22 * Math.cos(i)) * Math.cos(1.27 * Math.PI);
    yPos = centerYStanLeftEye + (20 * Math.cos(i)) * Math.sin(1.27 * Math.PI) + (19 * Math.sin(i)) * Math.cos(1.27 * Math.PI);

    if (i == 0) {
        context.moveTo(xPos, yPos);
    } else {
        context.lineTo(xPos, yPos);
    }
}
context.lineWidth = 2.5;
context.strokeStyle = "#232323";
context.stroke();
context.fillStyle="white";
context.fill();
context.closePath();
     

//Left Eye Pupil

      var centerXStanLeftEyePupil = canvas.width / 2.33;
      var centerYStanLeftEyePupil = canvas.height / 1.585;
      var radiusStanLeftEyePupil = 1.9;

      context.beginPath();
      context.arc(centerXStanLeftEyePupil, centerYStanLeftEyePupil, radiusStanLeftEyePupil, 0, 2 * Math.PI, false);
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();    
      context.fillStyle = 'black';
      context.fill();
     
      //Right Eye Pupil

      var centerXStanRightEyePupil = canvas.width / 2.2;
      var centerYStanRightEyePupil = canvas.height / 1.58;
      var radiusStanRightEyePupil = 1.9;

      context.beginPath();
      context.arc(centerXStanRightEyePupil, centerYStanRightEyePupil, radiusStanRightEyePupil, 0, 2 * Math.PI, false);
      context.fillStyle = 'black';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();
     
//Mouth
     
      context.beginPath();
      context.moveTo(387,386);
      context.bezierCurveTo(380,385,400,395,406,387);
      context.stroke();
      context.closePath();

     
     
    //Sweatshirt Pt.3 - Right Arm
      context.beginPath();
      context.moveTo(353,415);
      context.bezierCurveTo(350,417,350,420,348,430);
      context.stroke();
      context.closePath();
     
    //Sweatshirt Pt.4 - Left Arm
      context.beginPath();
      context.moveTo(435,416);
      context.bezierCurveTo(430,417,440,420,438,432);
      context.stroke();
      context.closePath();
    //Sweatshirt Pt.5 - Zipper
      context.beginPath();
      context.moveTo(393,454);
      context.lineTo(395,414)
      context.stroke();
      context.closePath();
   
    //Button 1
      var centerXStanButtonOne = canvas.width / 2.315;
      var centerYStanButtonOne = canvas.height / 1.32;
      var radiusStanButtonOne = 1.5;

      context.beginPath();
      context.arc(centerXStanButtonOne, centerYStanButtonOne, radiusStanButtonOne, 0, 2 * Math.PI, false);
      context.fillStyle = 'blue';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();  
     //Button 2
      var centerXStanButtonTwo = canvas.width / 2.315;
      var centerYStanButtonTwo = canvas.height / 1.275;
      var radiusStanButtonTwo = 1.5;

      context.beginPath();
      context.arc(centerXStanButtonTwo, centerYStanButtonTwo, radiusStanButtonTwo, 0, 2 * Math.PI, false);
      context.fillStyle = 'blue';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();  
     //Button 3
      var centerXStanButtonThree = canvas.width / 2.316;
      var centerYStanButtonThree = canvas.height / 1.234;
      var radiusStanButtonThree = 1.5;

      context.beginPath();
      context.arc(centerXStanButtonThree, centerYStanButtonThree, radiusStanButtonThree, 0, 2 * Math.PI, false);
      context.fillStyle = 'blue';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();  
     
     
//Feet

var centerXStanFeet = canvas.width / 2.29;
var centerYStanFeet = canvas.height / 1.186;
     
      context.beginPath();
for (var i = 0 * Math.PI; i < 2 * Math.PI; i += 0.01 ) {
    xPos = centerXStanFeet - (10 * Math.sin(i)) * Math.sin(1 * Math.PI) + (56 * Math.cos(i)) * Math.cos(1 * Math.PI);
    yPos = centerYStanFeet + (56 * Math.cos(i)) * Math.sin(1 * Math.PI) + (2 * Math.sin(i)) * Math.cos(1 * Math.PI);

    if (i == 0) {
        context.moveTo(xPos, yPos);
    } else {
        context.lineTo(xPos, yPos);
    }
}
context.lineWidth = 2;
context.strokeStyle = "black";
context.stroke();
context.fillStyle="black";
context.fill();
context.closePath();


//Hands - Right Hand
      var centerXStanRightHand = canvas.width / 2.65;
      var centerYStanRightHand = canvas.height / 1.267;
      var radiusStanRightHand = 10;

      context.beginPath();
      context.arc(centerXStanRightHand, centerYStanRightHand, radiusStanRightHand, 0, 2 * Math.PI, false);
      context.fillStyle = '#d62144';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();  
//Hands - Right Thumb
      var centerXStanRightThumb = canvas.width / 2.58;
      var centerYStanRightThumb = canvas.height / 1.277;
      var radiusStanRightThumb = 4;

      context.beginPath();
      context.arc(centerXStanRightThumb, centerYStanRightThumb, radiusStanRightThumb, 0, 2 * Math.PI, false);
      context.fillStyle = '#d62144';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();    
     
//Hands - Left Hand
      var centerXStanLeftHand = canvas.width / 2.01;
      var centerYStanLeftHand = canvas.height / 1.255;
      var radiusStanLeftHand = 10;

      context.beginPath();
      context.arc(centerXStanLeftHand, centerYStanLeftHand, radiusStanLeftHand, 0, 2 * Math.PI, false);
      context.fillStyle = '#d62144';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();    
//Hands - Left Thumb 
      //Hands - Left Hand
      var centerXStanLeftThumb = canvas.width / 2.055;
      var centerYStanLeftThumb = canvas.height / 1.267;
      var radiusStanLeftThumb = 4;

      context.beginPath();
      context.arc(centerXStanLeftThumb, centerYStanLeftThumb, radiusStanLeftThumb, 0, 2 * Math.PI, false);
      context.fillStyle = '#d62144';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();    
////STAN - END - STAN - END - STAN - END - STAN - END - STAN - END
//::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

//CARTMAN - CARTMAN - CARTMAN - CARTMAN - CARTMAN - CARTMAN
//:::::::::::::::::::::::::::::::::::::::::::::::::::::::::
//Pants
    context.beginPath();
    context.moveTo(40,421);
    context.lineTo(45,444);
    context.lineTo(210,445);
    context.lineTo(210,350);
    context.stroke();
    context.fillStyle="#724130";
    context.fill();
    context.closePath();
//Body
    context.beginPath();
    context.moveTo(50, 347);
    context.bezierCurveTo(20,355,20,400,40,422);
    context.bezierCurveTo(100,455,150,430,165,428);
    context.bezierCurveTo(180,425,220,430,220,430);
    context.lineTo(220,350);
    context.stroke();
    context.fillStyle="#d41f40";
    context.fill();
    context.closePath();

//Head

var centerXEricHead = canvas.width / 7.19;
var centerYEricHead = canvas.height / 1.686;

context.beginPath();
for (var i = 0 * Math.PI; i < 2 * Math.PI; i += 0.01 ) {
    xPos = centerXEricHead - (58 * Math.sin(i)) * Math.sin(1 * Math.PI) + (79 * Math.cos(i)) * Math.cos(1 * Math.PI);
    yPos = centerYEricHead + (79 * Math.cos(i)) * Math.sin(1 * Math.PI) + (58 * Math.sin(i)) * Math.cos(1 * Math.PI);

    if (i == 0) {
        context.moveTo(xPos, yPos);
    } else {
        context.lineTo(xPos, yPos);
    }
}
context.lineWidth = 1;
context.strokeStyle = "#232323";
context.stroke();
context.fillStyle="#fbd9b4";
context.fill();
context.closePath();

//Hat Pt. 1
context.beginPath();
context.moveTo(47,316);
context.bezierCurveTo(100,290,150,290,205,308);
context.bezierCurveTo(150,210,40,280,46,315);
context.stroke();
context.fillStyle="#4bb3bc";
context.fill();
context.closePath();

//Hat Pt. 2
context.beginPath();
context.moveTo(47,316);
context.bezierCurveTo(100,290,150,290,205,308);
context.lineWidth=5;
context.strokeStyle="yellow";
context.stroke();
context.closePath();

//ball
var imageObjEric = new Image();

      imageObjEric.onload = function() {
        context.drawImage(imageObjEric, 85, 191);
      };
      imageObjEric.src="ball2.png";
     
//Eyes
context.beginPath();
context.moveTo(85,336);
context.lineTo(165,307);
context.lineWidth=1;
context.strokeStyle="black";
context.stroke();
context.closePath();

context.beginPath();
context.moveTo(97,310);
context.lineTo(165,337);
context.strokeStyle="black";
context.stroke();
context.closePath();

//Mouth
var imageObjEricMouth = new Image();

      imageObjEricMouth.onload = function() {
        context.drawImage(imageObjEricMouth, 105, 295);
      };
      imageObjEricMouth.src="mouth2.png";

//Chin
    context.beginPath();
    context.moveTo(115,370);
    context.bezierCurveTo(110,370,140,375,140,370);
    context.stroke();
    context.closePath();
   
//Double Chin
    context.beginPath();
    context.moveTo(190,350);
    context.bezierCurveTo(140,390,105,385,65,355);
    context.stroke();
    context.closePath();
   

   
//Feet - Right Foot

var centerXEricRightFoot = canvas.width / 11;
var centerYEricRightFoot = canvas.height / 1.24;
     
      context.beginPath();
for (var i = 0 * Math.PI; i < 2 * Math.PI; i += 0.01 ) {
    xPos = centerXEricRightFoot - (10 * Math.sin(i)) * Math.sin(1 * Math.PI) + (40 * Math.cos(i)) * Math.cos(1 * Math.PI);
    yPos = centerYEricRightFoot + (40 * Math.cos(i)) * Math.sin(1 * Math.PI) + (2 * Math.sin(i)) * Math.cos(1 * Math.PI);

    if (i == 0) {
        context.moveTo(xPos, yPos);
    } else {
        context.lineTo(xPos, yPos);
    }
}
context.lineWidth = 2;
context.strokeStyle = "black";
context.stroke();
context.fillStyle="black";
context.fill();
context.closePath();

//Feet - Left Foot

var centerXEricLeftFoot = canvas.width / 5;
var centerYEricLeftFoot = canvas.height / 1.24;
     
      context.beginPath();
for (var i = 0 * Math.PI; i < 2 * Math.PI; i += 0.01 ) {
    xPos = centerXEricLeftFoot - (10 * Math.sin(i)) * Math.sin(1 * Math.PI) + (40 * Math.cos(i)) * Math.cos(1 * Math.PI);
    yPos = centerYEricLeftFoot + (40 * Math.cos(i)) * Math.sin(1 * Math.PI) + (2 * Math.sin(i)) * Math.cos(1 * Math.PI);

    if (i == 0) {
        context.moveTo(xPos, yPos);
    } else {
        context.lineTo(xPos, yPos);
    }
}
context.lineWidth = 2;
context.strokeStyle = "black";
context.stroke();
context.fillStyle="black";
context.fill();
context.closePath();

//Hands - Right Hand

var imageObjEricRightHand = new Image();

      imageObjEricRightHand.onload = function() {
        context.drawImage(imageObjEricRightHand, 10, 322);
      };
      imageObjEricRightHand.src="RightHandCartman.png";
     


//Zipper
    context.beginPath();
    context.moveTo(131,436);
    context.lineTo(134,384);
    context.stroke();
    context.closePath();
   

   





//KYLE - KYLE - KYLE - KYLE - KYLE - KYLE - KYLE - KYLE - KYLE
//::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

//Pants

      context.beginPath();
      context.rect(216, 445, 90, 20);
      context.fillStyle ="#2f4f4c";
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();




//Body - Sweatshirt Pt. 2
          context.beginPath();
          context.moveTo(215,387);
          context.bezierCurveTo(210,390,200,400,195,430);
          context.lineTo(210,430);
          context.lineTo(205,445);
          context.bezierCurveTo(220,460,300,460,310,452);
          context.lineTo(310,435);
          context.lineTo(325,435);
          context.bezierCurveTo(320,420,320,400,310,390);
          context.stroke();
          context.fillStyle="#fe6110";
          context.fill();
          context.closePath();
//Pocket 1        
               context.beginPath();
      context.rect(230, 416, 20, 20);
      //context.moveTo(200,300);
      context.lineTo(240,425);
      context.lineTo(250,415);
      context.fillStyle ="#2f4f4c";
      //context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();
//Pocket 2
           context.beginPath();
      context.rect(273,416, 20, 20);
      //context.moveTo(200,300);
      context.lineTo(283,427);
      context.lineTo(294,415);
      context.fillStyle ="#2f4f4c";
      //context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();

//Body - Sweatshirt Pt. 1
var centerXKyleScarf = canvas.width / 3.45;
var centerYKyleScarf = canvas.height / 1.50;
context.beginPath();
for (var i = 0 * Math.PI; i < 2 * Math.PI; i += 0.01 ) {
    xPos = centerXKyleScarf - (43 * Math.sin(i)) * Math.sin(1.02 * Math.PI) + (55 * Math.cos(i)) * Math.cos(1.02 * Math.PI);
    yPos = centerYKyleScarf + (55 * Math.cos(i)) * Math.sin(1.02 * Math.PI) + (43 * Math.sin(i)) * Math.cos(1.02 * Math.PI);

    if (i == 0) {
        context.moveTo(xPos, yPos);
    } else {
        context.lineTo(xPos, yPos);
    }
}
context.lineWidth = 1;
context.strokeStyle = "#232323";
context.stroke();
context.fillStyle="#229a38";
context.fill();
context.closePath();

//Head
var centerXKyleHead = canvas.width / 3.45;
var centerYKyleHead = canvas.height / 1.59;

context.beginPath();
for (var i = 0 * Math.PI; i < 2 * Math.PI; i += 0.01 ) {
    xPos = centerXKyleHead - (57 * Math.sin(i)) * Math.sin(0 * Math.PI) + (67 * Math.cos(i)) * Math.cos(0 * Math.PI);
    yPos = centerYKyleHead + (67 * Math.cos(i)) * Math.sin(0 * Math.PI) + (57 * Math.sin(i)) * Math.cos(0 * Math.PI);

    if (i == 0) {
        context.moveTo(xPos, yPos);
    } else {
        context.lineTo(xPos, yPos);
    }
}
context.lineWidth = 1;
context.strokeStyle = "#232323";
context.fillStyle="#fbd9b4";
context.fill();
context.stroke();
context.closePath();

//Hat Pt. 1

      var rectWidth = 130;
      var rectHeight = 59;
      var rectX = 190;
      var rectY = 193;
      var cornerRadius = 10;
     
     
            // translate context to center of canvas
      context.translate(50 / 2, 100 / 2);

      // rotate 45 degrees clockwise
      context.rotate(Math.PI / 55);

      context.beginPath();
      context.moveTo(rectX, rectY);
      context.lineTo(rectX + rectWidth - cornerRadius, rectY);
      context.arcTo(rectX + rectWidth, rectY, rectX + rectWidth, rectY + cornerRadius, cornerRadius);
      context.lineTo(rectX + rectWidth, rectY + rectHeight);
      context.lineTo(185,245);
      context.lineTo(185,205);
      context.bezierCurveTo(185,195,190,195,195,193);
      context.lineWidth = 1;
      context.fillStyle="#57c426";
      context.fill();
      context.stroke();
     
//Hat Pt. 2
      context.beginPath()
      context.moveTo(310,217);
      context.lineTo(195,218);
      context.lineTo(195,259);
      context.bezierCurveTo(220,247,290,250,312,255);
      context.lineTo(310,217);
      context.stroke();
      context.fillStyle="#229a38";
      context.fill();
      context.closePath();
//Hat Pt. 3

var centerXKyleHat = canvas.width / 2.78;
var centerYKyleHat = canvas.height / 2;

context.beginPath();
for (var i = 0 * Math.PI; i < 2 * Math.PI; i += 0.01 ) {
    xPos = centerXKyleHat - (10 * Math.sin(i)) * Math.sin(1.27 * Math.PI) + (22 * Math.cos(i)) * Math.cos(1.27 * Math.PI);
    yPos = centerYKyleHat + (38 * Math.cos(i)) * Math.sin(1.27 * Math.PI) + (19 * Math.sin(i)) * Math.cos(1.27 * Math.PI);

    if (i == 0) {
        context.moveTo(xPos, yPos);
    } else {
        context.lineTo(xPos, yPos);
    }
}
context.lineWidth = 1;
context.strokeStyle = "#232323";
context.stroke();
context.fillStyle="#57c426";
context.fill();
context.closePath();

//Hat Pt. 4

var centerXKyleHat = canvas.width / 4.9;
var centerYKyleHat = canvas.height / 2;

context.beginPath();
for (var i = 0 * Math.PI; i < 2 * Math.PI; i += 0.01 ) {
    xPos = centerXKyleHat - (10 * Math.sin(i)) * Math.sin(.68 * Math.PI) + (22 * Math.cos(i)) * Math.cos(.68 * Math.PI);
    yPos = centerYKyleHat + (36 * Math.cos(i)) * Math.sin(.68 * Math.PI) + (19 * Math.sin(i)) * Math.cos(.68 * Math.PI);

    if (i == 0) {
        context.moveTo(xPos, yPos);
    } else {
        context.lineTo(xPos, yPos);
    }
}
context.lineWidth = 1;
context.strokeStyle = "#232323";
context.stroke();
context.fillStyle="#57c426";
context.fill();
context.closePath();

//Right Eye

var centerXKyleRightEye = canvas.width / 3.88;
var centerYKyleRightEye = canvas.height / 2;

context.beginPath();
for (var i = 0 * Math.PI; i < 2 * Math.PI; i += 0.01 ) {
    xPos = centerXKyleRightEye - (19 * Math.sin(i)) * Math.sin(0.7 * Math.PI) + (23 * Math.cos(i)) * Math.cos(0.7 * Math.PI);
    yPos = centerYKyleRightEye + (23 * Math.cos(i)) * Math.sin(0.7 * Math.PI) + (19 * Math.sin(i)) * Math.cos(0.7 * Math.PI);

    if (i == 0) {
        context.moveTo(xPos, yPos);
    } else {
        context.lineTo(xPos, yPos);
    }
}
context.lineWidth = 2.5;
context.strokeStyle = "#232323";
context.stroke();
context.fillStyle="white";
context.fill();
context.closePath();  

      //Right Eye Pupil

      var centerXKyleRightEyePupil = canvas.width / 3.74;
      var centerYKyleRightEyePupil = canvas.height / 1.99;
      var radiusKyleRightEyePupil = 1.9;

      context.beginPath();
      context.arc(centerXKyleRightEyePupil, centerYKyleRightEyePupil, radiusKyleRightEyePupil, 0, 2 * Math.PI, false);
      context.fillStyle = 'black';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke(); 

//Left Eye

var centerXKyleLeftEye = canvas.width / 3.28;
var centerYKyleLeftEye = canvas.height / 2;

context.beginPath();
for (var i = 0 * Math.PI; i < 2 * Math.PI; i += 0.01 ) {
    xPos = centerXKyleLeftEye - (19 * Math.sin(i)) * Math.sin(1.2 * Math.PI) + (23 * Math.cos(i)) * Math.cos(1.2 * Math.PI);
    yPos = centerYKyleLeftEye + (23 * Math.cos(i)) * Math.sin(1.2 * Math.PI) + (19 * Math.sin(i)) * Math.cos(1.2 * Math.PI);

    if (i == 0) {
        context.moveTo(xPos, yPos);
    } else {
        context.lineTo(xPos, yPos);
    }
}
context.lineWidth = 2.5;
context.strokeStyle = "#232323";
context.stroke();
context.fillStyle="white";
context.fill();
context.closePath();  

//Left Eye Pupil

      var centerXKyleLeftEyePupil = canvas.width / 3.4;
      var centerYKyleLeftEyePupil = canvas.height / 1.995;
      var radiusKyleLeftEyePupil = 1.9;

      context.beginPath();
      context.arc(centerXKyleLeftEyePupil, centerYKyleLeftEyePupil, radiusKyleLeftEyePupil, 0, 2 * Math.PI, false);
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();    
      context.fillStyle = 'black';
      context.fill(); 

//Mouth

var imageObjKyle = new Image();

      imageObjKyle.onload = function() {
        context.drawImage(imageObjKyle, 245, 313);
      };
      imageObjKyle.src="mouthkyle.png";

//Hands - Right Hand
      var centerXKyleRightHand = canvas.width / 4.5;
      var centerYKyleRightHand = canvas.height / 1.457;
      var radiusKyleRightHand = 11;

      context.beginPath();
      context.arc(centerXKyleRightHand, centerYKyleRightHand, radiusKyleRightHand, 0, 2 * Math.PI, false);
      context.fillStyle = '#57c526';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();      

//Hands - Left Hand
      var centerXKyleLeftHand = canvas.width / 2.86;
      var centerYKyleLeftHand = canvas.height / 1.46;
      var radiusKyleLeftHand = 11;

      context.beginPath();
      context.arc(centerXKyleLeftHand, centerYKyleLeftHand, radiusKyleLeftHand, 0, 2 * Math.PI, false);
      context.fillStyle = '#57c526';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();  

//Hands - Right Thumb 
      var centerXKyleRightThumb = canvas.width / 4.3;
      var centerYKyleRightThumb = canvas.height / 1.477;
      var radiusKyleRightThumb = 4;

      context.beginPath();
      context.arc(centerXKyleRightThumb, centerYKyleRightThumb, radiusKyleRightThumb, 0, 2 * Math.PI, false);
      context.fillStyle = '#57c526';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();
     
//Hands - Left Thumb 
      //Hands - Left Hand
      var centerXKyleLeftThumb = canvas.width / 2.955;
      var centerYKyleLeftThumb = canvas.height / 1.47;
      var radiusKyleLeftThumb = 4;

      context.beginPath();
      context.arc(centerXKyleLeftThumb, centerYKyleLeftThumb, radiusKyleLeftThumb, 0, 2 * Math.PI, false);
      context.fillStyle = '#57c526';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();

//Feet

var centerXKyleFeet = canvas.width / 3.46;
var centerYKyleFeet = canvas.height / 1.37;
     
      context.beginPath();
for (var i = 0 * Math.PI; i < 2 * Math.PI; i += 0.01 ) {
    xPos = centerXKyleFeet - (10 * Math.sin(i)) * Math.sin(.99 * Math.PI) + (56 * Math.cos(i)) * Math.cos(.99 * Math.PI);
    yPos = centerYKyleFeet + (56 * Math.cos(i)) * Math.sin(.99 * Math.PI) + (2 * Math.sin(i)) * Math.cos(.99 * Math.PI);

    if (i == 0) {
        context.moveTo(xPos, yPos);
    } else {
        context.lineTo(xPos, yPos);
    }
}
context.lineWidth = 2;
context.strokeStyle = "black";
context.stroke();
context.fillStyle="black";
context.fill();
context.closePath();  

//Zipper
context.beginPath();
context.moveTo(260,394);
context.lineTo(257,347);
context.lineWidth="1";
context.stroke();
context.closePath(); 
   
//KYLE - END - KYLE - END - KYLE - END - KYLE - END - KYLE
//::::::::::::::::::::::::::::::::::::::::::::::::::::::::::


//// <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< END HERE

</script>
</body>
</html>









Saturday, September 12, 2015

Working on Canvas Designs with HTML5 - Creating Kenny McCormick

Working with html5 canvas in class got me working on some ideas for designs. One of the biggest ones was creating Kenny McCormick from South Park. This idea sparked when we started to use arcs in class. Code was implemented so that there was a "circle" (two arcs put together) inside a "circle". This sparked the idea for Kenny. 


After the idea sparked, I got to work and created Kenny!


Total Elapsed Time: Around 2 Days


Things I found hard about this design: OVALS!!!!! It seems so much easier than they actually are. Getting one oval is easy, but replicating that oval to the other side was a little difficult. The key factor in this is not any methods such as rotate or mirror (although I am sure that they work, I just don't know how to the full extent), but the scale method. This simple method allowed me to basically scale each oval and flip it over an axis from one point to another virtually flipping the oval.

Think of it like this

















Wednesday, August 26, 2015

My Name Is Taylor

Hi, my name is Taylor Whitesel. I attended West Springfield High School and will be swimming for the Spartans.

I chose this field because I love everything that it has to offer. I love creating things that are unique from everyone else and making nothing into something. I am a very visual learner and I think that is partially the reason I like graphic design and things related to it. I do however like coding (which in my opinion is not very visual:) ). I have taken classes and watched videos on many different types of coding and html is definitely my favorite. I really hope we do and create things that are related into that field. I love creating websites as well. I love making things work and function on all of my website creations. I actually used dreamweaver before I used photoshop, but since photoshop allows you to create incredible templates, photoshop was no stranger to my computer. Messing around with it over the past few years made me realize how much i truly love it. It's so cool to think of all the capabilities that one program can do. I mean, literally billions of different design choices and edits can be made with this program and I wish I could learn all of them. I love learning new things with different types of software and then trying to teach it to others. Since the rest of my family doesn't really like the things that I do, I recently decided to post tutorial videos on YouTube regarding many different types of programs ranging from website and photo editors such as Dreamweaver, Photoshop, and Fireworks to video editing programs such as Sony Vegas and After affects. It's cool to see the videos grow and me actually being able to make money from them via google adsense. This was the first taste of me getting paid for something that I love doing. That's what I really want out of this major. Aside from the many opportunities I will get and the many abilities and features that I will learn, the idea to have a job that one loves and is willing to wake up every morning to do is something that I truly long for.

My name is Taylor and I can not wait to start a new adventure here at the University of Tampa.