Feather!

Logo Sketches

Logos and more Logos!

Business Ideas!

1. "Happy Hounds" Doggy Daycare

My top dream job as a child was to run a dog daycare service. I imagined people dropping off their dogs and the facility would have a playground, lots of toys, a pool...pretty much a dog paradise. And I'd get to play with dogs all day!

2. "Earth-1" Comic Book Shop/Arcade

So, I grew up on comic books. And I spend a lot of my childhood in comic stores tagging along with my dad. My other childhood hang out was arcades. 

3. "Tippy Toes": Dance Store

Dance store geared towards girls doing ballet. I work at a dance store currently, so it'd be a fun place to make. Cute and pink everywhere.

4. "Rise Above": Record Store

Mainly punk and metal record store. Records only, not CDs. I love record shops, and though a dying art, there is a definite target market.

(Rise Above is a Black Flag song). 

5. "Alter Ego":Vintage Thrift Store

When I lived in NYC, there was a store down the street from my apartment that was a thrift store, minus the thrift store prices. They sold mainly vintage rock tshirts and old doc martens, and blared metal music. It was awesome and I think I'd love to own a place like that.

I am OBSESSED with logos. I love looking at them. They are my second love after typography. There is just something about a clean logo, and how powerful logos are, that makes them really interesting to study.

That being said, here's some logos!



1.

Love this logo. Not many logos can actually change what people call a company! MTV, was usually just an acronym used for a more consise logo. However, the logo caught on, and now people just refer to the network as MTV. I think this logo is hip, timeless (despite that it's been used forever) and has the ability to be variated. The logo changes occasionally based on what it's being used for, or what the theme is. It just pops (no pun intended)

2.

Another great logo. It's is unified and visually interesting. The "V" and "W" come together to make a unique and interesting shape. While the V and W by themeselves are boring, putting them together in an interesting way, really changes the way we view the letters.

3.

Though this logo is somewhat busy, it is still a great logo. Even if you took out the words, the shape of the logo would still be regonizable. The words themselves also work because they follow the shape of the logo, rather than overwhelming it. You can also see this logo ALL OVER merchandise, letting you know of it's versatility.

So those are some I like, let's talk about some I DISLIKE.

4.

Now let's talk about a logo blunder. The redone Gap logo. Why do I think it was so terrible. Simply, it's boring. It's not strong, the typography is not unique, it's absolutely awful. I'm falling asleep just looking at it. Why did they decide to redo their logo again? Silly.

5.

I hate the Dell logo. It's just, again, boring. It says nothing about the company to me, aside from the fact that it must be a boring company. The offset "E" is pointless. I don't see "technology" when I look at this logo. Wish it was more interesting.

My Little Cupcake

For my html project, I decided to make a cupcake! I guess I had a sweet tooth when I was coming up with ideas...

So in my graph, I started with more background objects, and a smaller cupcake. Overall, the design was the same, but some minor changes. Making the base of the cupcake larger, shifting the cupcake down a little...

And as time went on, I decided to make the cupcake the focal point, and thought that too many background objects made it look too busy (if that's even possible)
I also knew I wanted bright colors and more bright colors. I like cheery things, and what's better fitting for lots of colors than a cupcake?

The biggest challenge was that damn cherry stem. I couldn't ever quite get it where I wanted, and I knew I wanted it to have a loop. I used a bezier cure for the stem, and a quadratic curve for the cupcake top. The sprinkles also posed a challenge for me, but in the end I think I got a good result, though I would have loved more.

Here is my code:

<!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, 800, 600);

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

var grd = context.createLinearGradient(400, 0, 400, 600);

grd.addColorStop(0, 'rgb(153,102,255)');

grd.addColorStop(1,'rgb(102,255,255)');

context.fillStyle= grd;

context.fill();

context.stroke();

//backgroundaccents

//circle row 1

context.beginPath();

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

context.strokeStyle = 'rgb(51,153,255)';

context.fillStyle = 'rgb(51,153,255)';

context.fill();

context.stroke();

//triangle row 1

context.beginPath();

context.moveTo(400,10)

context.lineTo(300,150)

context.lineTo(500,150)

context.lineTo(400,10)

context.lineWidth = 5;

context.strokeStyle = 'rgb(255,102,153)';

context.fillStyle = 'rgb(255,102,153)';

context.fill();

context.stroke();

//circle row 1

context.beginPath();

context.arc(700,100, 80, 0 , 2 * Math.PI, false);

context.strokeStyle = 'rgb(51,153,255)';

context.fillStyle = 'rgb(51,153,255)';

context.fill();

context.stroke();

//circle row 2

context.beginPath();

context.arc(100,300, 80, 0 , 2 * Math.PI, false);

context.strokeStyle = 'rgb(51,153,255)';

context.fillStyle = 'rgb(51,153,255)';

context.fill();

context.stroke();

//circle row 2

context.beginPath();

context.arc(700,300, 80, 0 , 2 * Math.PI, false);

context.strokeStyle = 'rgb(51,153,255)';

context.fillStyle = 'rgb(51,153,255)';

context.fill();

context.stroke();

//circl row 3

context.beginPath();

context.arc(700, 500, 80, 0 , 2 * Math.PI, false);

context.strokeStyle = 'rgb(51,153,255)';

context.fillStyle = 'rgb(51,153,255)';

context.fill();

context.stroke();

//triagnle row 3

context.beginPath();

context.moveTo(400,590)

context.lineTo(300,510)

context.lineTo(500,510)

context.lineTo(400,590)

context.lineWidth = 5;

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

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

context.fill();

context.stroke();

//circle row 3

context.beginPath();

context.arc(100, 500, 80, 0 , 2 * Math.PI, false);

 context.strokeStyle = 'rgb(51,153,255)';

context.fillStyle = 'rgb(51,153,255)';

context.fill();

context.stroke();

//cupcake top

context.beginPath();

context.moveTo(200, 300);

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

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

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

context.fill();

context.stroke();

//cupcake wrapper

context.beginPath();

context.moveTo(200,300)

context.lineTo(300,500)

context.lineTo(500,500)

context.lineTo(600,300)

context.lineTo(200,300)

context.strokeStyle = 'rgb(255,255,153)';

context.lineCap= 'round'

var grd = context.createLinearGradient(200, 300, 600, 300);

grd.addColorStop(0, 'rgb(255,255,153)');

grd.addColorStop(1,'rgb(255,153,0)');

context.fillStyle= grd;

context.fill();

context.stroke();

//sprinkle 1

context.beginPath();

context.moveTo(400,200)

context.lineTo(420,210)

context.lineWidth = 5;

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

context.stroke();

//sprinkle 2

context.beginPath();

context.moveTo(500,200)

context.lineTo(520,210)

context.lineWidth = 5;

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

context.stroke();

//sprinkle 3

context.beginPath();

context.moveTo(300,220)

context.lineTo(280,230)

context.lineWidth = 5;

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

context.stroke();

//sprinkle 4

context.beginPath();

context.moveTo(330,220)

context.lineTo(310,230)

context.lineWidth = 5;

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

context.stroke();

//sprinkle 5

context.beginPath();

context.moveTo(340,240)

context.lineTo(320,230)

context.lineWidth = 5;

context.strokeStyle = 'rgb(153,102,204)';

context.stroke();

//sprinkle 6

context.beginPath();

context.moveTo(340,240)

context.lineTo(320,230)

context.lineWidth = 5;

context.strokeStyle = 'rgb(255,255,51)';

context.stroke();

//sprinkle 7

context.beginPath();

context.moveTo(500,250)

context.lineTo(520,260)

context.lineWidth = 5;

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

context.stroke();

//sprinkle 8

context.beginPath();

context.moveTo(400,250)

context.lineTo(420,240)

context.lineWidth = 5;

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

context.stroke();

//sprinkle 9

context.beginPath();

context.moveTo(390,250)

context.lineTo(380,240)

context.lineWidth = 5;

context.strokeStyle= 'rgb(153,51,255)';

context.stroke();

//sprinkle 10

context.beginPath();

context.moveTo(240,250)

context.lineTo(260,240)

context.lineWidth = 5;

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

context.stroke();

//sprinkle 11

context.beginPath();

context.moveTo(440,250)

context.lineTo(460,240)

context.lineWidth = 5;

context.strokeStyle= 'rgb(153,255,51)';

context.stroke();

//cherry

context.beginPath();

context.arc(400, 125, 30, 0 , 2 * Math.PI, false);

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

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

context.fill();

context.stroke();

//cherry stem

context.beginPath();

context.moveTo(400,125)

context.bezierCurveTo(200, 10, 388, 10, 300, 100);

context.lineWidth = 10;

context.stroke();

//wrapper design 1

context.beginPath();

context.moveTo(200,300)

context.lineTo(250,350)

context.lineTo(300,300)

context.lineTo(350,350)

context.lineTo(400,300)

context.lineTo(450,350)

context.lineTo(500,300)

context.lineTo(550,350)

context.lineTo(600,300)

context.lineCap= 'round'

context.lineWidth = 5;

context.strokeStyle = 'rgb(153,204,255)';

context.stroke();

//wrapper design 2

context.beginPath();

context.moveTo(250,400)

context.lineTo(300,450)

context.lineTo(350,400)

context.lineTo(400,450)

context.lineTo(450,400)

context.lineTo(500,450)

context.lineTo(550,400)

context.lineCap= 'round'

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

context.stroke();

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

};

</script>

</head>

<body>

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

</body>

</html>

Real Heart!

<!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, 800, 600);
//context.fillStyle= 'rgb(153,102,255)';
var grd = context.createLinearGradient(400, 0, 400, 600);
grd.addColorStop(0, 'rgb(153,102,255)');
grd.addColorStop(1,'rgb(102,255,255)');
context.fillStyle= grd;
context.fill();
context.strokeStyle = 'rgb(153,102,255)'
context.stroke();

//heart bezier

//hearttop right
context.beginPath();
context.moveTo(400,200);
context.bezierCurveTo(300, 0, 100, 200, 250, 325);
//begin heart bottom right
context.quadraticCurveTo(400, 450 , 400, 500);
context.quadraticCurveTo(400, 435 , 550, 325);
//hearttop left
context.bezierCurveTo(700, 200, 500, 0, 400, 200);
context.fillStyle = 'rgb(255,102,204)';
context.fill();
context.lineWidth=6;
context.lineCap= 'round'
context.strokeStyle = 'rgb(204,0,204)';
context.stroke();

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

};

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

An attempt at Hearts?

So my "attempt" at hearts was a massve fail.
The quadratic curve one somewhat resemebles a heart, but after hours of attempts, I could not get the right side bezier-curve-style of my heart to on-knot itself.

Anywho, here's my heart so everyone can laugh at me

Bezier Curve:


context.strokeStyle = 'rgb(250,40,50)';
context.stroke();

context.beginPath();
context.moveTo(400,300)
context.bezierCurveTo(10,150, 10, 400, 400, 600);
context.stroke();

context.beginPath();
context.moveTo(400,300)
context.bezierCurveTo(800, 750 , 600 , 200 ,400, 600);
context.stroke();

The end result:

Quadratic Cruve:

context.beginPath();

context.moveTo(400,350);

context.quadraticCurveTo(10, 150, 400, 600);

context.strokeStyle = 'rgb(250,40,50)';

context.stroke();

context.beginPath();

context.moveTo(400,350)

context.quadraticCurveTo(790,50,400,600);

context.stroke();

The end result: