Saturday, May 2, 2020

10 Hours of Coding-Intro to JS: Drawing and Animation-Part 10







In this hour I started the "Text and Strings" lesson. I completed the first 
challenge which was "My Favourite Foods."

I learned how to use the text commands. First is "text(text,x,y)" This is used to
show the text on the screen. The next one is "textFont(font, size*)." This is used to 
change the font. The last one is "textSize(size)". This is used to change the size
of the text.


This was the final hour from my  "10 Hours of Coding". I enjoyed the 
Khan Academy coding program and recommend others to try it as well.







Friday, May 1, 2020

10 Hours of Coding-Intro to JS: Drawing and Animation-Part 9





In this hour I completed the "Interactive 
Programs" lesson. I completed the "Mouse Movement Mania" challenge.

I didn't learn any new code but used the knowledge from 
previous challenges to complete this one as well.

In the next hour I will be moving on to "Text and Strings."
 





10 Hours of Coding-Intro to JS: Drawing and Animation-Part 8





In this hour I started the "Interactive 
Programs." I completed the first challenge which was "Tasty Tomato."

I learned how to make the mouse interactive with code. The code I learned was "mouse x" and 
"mouse y." I used these to have the shape move to the same location of the mouse.

In the next hour I will be finishing this lesson and 
will do "Mouse Movement Mania" challenge.
   





10 Hours of Coding-Intro to JS: Drawing and Animation-Part 7





In this hour I finished the lesson "Animation Basics".

I used my skills the from the last days to complete the "Shooting Star"

In the next hour I will be starting the lesson "Interactive Programs".

project.The first challenge in this lesson is "Tasty Tomato."









Sunday, April 26, 2020

10 Hours of Coding-Intro to JS: Drawing and Animation-Part 6





In this hour I started the lesson "Animation Basics".I completed
two challenges. One was the "Exploding Sun" and the other 
was "Parting Clouds.


I learned how to animate code using "draw = function() {};.
To make an animation you use this code. Anything you put
between the code will repeat, therefore becoming an animation. Then 
to make the size get larger or for the object to move I used X-=;. You put
a number after the "=" and it makes it that much bigger every time.

In the next hour I will be finishing the "Animation Basics" lesson.
Parting Clouds Animation

Parting Clouds extra code
Exploding Sun Animation





Friday, April 24, 2020

10 Hours of Coding-Intro to JS: Drawing and Animation-Part 5







In this hour I completed the lesson of "Variables." I finished 
the Funky Frog challenge.


I learned how to use the "var" code in more depth but this time 
it was for changing the position and not the size. It can be used 
for the values of x and y as seen in the code below. I used this for 
the frog so I could move the whole thing at once instead of having
to move each part of the frog.

In the next hour I will be starting the "Animation Basics" lesson.







10 Hours of Coding-Intro to JS: Drawing and Animation-Part 4






Today I started the lesson of "Variables." I finished 
the Bucktooth Bunny challenge.


I learned how to use the "var" code. This makes it easier to change
the size of certain shapes with one command. I used it to change the eye sizes 
and the teeth sizes. For the eye size I used "var eyeSize" then "eyeSize = 40"
For the teeth I did "var toothSize" and "toothSize = 60".

In the next hour I will be finishing the "Variables" lesson. The 
last challenge in this lesson is "Funky Frog."






Thursday, April 23, 2020

10 Hours of Coding-Intro to JS: Drawing and Animation-Part 3






Today I completed the lesson of"Colouring."
I didn't learn any new code but perfected the ones
I learned in the previous lesson.

I used my skills from the previous lesson which were
 how to use the "fill" which is used to add colour
 to the different shapes, how to use "strokeWeight" 
to adjust the thickness of the shape. Also I used "background" which 
adds a rectangle that covers the whole box.

In the next hour I will be working on the "Variables" lesson. The 
first challenge in this lesson is "Bucktooth Bunny"






Thursday, April 16, 2020

10 Hours of Coding-Intro to JS: Drawing and Animation-Part 2






Today I completed part of the next lesson which 
is "Colouring." I learned how to use code to fill in 
shapes and adjust the thickness of them as well.

I learned how to use the "fill" which is used to add colour
 to the different shapes. I also learned how to use "strokeWeight" 
to adjust the thickness of the shape. Also I used "background" which 
adds a rectangle that covers the whole box.

In the next hour I will be finishing the "Colouring" lesson. The 
final project in this lesson is "What's for Dinner?"






Wednesday, April 15, 2020

10 Hours of Coding-Intro to JS: Drawing and Animation-Part 1





Intro to JS: Drawing and Animation

I chose Khan Academy and the course I chose is 
"Intro to JS: Drawing and Animation." I completed the 
first lesson which was "Drawing basics." I learned how to 
use code to create drawings and shapes.

I learned how to use the "ellipse" code to create circular 
shapes. Also, I learned to use "rect" to make rectangular 
and square shapes. Lastly, I learned how to use "line" to 
create lines. With these commands I ended up creating a 
snowman and later a snowman waving.

In the next hour I am going to work on the second 
lesson which is "Colouring with Code." In this lesson I
 will learn how to add colour with code.
Starting my first project: The Simple Snowman
I made my first mistake which was an easy fix.
I finished the Simple Snowman.



I decided the snowman was to simple so I added some buttons.

This is the finished version of my waving snowman. I added some colour to the ground.




Monday, March 9, 2020

Morphing: Animal Skin Wrap #3






Lebron James
Layers #1

Layers #2

Alligator

Canteloupe

Strawberry
Transformed LeBron James

Pole

Column

Grass Field

Steps
1. I selected a Canteloupe, an alligator skin and LeBron James


2. Open the LeBron-mask it out
then "place embedded" the Canteloupe, mask it out
Use opacity on the Canteloupe get the same size the two items.
Try to match body parts.
Do the same for alligator skin and strawberry texture.

3. Choose Filter, Liquify when on the Canteloupe layer.
Make sure to checkbox Show Backdrop. Then use: drop-down to Lebron.
I adjusted the opacity to see both around 50%.
Then I warped the canteloupe to match Lebron's face.
Parts that stick out too much are removed later.
Do the same for alligator skin and strawberry texture

4. Then CTRL click the Lebron MASK then paint on the canteloupe MASK.
After that I chose SHIIFT-CTRL-I then painted with white around the Canteloupe to remove the extra parts.
On the Canteloupe layer I chose the blending option 'multiply'
Then I added a new Adjustment Layer Brightness/contrast

5. I did the same steps to the rest of his face and added other materials like alligator skin and strawberry.

6.Then I selected all my layers and duplicated them then merged them so I can add the background in and only have to show 1 layer rather than a bunch.

7.Add Watermark






Monday, March 2, 2020

Photoshop - Animal skin to Car Swap






Ferrari Stradale

Snake Skin


Lemon Slice

Ractrack

 Ferrari Stradale x Snake Skin

Layers

Steps

1. I selected a snake skin, a lemon slice and a Car
that basically have the same position.

2. Open the Car-mask it out
then "place embedded" the snake skin, mask it out
Use opacity on the  snake skin to get the same size the two items.
Try to match body parts. Do again for lemon slice

3. Choose Filter, Liquify when on the snake skin layer.
Make sure to checkbox Show Backdrop. Then use: drop-down to Car.
I adjusted the opacity to see both around 50%.
Then I warped the snake and lemon skin to match the car.
Parts that stick out too much are removed later.

4. Then CTRL click the Car MASK then paint with black on the Snake Skin MASK.
After that I chose SHIIFT-ALT-I then painted with white around the Snake Skin to remove the extra parts.
On the snake skin layer I chose the blending option 'multiply'
Then I added a new Adjustment Layer Brightness/contrast
I got the eraser tool and took off the Snake skin off the windows and other interesting aspects of the car that shouldn't be changed.
Then did these steps with the lemon slice as well.

5.Then I selected all my layers and duplicated them then merged them so I can add the background in and only have to show 1 layer rather than a bunch.

And also added my watermark.