TKeeler Class Blog (Spring 2016)

Wednesday, March 30, 2016

Magazine project

I decided to make my magazine cover look more like a tabloid magazine. Doing it in this format made it easier for me to create something that was visually appealing. I didn't have to consistently insert images to see if they worked with the big picture that was working as the background.

The five color boxes are meant to simply make it more colorful and not boring to look at.

If you can't read the word next to NEWS, its manga in hiragana, one of the Japanese writing systems. The first symbol represents the "ma-" sound. The second the "n-" sound. The last the "ga-" sound.

As for the picture with myself, I took a picture of me at a Bucs game and clipped it out of its original picture before placing it in front of a skyscraper. What skyscraper, I don't know. I just Googled it. I feel like it gives me a look as someone who is really important. Makes me look powerful.

Wednesday, March 23, 2016

Photoshop Assignment

For my assignment, I decided to place my self in one of my favorite video games: Fallout: New Vegas. I'm a huge fan of the overall series and have always thought about how life would be like in the wasteland.

In the picture, I am standing alongside the main character of New Vegas, known simply as the Courier, as we battle a type of robot called Securitrons. While the Courier is prepared with a hunting rifle and combat armor, I am not up to his standard, fighting metal enemies with my fists and with no armor. I took the picture of myself doing tae kwon do a couple of years ago.

I used a diffuse tool to bring myself up to the lighting standard within the picture. Surprisingly, darkening myself made me fit better into the picture. It still feels out of place a little. I was hoping to lighten myself with warm colors to get the desert feel of the rest of the picture.

Wednesday, March 16, 2016

HTML Project

I know it doesn't look good. I had a lot of trouble with this, even more than the vector. While creating shapes wasn't really a problem, I had a problem with the grid and curves. For some reason, the grid on my printed page didn't match up with the site. I had to do a lot of trial and error. The curves were also confusing, as I was constantly guessing where the curve was supposed to go.

Anyway, this is suppose to be a Jigglypuff. I added the hat, because I was having trouble with her ears and with her fluff on top. The background is just a gathering of random colors.

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

context.beginPath();
context.rect (0, 0, 800, 600);
var grd = context.createLinearGradient(0, 300, 800, 300)
grd.addColorStop(0, 'rgb(0, 0, 0)');
grd.addColorStop(.1, 'rgb(200, 120, 30)');
grd.addColorStop(.3, 'rgb(200, 100, 200)');
grd.addColorStop(.5, 'rgb(210, 210, 210)');
grd.addColorStop(.7, 'rgb(190, 180, 170)');
grd.addColorStop(.9, 'rgb(100, 0, 0)');
grd.addColorStop(1, 'rgb(255, 255, 255)');
context.fillStyle = grd;
context.fill();
context.stroke();

context.beginPath();
context.arc (400, 250, 130, 0, 2*Math.PI, false);
context.fillStyle= 'rgb(250, 208, 222)';
context.fill();
context.lineWidth= 2;
context.stroke();

context.beginPath();
context.moveTo (530, 255)
context.quadraticCurveTo (625, 245, 521, 300);
context.fillStyle= 'rgb(255, 208, 222)';
context.fill();
context.lineWidth= 2;
context.stroke();

context.beginPath();
context.moveTo (350, 270);
context.quadraticCurveTo (400, 330, 325, 300)
context.stroke();

context.beginPath();
context.moveTo (383, 383);
context.bezierCurveTo (387, 387, 390, 390, 380, 400);
context.bezierCurveTo (250, 400, 360, 360, 383, 383);
context.fillStyle= 'rgb(255, 208, 222)';
context.fill();
context.lineWidth= 2;
context.stroke();

context.beginPath();
context.moveTo (435, 377)
context.bezierCurveTo (380, 382, 390, 390, 400, 400);
context.bezierCurveTo (405, 405, 410, 410, 455, 395);
context.quadraticCurveTo (480, 375, 420, 377);
context.fillStyle= 'rgb(255, 208, 222)';
context.fill();
context.lineWidth= 2;
context.stroke();

context.beginPath();
context.arc (360, 220, 40, 0, 2*Math.PI, false);
context.fillStyle= 'white';
context.fill();

context.beginPath();
context.arc (360, 210, 30, 0, 2*Math.PI, false);
context.fillStyle= 'teal';
context.fill();

context.beginPath();
context.arc (360, 200, 10, 0, 2*Math.PI, false);
context.fillStyle= 'white';
context.fill();

context.beginPath();
context.arc (450, 220, 40, 0, 2*Math.PI, false);
context.fillStyle= 'white';
context.fill();

context.beginPath();
context.arc (450, 210, 30, 0, 2*Math.PI, false);
context.fillStyle= 'teal'
context.fill();

context.beginPath();
context.arc (450, 200, 10, 0, 2*Math.PI, false);
context.fillStyle= 'white'
context.fill();

context.beginPath();
context.moveTo (375, 300);
context.quadraticCurveTo (410, 370, 440, 300);
context.stroke();

context.beginPath();
context.moveTo (270, 150);
context.lineTo (530, 150);
context.lineWidth= 15;
context.lineCap= 'butt';
context.strokeStyle= 'tan';
context.stroke();

context.beginPath();
context.rect (300, 70, 200, 70);
context.fillStyle= 'tan';
context.fill();
context.stroke();

};

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

Wednesday, March 2, 2016

Stick Figure

It's a stick figure, so there really isn't much to say. It was really easy to make. There was a lot of trial and error though, mostly because I made it without a grid.

Sunday, February 28, 2016

Vector Illustration

I couldn't do it. I can't be any more blunt. This was one of the most agitating projects that I have ever done in all my time in school. I understand what I am supposed to do. I just can't do it. Its confusing, time consuming, trial and error, but most of all, it isn't fun. I had fun doing the other assignments. I had no fun doing this. I understand that assignments aren't meant to be fun. They are meant to be learning experiences. At the same time, there is only so much frustration one can take before you just give up. Besides, I've never been good at 3D art anywhere.

I'm sorry. I know I'm better than this. Again, I just couldn't do it.

With all that out of the way, I guess I should explain what I was attempting to do.

Obviously, I tried to create a vector illustration of a soda bottle, specifically a Coca-Cola bottle. For reference, here is the picture I based my illustration off of.

Obviously, I had to exclude the brand, per your requirements for this assignment. I tried to do a face, but I had more frustration with that. I played around with other things, like buildings. These were even more complex, though. I picked a soda bottle because I thought it would be simple enough for me to handle.

There is supposed to be a black text behind the white one to give off the illusion of 3D. I don't know what went wrong with the conversion.

Wednesday, February 17, 2016

Character Project

I really had no idea what I was doing. I just picked colors that made at least some sense. I want to clarify a few things that I think might be confusing.

The black ears are not the same as the rest of the fur because I had trouble creating something that was aesthetically pleasing with the same color. If I didn't use an outline color it blended into the ear too much and if I did use a outline color, it just looked out of place.

The blue blob in the center of the spider legs is supposed to be a globe. However, I quickly realized as I was working on this that that was not going to be possible. I don't have the skills to do it yet. On a side note, the spider legs remind me of Pokey from Earthbound.

The two shades of blue are supposed to be a skirt. Emphasis on the word "supposed".

The message "Link Joker was here..." won't make any sense unless you play Vanguard.

Wednesday, February 10, 2016

Final Logo

Explaining the logo:

1. I chose to go with using individual blocks to form the logo for two reasons. First, I had difficulty creating a logo that would depict a 3D stadium. It would require too many layers and doing things that I have not learned yet. Second, the blocks represent the company's status as a construction company.

2. There is no deeper meaning behind the choice to use black as the main color. Bright colors don't make sense for a blue-collar business like construction. In addition, during the process to develop this logo, the logo became unappealing when I added as many colors as possible.

3. As for the flags, the three colors (red, yellow, and blue) are inspired by the three diamonds on the logo for the Pittsburgh Steelers. Accordingly, they represent the same thing as the diamonds, and that would be the materials required to create steel. Red represents iron ore. Yellow represents coal. Blue represents scrap steel. Steel is obviously a major component in any construction project.

4. The text "Colosseum Constructors" is purposefully designed to be as simple as possible. Again, this is a blue-collar industry. It is not glamorous. Cursive and/or fancy fonts would simply be out of place.

5. Similar to how I used simple objects to create the stadium, I chose to depict a high school like stadium because of its simplicity. Trying to design giant NFL stadiums proved too complex. In addition, I was concerned that the logo would be too busy and assault the eyes with detail. High school stadiums are also more relatable, as every community has one. Not every community has a big stadium.

Blog Archive