Advanced Programming

Processing

We used Java to create drawings out of shapes. This house is an example of the basic shapes we used.

Ladybugs

The next day, we made ladybugs with our code sort into functions.

Each lady bug had its own function. The x and y values can be changed so the the ladybug can move around as a whole.

Colored Balls

We also created a moving ball that would "bounce" off the border.

After, we made several bouncing balls bounce around the screen in different sizes, direction, and color.


Cheshire Cat

At the end of the day, I drew a cat that was modelled after the Cheshire Cat that was in newer Alice in the Wonderland film.

I only organized the code into what they were for. For example, I used comments to show that some lines of code are for the cat's ears or mouth.

The teeth are the same color as the face because I used lines instead of triangles. Here is the code I used for half of the teeth.

When I was trying to add the code for the Cheshire Cat into Khan Academy, the cat was too big and wouldn't fit on their screen. I didn't use variables so I had to individually change each coordinate. Instead, I used some transformations to make the cat fit.

After discovering that I didn't have to use variables or individually edit each coordinate. I moved the entire Cheshire Cat in Processing so I can make a hat on top. (Cheshire Cat with hat under construction.)

Here is the final product:

Major Tools of Programming in Java

Since Java and Python are two different programming languages, they have different syntax for variables, loops, conditionals, and functions.

Loop

Loops in Java look like this. This is part of the code for the balls.

Conditional

This code is also from the balls. This tells the circles to change direction if they hit the border.

Variables

These two variables are declaring my x and y coordinates for my lady bugs. This helps when I want to move the ladybug around without messing up the shapes that it's made of.

Functions

This is the function for the four lady bugs I made. Since this function doesn't need to return anything, "void" is placed before the function.

Javascript

Javascript allows us to make images without having to download them because they would be web ready.

We used Khan Academy to convert our Processing code into Javascript.

This is how the code differs in Javascript and Java.

Mother's Day Cards

We made shapes with Javascript right into our HTML. The first thing we made was a heart.

Click here to see my heart made in Javascript.

Javascript is slightly different from Java because Javascript uses "createCanvas()" instead of "size()" when setting up. However, they both still use semicolons and brackets to code.

P5.js is a website that you can refer to when trying to perform a certain action.

Bezier Curves

These curves uses several points and creates a curve. Bezier curves in Javascript are made with bezier(x1, y1, x2, y2, x3, y3, x4, y4). The first two and the last two are the coordinates of the anchor points. And the middle four points control the shape of the curve.