Tuesday, September 24, 2013

Logo Critique

1. Nike- Nike's target audience are athletes of all ages and genders.  Therefore it makes sense for them to have a simple logo that doesn't just attract a certain gender.  Another good thing with there logo is that since it is simple it can be but on all of there products with it either being the focus point or it can be somewhat hidden.


2. Apple- One thing that really makes Apples logo so good is that it is very recognizable and there are no other logos really like it.  The thing that really makes the logo so recognizable is the bit out of it.  I believe that the target audience for Apple is the younger generation since they have been the ones that have grown up with the use of technology.


3. Target- Target's audience is family based since it is a place you can get things for all people of the family and all ages.  The reason that there logo is so successful is because they used an actual target as their logo making it easy for people to know what it represents.


4. Under Armour- Under Armour's target audience like Nike are athletes of all ages and genders. But, unlike Nike, Under Armour made their logo a little more complex and creativity.  The thing that makes there logo creative is how they use the initials of the company.



5. NBA- The target audience for the NBA is mainly males of all ages.  They use the colors red, white, and blue since those are the national colors and the NBA is a national organization.  Then it was smart of them to use an iconic hall of fame player as the outlined player in the logo.  


Sunday, September 22, 2013

Logo ideas for Project 2

Logos ideas

Triple R construction - This is a name of a construction company that my brother and father want to open in the future.

Overtime - This would be a sports bar/restaurant.

Sweetfeet- this would be a shoe company that focuses manly on athletic footwear such as basketball and running shoes and well as clears for all different sports.

R & C landscape - This is a landscaping company that my brother and his friend had for a short time.

Beer Garden - This is a restaurant/bar that I worked at back home.

Sunday, September 15, 2013

Project 1

I chose to make a picture about the beach since i go to school to Florida now and the beach is only 20 min away.  That is why i decided to make a picture of the beach on a nice day.  The way I mad this picture is by making the entire background a light blue like the sky.  Then I mad a rectangle on the bottom half and filled it in to make a it look like sand.  I then used the quadratic curves to create the water and make it look like the waves crashing on the shore.  Next I created the two clouds using the bezier curves and the the sun with the circle code.  The boat was then made using a semi circle, a line and triangle on top.  Then finally the towels on the bottom where made with rectangles and filling them with different colors.


<!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, canvas.width, canvas.height);

context.fillStyle = 'rgb(0, 137, 255)';

context.fill();

context.stroke();

//sand

context.beginPath();

context.rect(0, 450, canvas.width, canvas.height);

context.fillStyle = 'rgb(255, 255, 100)';

context.fill();

context.stroke();

//boat

context.beginPath();

context.arc(400, 300, 70, 0, Math.PI, false);

context.closePath();

context.lineWidth = 5;

context.fillStyle = 'red';

context.fill();

context.strokeStyle = 'rgb(85, 0, 0)';

context.stroke();

context.beginPath();

context.moveTo(400,300);

context.lineTo(400,230);

context.stroke();

context.beginPath();

context.moveTo(325,250);

context.lineTo(475,250);

context.lineTo(400,150);

context.closePath();

context.fillStyle = 'rgb(200, 150, 0)';

context.fill();

context.closePath();

//water

context.beginPath();

context.moveTo(0, 450);

context.quadraticCurveTo(100,600, 200, 450);

context.quadraticCurveTo(300,600, 400, 450);

context.quadraticCurveTo(500,600, 600, 450);

context.quadraticCurveTo(700,600, 800, 450);

context.lineTo(800, 350);

context.lineTo(0, 350);

context.lineTo(0, 450);

context.lineWidth = 5;

context.fillStyle = 'rgb(0, 0, 153)';

context.fill();

context.strokeStyle = 'rgb(0, 0, 102)';

context.stroke();

//cloud 1

context.beginPath();

context.moveTo(40, 80);

context.bezierCurveTo(0, 100, 0, 150, 100, 150);

context.bezierCurveTo(120, 180, 190, 180, 210, 150);

context.bezierCurveTo(290, 150, 290, 120, 260, 100);

context.bezierCurveTo(300, 40, 240, 30, 210, 50);

context.bezierCurveTo(200, 5, 120, 20, 120, 50);

context.bezierCurveTo(70, 5, 0, 20, 40, 80);

context.closePath();

context.fillStyle = 'rgb(224,224,224)';

context.fill();

context.lineWidth = 5;

context.strokeStyle = 'rgb(224, 224, 224)';

context.stroke();

//cloud 2

context.beginPath();

context.moveTo(570, 80);

context.bezierCurveTo(530, 100, 530, 150, 630, 150);

context.bezierCurveTo(650, 180, 720, 180, 740, 150);

context.bezierCurveTo(820, 150, 820, 120, 790, 100);

context.bezierCurveTo(830, 40, 770, 30, 740, 50);

context.bezierCurveTo(720, 5, 650, 20, 650, 50);

context.bezierCurveTo(600, 5, 550, 20, 570, 80);

context.closePath();

context.fillStyle = 'rgb(224,224,224)';

context.fill();

context.lineWidth = 5;

context.strokeStyle = 'rgb(224,224,224)';

context.stroke();

//sun

context.beginPath();

context.arc(50, 50, 50, 0, 2 * Math.PI, false);

context.fillStyle = 'yellow';

context.fill();

context.lineWidth = 5;

context.strokeStyle = 'yellow';

context.stroke();

//rays

context.beginPath();

context.moveTo(105,50);

context.lineTo(130,50);

context.lineWidth = 10;

context.strokeStyle = 'rgb(255, 200, 0)';

context.lineCap = 'round';

context.stroke();

context.beginPath();

context.moveTo(50,105);

context.lineTo(50,130);

context.lineWidth = 10;

context.strokeStyle = 'rgb(255, 200, 0)';

context.lineCap = 'round';

context.stroke();

context.beginPath();

context.moveTo(110,110);

context.lineTo(90,90);

context.lineWidth = 10;

context.strokeStyle = 'rgb(255, 200, 0)';

context.lineCap = 'round';

context.stroke();

context.beginPath();

context.moveTo(90,15);

context.lineTo(110,0);

context.lineWidth = 10;

context.strokeStyle = 'rgb(255, 200, 0)';

context.lineCap = 'round';

context.stroke();

context.beginPath();

context.moveTo(15,90);

context.lineTo(0,115);

context.lineWidth = 10;

context.strokeStyle = 'rgb(255, 200, 0)';

context.lineCap = 'round';

context.stroke();

//towel 1

context.beginPath();

context.moveTo(150,525);

context.lineTo(250,525);

context.lineTo(250,585);

context.lineTo(150,585);

context.lineTo(150,525);

context.fillStyle = 'blue'

context.fill();

context.closePath();

context.strokeStyle = 'red';

context.stroke();

//towel 2

context.beginPath();

context.moveTo(350,525);

context.lineTo(450,525);

context.lineTo(450,585);

context.lineTo(350,585);

context.lineTo(350,525);

context.fillStyle = 'rgb(0, 255, 255)';

context.fill();

context.closePath();

context.strokeStyle = 'rgb(0, 204, 204)';

context.stroke();

//towel 3

context.beginPath();

context.moveTo(550,525);

context.lineTo(650,525);

context.lineTo(650,585);

context.lineTo(550,585);

context.lineTo(550,525);

context.fillStyle = 'rgb(0, 255, 9)';

context.fill();

context.closePath();

context.strokeStyle = 'rgb(154, 204, 0)';

context.stroke();

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

};

</script>

</head>

<body>

<canvas id="myCanvas" width="800" height="600"></canvas>

</body>

</html>

Sunday, September 8, 2013

Heart Code

My laptop is not allowing me to save the actual picture but here is the code I used.



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

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

var x = 100;
var y = 90;
var endx = 200;
var endy = 215;
var endx1 = 310;
var endy1 = 100;
var endx2 = 200;
var endy2 = 80;
var endx3 = 100;
var endy3 = 90;
var controlx = 105;
var controly = 150;
var controlx1 = 290;
var controly1 = 150;
var controlx2 = 260;
var controly2 = 5;
var controlx3 = 140;
var controly3 = 5;



context.beginPath();
context.lineCap = "round";
context.lineWidth = 12;
context.strokeStyle = 'rgb(255, 100, 150)';
context.fillStyle = 'rgb(245, 10, 10)';
context.moveTo(x, y);
context.quadraticCurveTo(controlx, controly, endx, endy);
context.quadraticCurveTo(controlx1, controly1, endx1, endy1);
context.quadraticCurveTo(controlx2, controly2, endx2, endy2);
context.quadraticCurveTo(controlx3, controly3, endx3, endy3);
context.stroke();
context.fill();






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

};

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