https://editor.p5js.org/zihuanyang666/sketches/A6Bu_J8E9

Moving Balloons

I divided my sketch into separate jobs: preparing the canvas, drawing the sky, updating the balloons’ position, and drawing the balloons. setup() and draw() only call these functions, making the program’s sequence easier to read.

My reusable function is drawBalloon(x, y, balloonSize, balloonColor). I call it three times with different positions, sizes, and colors to create three different balloons.

If I comment out moveBalloons(), the balloons’ position stops updating. If I comment out drawBalloons(), the balloons are no longer drawn. If I comment out drawSky(), the previous frame is no longer cleared, so the moving balloons leave trails.