Monday, September 30, 2013

RE-Post

I figured out the right way to post it, so I just reposted my caligramme project.

Sunday, September 29, 2013

Sun Caligramme


Today was a beautiful day at the beach and the sun was shining so bright that it inspired me for my caligramme project. I am not sure why the background shows up grey because on my computer it looks white. I wanted to come up with a more creative sun, rather than just a regular sun. I used various words and quotes to create the sun outline and the spirals going off of the sun.

Tuesday, September 24, 2013

Logo Critique


1. McDonalds




This logo's target audience would be for all ages, anyone who enjoys fast food. I think this logo is successful at grabbing the target audience because it is a nationally known logo. Whenever you are driving in the car looking for McDonalds all you have to do is look for the golden arches. Yellow and red are a good combination to catch customers attention because they are bright and stand out. 


2. Nike




This logo's target audience would be athletes or anyone who enjoys sports/working out. I think this logo is very simple, but it is so easily recognized by everyone around the world. I think the color black works because it is universal for both male and female. I think this logo works because it can be put on pretty much anything, due to it being simple. 


3. Twitter




This is a logo for twitter and its main target audience would be teens/ young adults/ social networkers. I think this logo is successful because it is kind of a play on words with the word tweet/twitter. The logo is a picture of a bird and when you post something on twitter it is called a tweet, which I think is a cute idea. I think the color blue goes with the logo because everything on Twitter is blue, which attracts a customer. 

4. Chili's



The target audience for this logo would be teens, young adults, and people up to their 40s. This logo is successful because anyone can tell that this company's name is Chili's because it has a red chili as their logo. The green and red work well together because they contrast one another, especially the stem being green off the red chili. 


5. Noodles



Old logo


New logo


I think when noodles went to redo their logo they wanted to go with a more direct approach and put noodles in their logo. I think the new logo is more successful because now people have a better understanding that it is a food place. The font looks better now because it is more playful like noodles are, rather than upper case letters.The color red works well because when people see the color red they are more attracted and would make them more likely to go eat there. 




Tuesday, September 17, 2013

Logo Ideas


1. KC cupcakes- This would be a cupcake store, that sells a wide variety of different cupcakes.

2. Fly Feet- This would be an athletic shoe company that sells running shoes, training shoes, and athletic apparel.

3. O’Hagan- This would be an Irish restaurant named after my grandparents.

4. Couture- This would be a high end jewelry line, for A-list celebrities. 

5. Four Eyes- This would be a glasses company for all ages.

Sunday, September 15, 2013

Project 1




When I first thought about what I wanted to do, I had no idea. I decided to go for an abstract image because it can really be anything you want it to be. I had a hard time getting the hang of HTML with all the different codes and numbers, but this image came out better than I expected. I think my piece is successful because I used a lot of different shapes and colors, I am very pleased with the way it turned out!



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

////////////////////////////////////// start below this line ˇˇˇˇˇˇˇˇˇˇ

//Rectangle Variables 
var x = 0;
var y = 0;
var width = canvas.width;
var height = canvas.height;

//Black Rectangle
context.beginPath();
context.rect(x, y, width, height);
context.fillStyle = 'black';
context.fill();
context.stroke();

context.beginPath();
context.rect(65,70,700,500);
context.lineWidth=10;
context. strokeStyle='rgb(100,200,100)';
context. stroke();

//bottom right pink rectangle 
context.beginPath();
context.rect(600, 500, 220, 120);
context.fillStyle = 'black';
context.fill();
context.lineWidth = 10;
context.strokeStyle = 'pink';
context.stroke();

//top right pink rectangle 
context.beginPath();
context.rect(600, -20, 220, 120);
context.fillStyle = 'black';
context.fill();
context.lineWidth = 10;
context.strokeStyle = 'pink';
context.stroke();

//top left pink rectangle 
context.beginPath();
context.rect(-20, -20, 220, 120);
context.fillStyle = 'black';
context.fill();
context.lineWidth = 10;
context.strokeStyle = 'pink';
context.stroke();

//bottom left pink rectangle 
context.beginPath();
context.rect(-20, 500, 220, 120);
context.fillStyle = 'black';
context.fill();
context.lineWidth = 10;
context.strokeStyle = 'pink';
context.stroke();



 ////Circles
context.beginPath();
context.arc(200,200,350,0,2 * Math.PI,false);
context.strokeStyle = 'rgba(155,155,255,.5)';
context.fillStyle = 'rgba(255,255,255,.5)';
context.fill();
context.stroke();

context.beginPath();
context.arc(650,440,250,0,2 * Math.PI,false);
context.strokeStyle = 'rgba(255,155,255,.7)';
context.fillStyle = 'rgba(255,255,255,.7)';
context.fill();
context.stroke();

context.beginPath();
context.arc(100,440,250,0,2 * Math.PI,false);
context.strokeStyle = 'rgba(155,255,155,.5)';
context.fillStyle = 'rgba(155,255,255,.5)';
context.fill();
context.stroke();

context.beginPath();
context.arc(800,100,450,0,2 * Math.PI,false);
context.strokeStyle = 'rgba(255,255,155,.2)';
context.fillStyle = 'rgba(255,255,255,.2)';
context.fill();
context.stroke();

context.beginPath();
context.arc(500,400,250,0,2 * Math.PI,false);
context.strokeStyle = 'rgba(224,124,0, .1)';
context.fillStyle = 'rgba(355,155,255, .1)';
context.fill();
context.stroke();



//Bezier Curve 1
for (var i=0; i<canvas.height; i+=10) {
var startX = 500;     
var startY = 1500;
// starting point coordinates
var endX = 900;    
var endY = i;
var cpoint1X = canvas.width;
var cpoint1Y = canvas.height;  
var cpoint2X = i;
var cpoint2Y = 200;
context.beginPath();
context.moveTo(startX, startY);  ///cpoint1Y
context.bezierCurveTo(cpoint1X, cpoint1Y , cpoint2X, cpoint2Y, endX, endY);
context.lineWidth = 1;
context.strokeStyle = "rgb(200,0,100)";
context.stroke();
}

//Bezier Curve 2
for (var i=0; i<canvas.height; i+=10) {
var startX = 800;     
var startY = 1500;
// starting point coordinates
var endX = 0;    
var endY = i;
var cpoint1X = canvas.width;
var cpoint1Y = canvas.height;  
var cpoint2X = i;
var cpoint2Y = 200;
context.beginPath();
context.moveTo(startX, startY);  ///cpoint1Y
context.bezierCurveTo(cpoint1X, cpoint1Y , cpoint2X, cpoint2Y, endX, endY);
context.lineWidth = 1;
context.strokeStyle = "rgb(200,0,100)";
context.stroke();
}



///////Bezier Curve 
////Bezier Curve 1
context.beginPath();
context.moveTo(100,0);
context.bezierCurveTo(300,100,600,600,800,300)
context.strokeStyle = 'white';
context.lineWidth = 5;
context.stroke();

//// Bezier Curve 2 arc
context.beginPath();
context.moveTo(0,200);
context.bezierCurveTo(300,100,600,600,800,300)
context.strokeStyle = 'black';
context.lineWidth = 5;
context.stroke();

//// Bezier Curve 3 
context.beginPath();
context.moveTo(0,300);
context.bezierCurveTo(300,100,600,600,800,300)
context.strokeStyle = 'white';
context.lineWidth = 5;
context.stroke();

///// Bezier Curve 4
context.beginPath();
context.moveTo(0,400);
context.bezierCurveTo(300,100,600,600,800,300)
context.strokeStyle = 'black';
context.lineWidth = 5;
context.stroke();

////Bezier Curve 5 
context.beginPath();
context.moveTo(0,500);
context.bezierCurveTo(300,100,600,600,800,300)
context.strokeStyle = 'white';
context.lineWidth = 5;
context.stroke();

 ////Bezier Curve 6
context.beginPath();
context.moveTo(0,600);
context.bezierCurveTo(300,100,600,600,800,300)
context.strokeStyle = 'black';
context.lineWidth = 5;
context.stroke();

/////// BEZIER CURVE 3
for (var i=0; i<canvas.height; i+=10) {
var startX = -2000;     
var startY = +3000;
// starting point coordinates
var endX = 50;    
var endY = -3000;
var cpoint1X = canvas.width;
var cpoint1Y = canvas.height;  
var cpoint2X = i;
var cpoint2Y = 400;
context.beginPath();
context.moveTo(startX, startY);  ///cpoint1Y
context.bezierCurveTo(cpoint1X, cpoint1Y , cpoint2X, cpoint2Y, endX, endY);
context.lineWidth = 1;
context.strokeStyle = "rgb(245, 52, 200)";
context.stroke();
}
for (var i=canvas.width/2; i<canvas.height; i+=30) {
var startX = 80;
var startY = -900;
var endX = 800;
var endY = i;
var r = 1;
var g = 2;
var b = 2;
context.beginPath();
context.strokeStyle = "aqua";
context.lineCap = 'round'; // "butt" "square"
context.lineWidth = i/150;
context.moveTo(startX, startY);
context.lineTo(endX, endY);
context.stroke();
}





 context.font = 'italic 40pt Calibri ';
 context.fillStyle = 'white';
 context.fillText('Life is a Crazy Journey', 200, 500);




////////////////////////////////////// end above this line ˆˆˆˆˆˆˆˆˆˆˆˆˆˆˆ

};

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





Thursday, September 5, 2013

Heart

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

////////////////////////////////////// start below this line ˇˇˇˇˇˇˇˇˇˇ


context.beginPath();
context.lineCap = "round";
context.lineWidth = 8;
context.strokeStyle = 'rgb(255, 0, 20)';
context.fillStyle = 'rgb(255, 0, 150)';
context.moveTo(100, 90);
context.quadraticCurveTo(105,150, 200, 215);
context.quadraticCurveTo(290, 150, 310, 100);
context.quadraticCurveTo(260, 5, 200, 80);
context.quadraticCurveTo(140, 5, 100, 90);
context.stroke();
context.fill();









////////////////////////////////////// end above this line ˆˆˆˆˆˆˆˆˆˆˆˆˆˆˆ

};

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