MaddFree- Digital Media Arts blog

Tuesday, December 8, 2015

Animation

This video was made using Photoshop. I first took a series of pictures and then compiled the ones I wanted to use in the animation. After I sequenced the photos how I wanted I added little drawings on the photos. I did this to show more emotion and give it a fun, cartoon-ish flare. I think these tied in well with the scenes and music.

Monday, November 9, 2015

Collage

For this project we had to make a collage of pictures in Photoshop that was based off of song lyrics. For my song I chose Meditate by Big K.R.I.T. The original/background picture is one that I took while I was in China. I then added a mystical looking dragon, koi fish, an intense moon, a buddha and two lanterns above the buddha. Lastly I put an overlay over the whole picture that is a low opacity galaxy picture. I wanted this picture to look mystical yet peaceful. The hardest part was extracting the koi fish from their background. Otherwise I am happy with the outcome...so happy that it is the background of my computer now!

Tuesday, November 3, 2015

Photoshop Magazine Cover

My magazine cover is called T Magazine. This magazine is a fun fashion and gossip magazine. My target market is young adults/ college women. The hardest part was making sure everything was on different layers. Also deciding on different fonts even though it was also kind of fun. I also had to figure out how to crop my images into circles which took some time figuring out. I wanted to use black and white photos for the small photo to make it more fun and different. Otherwise I had fun doing a magazine cover and feel a little more confident with Photoshop.

Monday, October 26, 2015

Self Insertion

This was the first time I have ever used Photoshop. I extracted photos of myself and inserted myself into other pictures. The hardest part of this assignment was getting my hair to still look natural and still extract it properly. Otherwise this was a fun and easy assignment. I'm excited to learn more about Photoshop and continue using it. I included the original photos as well.

Monday, October 19, 2015

HTML5

So, for this project I found that the tentacles and body were the most difficult and took the most time since it is a custom shape. I also had trouble figuring out a gradient background since every time I tried to do it it would not show up, so instead I made a wave in the back to give it some depth and texture. Otherwise I would say coding is time consuming and a little frustrating but still kind of fun, if I had more time I would have gone more in depth with this project but plan on using text wrangler in the future just to play around. I also did not use a image form the web but drew a little underwater scene instead and then transferred it online....

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

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

//blue bachground
context.beginPath();
context.rect(0, 0, 800, 600);
context.fillStyle = 'rgb(144, 189, 232)';
context.fill();

//sand
context.beginPath();
context.moveTo(0, 500)
context.bezierCurveTo(150, 475, 600, 525, 800, 500);
context.lineTo(800, 600);
context.lineTo(0, 600);
context.lineTo(0,500);
context.fillStyle = 'rgb(203, 203, 170)';
context.fill();

//wave
context.beginPath();
context.moveTo(0, 50);
context.quadraticCurveTo(350, 200, 800, 200);
context.lineTo(800,150);
context.quadraticCurveTo(550, 150, 400, 0);
context.lineTo(0, 0);
context.lineTo(0, 50);
context.fillStyle = 'rgb(169, 215, 245)';
context.fill();

//octopus outline
context.beginPath();
context.moveTo(400, 90);
context.bezierCurveTo(350, 90, 220, 150, 200, 250);
context.quadraticCurveTo(175, 330, 250, 400);
context.bezierCurveTo(200, 400, 195, 555, 125, 450);
context.bezierCurveTo(175, 600, 240, 425, 252, 415);
context.bezierCurveTo(245, 475, 280, 465, 200, 550);
context.bezierCurveTo(280, 550, 250, 460, 295, 440);
context.bezierCurveTo(290, 465, 330, 495, 275, 550);
context.bezierCurveTo(375, 475, 300, 425, 350, 445);
context.bezierCurveTo(400, 480, 330, 475, 350, 550);
context.bezierCurveTo(405, 475, 365, 455, 370, 450);
context.bezierCurveTo(440, 450, 400, 570, 415, 570);
context.bezierCurveTo(450, 500, 405, 450, 425, 450);
context.bezierCurveTo(445, 500, 440, 550, 490, 560);
context.bezierCurveTo(460, 500, 430, 450, 445, 450);
context.bezierCurveTo(520, 525, 460, 525, 525, 575);
context.bezierCurveTo(475, 525, 545, 525, 480, 440);
context.bezierCurveTo(590, 580, 580, 475, 600, 450);
context.bezierCurveTo(560, 465, 580, 540, 500, 425);
context.quadraticCurveTo(610, 375, 590, 250);
context.bezierCurveTo(540, 110, 440, 93, 400, 90);
context.fillStyle = 'rgb(26, 26, 218)';
context.fill();

//eyes
context.beginPath();
context.arc(300, 225, 25, 0, 2 * Math.PI, false);
context.fillStyle = 'rgb(255, 255 ,255)';
context.fill();
context.stroke();

context.beginPath();
context.arc(500, 225, 25, 0, 2 * Math.PI, false);
context.fill();
context.stroke();

context.beginPath();
context.arc(300, 235, 15, 0, 2 * Math.PI, true);
context.fillStyle = 'rgb(1, 1, 1)';
context.fill();
context.stroke();

context.beginPath();
context.arc(500, 235, 15, 0, 2 * Math.PI, true);
context.fill();
context.stroke();

//mouth
context.beginPath();
context.arc(420, 300, 100, 0, Math.PI/2, false);
context.lineWidth = 5;
context.lineCap = 'round';
context.stroke();

//fish
context.beginPath();
context.moveTo(645,150);
context.quadraticCurveTo(650, 115, 700, 150);
context.lineWidth = 2;
context.fillStyle ='rgb(224, 118, 37)';
context.fill();

context.beginPath();
context.moveTo(645,150);
context.quadraticCurveTo(650, 185, 700, 150);
context.fillStyle ='rgb(224, 118, 37)';
context.fill();

context.beginPath();
context.moveTo(700, 150);
context.lineTo(720, 140);
context.lineTo(720, 160);
context.lineTo(700, 150);
context.lineJoin = 'round';
context.fillStyle = 'rgb(224, 118, 37)';
context.fill();

context.beginPath();
context.arc(655, 150, 2, 0, 2* Math.PI, false);
context.stroke();

//secondfish
context.beginPath();
context.moveTo(130, 350);
context.quadraticCurveTo(125, 320, 50, 350);
context.lineWidth = 2;
context.fillStyle ='rgb(224, 118, 37)';
context.fill();

context.beginPath();
context.moveTo(130, 350);
context.quadraticCurveTo(125, 370, 50, 350);
context.fillStyle ='rgb(224, 118, 37)';
context.fill();

context.beginPath();
context.moveTo(50, 350);
context.lineTo(25, 340);
context.lineTo(25, 360);
context.lineTo(50, 350);
context.lineJoin = 'round';
context.fillStyle = 'rgb(224, 118, 37)';
context.fill();

context.beginPath();
context.arc(105, 349, 2, 0, 2* Math.PI, false);
context.stroke();

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

};

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

Wednesday, October 7, 2015

Vector Illustration

The most difficult part of this illustration were the hands and mouth. I had to make her mouth closed which I think actually reflects her personality more in Scandal where Kerry Washington plays Olivia Pope. The hands were also a little bit hard to work with but I think turned out good. Lastly I omitted the broach on her hat because it did not have enough detail to make it look like anything important in the illustration. I also had difficultly making the nose look more realistic but I think the point still gets across. Overall I had fun doing this project and definitely got the hang of organizing layers and using the pen tool in Adobe Illustrator and making everything easy to change if needed.

Monday, September 28, 2015

Exquisite Corpse

I had a lot of fun doing this project. I struggled with the layers and organizing everything but otherwise I used a gradient background which I makes it look like the robot man is on a different planet. I liked using different colors and creating a background for the first time. The only thing I struggled with was using layers and making them easy to edit later.