πŸ”‚ Conditionals & Variables

Do Now (in p5)

  1. Create a canvas that is the size of the screen
  2. Create a shape (ellipse(), rect(), etc) that follows your mouse
  3. Write a conditional so that the fill() of the shape changes if the mouse is on the left or right side of the screen.

Like this:


Conditionals & Variables

Our next challenge is to make a sketch where a ball shape bounces around the screen.

This is a more complicated than the sketches we’ve done so far, because we will be defining our own variables.

To figure out what variables we need, think about what needs to change so a shape looks like it’s bouncing. Let’s look at it:

A pile of πŸ’© moves across the screen. What changes?

  1. The x position of the shape
  2. The y position of the shape

Now, the πŸ’© hits the edge of the screen. What changes?

  1. The x direction – if the shape hits the left edge, it should go right. If it hits the right edge, it should go left.
  2. The y direction – if the shape hits the top, it should start moving down. If it hits the bottom, it should start moving up.
Specification Points
Your canvas must resize to the window. 1
User created variables 3
Conditionals for the left/right and top/bottom edge of the screen 1
Extension ✱
Ball bounces using only 2 conditionals 2
Total: __ / 5