Senior Project 3

Today in class I finally got my slide-show to work and I put pictures that my friend drew I added them to it. Now I'm glad that the HTML is done and now I can have fun with the CSS. To see the outcome click here.

Senior Project 2

In class today my teacher Mr. Elkner came to me today and talked to me about my problem. So there were a couple of things I had missing and by tomorrow I know I will definitely have it fished. Im really excited about this because after I'm done i can do some css.

Senior Project 1

Today in class I worked on the a slide show that is coming along kind of well. The problems I'm having with it is that when I have two images, one of them overlaps it and they don't change picture. Hopefully I cant this problem fix. To see what I have so far click here.

Great Website Tutorial

In class today i found a great website that will help me out a lot on my slide show I'm going to do for my senior project class. What I'm thinking about doing is in the slide show I'm going to put pictures of computers in chronological order. To see the amazing website click here.

Brainstorming!

Today in class I had talk with one of my fellow classmates Carlos Portugal. We were coming up with ideas of how we can make a website of the history of computers for my senior project. Senior Project is when someone decides to do a project about something they like so I chose the history of computers out of all of my 5 objectives So we were browsing online for some professional examples, and on Monday we will definitely start working on it.

SlideShow Pt.2

Well today I got more advanced on my slide show but it was mostly the pictures. All of the images had a different height and width so right now I'm in the process of resizing all of the images and hopefully they will fit great in my slide show that I'm currently working as of right now.

SlideShow

Well recently I've been working on a slideshow. One of my troubles is trying to fit the pictures in there but what I thought of doing was maybe resizing all the images into one size but making sure it doesn't look pixelated or anything. This is going to be a sideshow of artistic drawing for one of my customers.

Project 6

In this assignment I learned how to actually draw some curves. The only functions you need is the beginPath(), which is where you set point to start. The other ones are moveTo(), lineTo(), bezierCurve(), lineTo, fill(). What the moveTo(); does is moves the top left corner to any height, and how much curve you want. lineTo(); function adjust how much width you want in the image, so I added two of these because if you put under the bezierCurve(); it adds curve to the top left corner. To see the outcome of my project click here.

Project 5

In this example I learned how to use transformations. The functions that I used was the draw function because I needed to draw a rectangle and a circle. So I had to draw several rectangles and stack them upon each other because the order matters. So I had to get the X and Y axis correctly to they could be placed correctly, then after that I drew circles. The fill in for the circles was white, and I get the X and Y axis correctly as well. The only thing that's confusing is getting the X and Y axis correctly instead of just guessing at times. So to see my final project click here.

Project 4

Two new functions that were introduced in this chapter were the save() and restore(). What these functions do is that they are used to save and retrieve the canvas state. So every time the save method is called the current drawing is pushed on a stack, and every time restore method is called, the last saved state is returned from the stack and all saved settings are restored. So in this example I used both of them but what I first did was draw a rectangle and save it. Then I made changes to the settings and drew a new rectangle with new settings. So I saved that current and did new changes to it. After that I restored the previous state and drew a rectangle with restored settings. The last step was restore the original state and draw a rectangle with restored settings. This took quite a while but I think the save() and restore() function are really easy and simple to use. To see the outcome please click here.

Project 3

In this project I did a text string with a shadowing effect. What I noticed is that what I did in this project could also be done in CSS, except in canvas it's easier this is why I like it better. So what I basically did is change the offset of the X and Y axis which is how high and low I want the blur. Then I added shadow color, changed the font type and added my name in it. Please click here to see it.

Project 2

In this example I learned how to use images in canvas. What I did was import an image and just repeat it several times. What I first did was create a new image element so then it can read what I'm trying to import. After that I put a source path and then messed around with the X and Y axis, and also the width and height. To see how it turned out please click here.

Project 1

In this project I used three functions, fillRect, clearRect, and strokeRect. The fillRect draws the black square which I did 100x100 pixels. The clearRect functions removes a square from the center, so I chose 60x60 pixels. Now the last thing I used was the strokeRect which draws an outline inside the cleared square so I did it 50x50 pixels. To see the outcome of the project click here.