Tuesday, September 16, 2014

Logo Sketches


Logo Critiques


1. Snapchat is a popular photo messaging app whose target audience is young adults and teens. The app allows users to send quick snapshots to selected friends where they can doodle and decorate their images. 

I think this logo is successful in two ways. The bright yellow color employed is in line with there company's playful, youthful and cheerful personality. Also, the use of their mascot (Ghostface Chillah) helps emphasize one of the apps most prominent feature, that picture only last for a little while ( 10 seconds maximum) before they are erased.

Snapchat recently removed the smiling face from Ghostface Chillah. They said the move was to show that their users were the true face of Snapchat 






2. An elephant never forgets, but humans certainly do. Evernote is a note making and archiving application that helps its users collect and store information, to do lists and webpages for easy access later on. The use of the elephant I think was genius as it ties in to the well known saying about elephants and their memories. I also love the fact that the ear of the elephant resembles a piece of paper that has been folded over so users never forget where their important pieces of information are. In my opinion this is a highly successful logo.






3. Pinterest is an online tool used to collect pictures from around the web to be used as inspiration and ideas. The use of the bright red color is certainly eye catching and I like how the logo almost looks like a bullseye or a dart board which certainly compels me to obsessively "pin stuff" to it for hours at a time.










4. Febreze has gone through many different logos iterations but this latest one is my favorite. This new logo is like a breath of fresh air (pun intended). They streamlined the font and modernized the overll look creating a sleek and elegant design.







5. Brilliant earth is an engagement ring company dedicated to sustainable and ethically sourced diamonds. Their appreciation for nature and conservation is shown through the use of a diamond flower  icon and the green color of the logo. The shade of green they used was smart because it needed to showcase their pro environmental stance but also needed to convey class, pristine and sophisticated. To use a green that had hues of blue it instead of browns or yellows still manages to read "earthy" without being "muddy" or "dirty".

Brilliant Earth donates 5% of its profits to communities in Africa who have been affected by the blood diamond industry. 



Company Logo Ideas

1. The Noob Squad
A company that will provide personal one on one training to gamers who are terrible at their preferred game or gamers who are looking to gain an edge

2. BeBodi
A body scrub line made from 100% natural ingredients with scents inspired by the Caribbean

3. Font Bouquet
Wedding invitation and paper goods design company

4. GeekCite
A gamer and geek lifestyle magazine

5. PixlBuny
my creative blog logo

Sunday, September 14, 2014

ASCII PROJECT

I decided to try and create a wolf howling at the moon



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.fillStyle = 'rgb(0, 0, 55)';
context.fill();
context.stroke();

/// Moon

var centerX = 400;
var centerY = 275;
var radius = 250

context.beginPath();
context.arc(centerX, centerY, radius, 0,  2*Math.PI, false);
context.fillStyle = 'rgb(255, 255, 0)';
context.fill();
context.stroke();

/// Stars

var StarcenterX = 750;
var StarcenterY = 100;

var Star2centerX = 650;
var Star2centerY = 100;

var Star3centerX = 725;
var Star3centerY = 200;

var Star4centerX = 775;
var Star4centerY = 300;

var Star5centerX = 700;
var Star5centerY = 350;

var Star6centerX  = 200;
var Star6centerY = 25;

var Star7centerX = 50;
var Star7centerY = 50;

var Star8centerX = 150;
var Star8centerY = 100;

var Star9centerX = 50;
var Star9centerY = 300;

var Star10centerX = 25;
var Star10centerY = 475;

var Star11centerX = 150;
var Star11centerY = 400;

var Star12centerX = 200;
var Star12centerY = 500;

var radius = 10;

context.beginPath();
context.arc(StarcenterX, StarcenterY, radius, 0,  2*Math.PI, false);
context.fillStyle = 'rgb(245, 245, 167)';
context.fill();

context.beginPath();
context.arc(Star2centerX, Star2centerY, radius, 0,  2*Math.PI, false);
context.fillStyle = 'rgb(245, 245, 167)';
context.fill();

context.beginPath();
context.arc(Star3centerX, Star3centerY, radius, 0,  2*Math.PI, false);
context.fillStyle = 'rgb(245, 245, 167)';
context.fill();

context.beginPath();
context.arc(Star4centerX, Star4centerY, radius, 0,  2*Math.PI, false);
context.fillStyle = 'rgb(245, 245, 167)';
context.fill();

context.beginPath();
context.arc(Star5centerX, Star5centerY, radius, 0,  2*Math.PI, false);
context.fillStyle = 'rgb(245, 245, 167)';
context.fill();

context.beginPath();
context.arc(Star6centerX, Star6centerY, radius, 0,  2*Math.PI, false);
context.fillStyle = 'rgb(245, 245, 167)';
context.fill();

context.beginPath();
context.arc(Star7centerX, Star7centerY, radius, 0,  2*Math.PI, false);
context.fillStyle = 'rgb(245, 245, 167)';
context.fill();

context.beginPath();
context.arc(Star8centerX, Star8centerY, radius, 0,  2*Math.PI, false);
context.fillStyle = 'rgb(245, 245, 167)';
context.fill();

context.beginPath();
context.arc(Star9centerX, Star9centerY, radius, 0,  2*Math.PI, false);
context.fillStyle = 'rgb(245, 245, 167)';
context.fill();

context.beginPath();
context.arc(Star10centerX, Star10centerY, radius, 0,  2*Math.PI, false);
context.fillStyle = 'rgb(245, 245, 167)';
context.fill();

context.beginPath();
context.arc(Star11centerX, Star11centerY, radius, 0,  2*Math.PI, false);
context.fillStyle = 'rgb(245, 245, 167)';
context.fill();


context.beginPath();
context.arc(Star12centerX, Star12centerY, radius, 0,  2*Math.PI, false);
context.fillStyle = 'rgb(245, 245, 167)';
context.fill();

/// Mountains

var Mx = -25;
var My = 600;
var Mx2 = 50;
var My2 = 500;
var Mx3 = 75;
var My3 = 550;
var Mx4 = 100;
var My4 = 525;
var Mx5 = 125;
var My5 = 550;
var Mx6 = 150;
var My6 = 500;
var Mx7 = 175;
var My7 = 550;
var Mx8 = 215;
var My8 = 525;
var Mx9 = 250;
var My9 = 575;
var Mx10 = 275;
var My10 = 550;
var Mx11 = 300;
var My11 = 575;
var Mx12 = 400;
var My12 = 575;
var Mx13 = 400;
var My13 = 625;

context.beginPath();
context.moveTo(Mx, My);
context.lineTo(Mx2, My2);
context.lineTo(Mx3, My3);
context.lineTo(Mx4, My4);
context.lineTo(Mx5, My5);
context.lineTo(Mx6, My6);
context.lineTo(Mx7, My7);
context.lineTo(Mx8, My8);
context.lineTo(Mx9, My9);
context.lineTo(Mx10, My10);
context.lineTo(Mx11, My11);
context.lineTo(Mx12, My12);
context.lineTo(Mx13, My13);
context.lineTo(Mx,My);
context.fillStyle = 'rgb(1, 28, 3)';
context.fill();
context.closePath();
context.stroke();


/// Wolf


var startx = 300;
var starty = 610;
var controlx1 = 350;
var controly1 = 1500;
var controlx2 = 350;
var controly2 = 515;
var endx = 375;
var endy = 475;

var controlx3 = 325;
var controly3 = 487;
var endx2 = 375;
var endy2 = 448;

var controlx4 = 310;
var controly4 = 455;
var endx3 = 350;
var endy3 = 425;

var controlx5 = 410;
var controly5 = 348;
var controlx6 = 194;
var controly6 = 230;
var endx4 = 275;
var endy4 = 215;

var controlx7 = 300;
var controly7 = 195;
var endx5 = 292;
var endy5 = 223;

var controlx8 = 440;
var controly8 = 350;
var endx6 = 350;
var endy6 = 192;

var controlx9 = 300;
var controly9 = 200;
var endx7 = 345;
var endy7 = 175;

var controlx10 = 375;
var controly10 = 115;
var endx8 = 402;
var endy8 = 155;

var controlx11 = 630;
var controly11 = 275;
var controlx12 = 600;
var controly12 = 300;
var endx9 = 670;
var endy9 = 400;

var controlx13 = 830;
var controly13 = 460;
var endx10 = 700 ;
var endy10 = 475;

var controlx14 = 700;
var controly14 = 550;
var endx11 = 825;
var endy11 = 615;


context.beginPath();
context.moveTo(startx, starty);
context.bezierCurveTo(controlx1, controly1, controlx2, controly2, endx, endy);
context.quadraticCurveTo(controlx3, controly3, endx2, endy2);
context.quadraticCurveTo(controlx4, controly4, endx3, endy3);
context.bezierCurveTo(controlx5, controly5, controlx6, controly6, endx4, endy4);
context.quadraticCurveTo(controlx7, controly7, endx5, endy5);
context.quadraticCurveTo(controlx8, controly8, endx6, endy6);
context.quadraticCurveTo(controlx9, controly9, endx7, endy7);
context.quadraticCurveTo(controlx10, controly10, endx8, endy8);
context.lineTo(500, 250);
context.lineTo(525, 265);
context.bezierCurveTo(controlx11, controly11, controlx12, controly12, endx9, endy9);
context.quadraticCurveTo(controlx13, controly13, endx10, endy10);
context.quadraticCurveTo(controlx14, controly14, endx11, endy11);
context.lineTo(startx, starty);
context.lineWidth = 5;
context.fillStyle = 'rgb(0, 0, 0)';
context.fill();
context.closePath();
context.stroke();

/// Wolf Details

/// Eye

var StartEyex = 525;
var StartEyey = 300;

var controlEyeX = 550;
var controlEyeY = 285;
var endEyeX = 575;
var endEyeY = 350;

context.beginPath();
context.moveTo(StartEyex, StartEyey);
context.quadraticCurveTo(controlEyeX, controlEyeY, endEyeX, endEyeY);
context.strokeStyle = 'rgb(255, 255, 255)';
context.stroke();

/// Ear

var StartEarx = 675;
var StartEary = 425;

var controlEarX = 725;
var controlEarY = 425;
var endEarX = 750;
var endEarY = 450;

var controlEarX2 = 600;
var controlEarY2 = 450;
var endEarX2 = 675;
var endEarY2 = 425;

context.beginPath();
context.moveTo(StartEarx, StartEary);
context.quadraticCurveTo(controlEarX, controlEarY, endEarX, endEarY);
context.quadraticCurveTo(controlEarX2, controlEarY2, endEarX2, endEarY2);
context.strokeStyle = 'rgb(255, 255, 255)';
context.fillStyle = 'rgb(255, 255, 255)';
context.fill();
context.closePath();
context.stroke();


/// Nose

var StartNoseTopx = 375;
var StartNoseTopy = 148;

var NoseTopx = 390 ;
var NoseTopy = 148;

context.beginPath();
context.moveTo(StartNoseTopx, StartNoseTopy);
context.lineTo(NoseTopx, NoseTopy);
context.strokeStyle = 'rgb(255, 255, 255)';
context.lineCap = 'round';
context.stroke();










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

};

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


Monday, September 8, 2014

ASCII HEART


ASCII In Class Assignment

Today in class we were tasked with making a heart using html5. After 20 minutes of utter frustration I accomplished this lovely doodad. It's not exactly what I envisioned but at least its heart shaped-ish



CODE:



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

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

var startx = 400;
var starty = 275;
var controlx1 = 200;
var controly1 = 100;
var controlx2 = 250;
var controly2 = 400;
var endx2 = 400;
var endy2 = 475;

var controlx3 = 550;                      
var controly3 = 400;
var controlx4 = 600;
var controly4 = 100;
var endx3 = 400;
var endy3 = 275;

context.beginPath();
context.moveTo(startx, starty);
context.bezierCurveTo(controlx1, controly1, controlx2, controly2, endx2, endy2);
context.bezierCurveTo(controlx3, controly3, controlx4, controly4, endx3, endy3);

context.fillStyle = 'rgb(255, 51, 153)';
context.fill();
context.lineWidth = 15;
context.closePath();
context.stroke();

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

};

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









Masterpiece!

Saturday, September 6, 2014

Sims3 Photo Manipulations

Did you know that there was an entire underground community dedicated to modeling competition with the Sims 3, no? well congratulations it means you are way cooler than me!


POP


It may seem like a very unconventional way to learn Photoshop but doing sim modeling comps really improved my skills by leaps and bounds.

I learned how to cut an object cleanly out of its background, I learned how to use gradient maps to make it look like my subject actually belong to his/her surroundings, I learned how to paint hair and clothing, I learned how to do retouch and apply makeup.



AKINYI




before










                                                                                         after

Competition was fierce, forcing me to continuously work on improving, judging was harsh and competitors were harsher but prizes included rare in game objects, clothes, game credits and even cash prizes!

With the launch of the sims 4, I look forward to seeing the evolution of sim modeling competitions and while I no longer have the time to compete, I still follow the work of my friends and former competitors

MORE MODELING PICS


HOMMAGE AU CIRQUE




THE MEAN REDS



ICE QUEEN




MAY SHADOWS CONSUME YOU



CYBORG