Animation Explorer — CC Fest Coding Camp

Main Workspace

Change the controls, then study how the moving circle responds inside the canvas.

Code Preview

This live readout shows the values and logic currently driving the sketch.

// Live starter code will appear here.

Controls

What can I change? Adjust speed, scale, and trail behavior.

Speed X 1.0

Speed Y 1.0

Ball Size 20

Break it

Delete the background() call inside draw(). Let the sketch run for a few seconds. What accumulates on the canvas? Put it back. What does background() actually do every frame?

Sketch State

Where is the code? These are the variables changing live in the sketch.

Try / Notice / Remix

Use the same prompt structure we want across the whole CC Fest library.

Try this

Set Speed X to 3.5, Speed Y to -1.5, then turn the path on and watch the travel pattern change.

Notice this

When the circle reaches an edge, the speed flips sign. That single change in a variable creates the bounce.

Remix this

Change the circle color based on speed, or make the ball grow a little each time it hits a wall.