All you have to do is to add a background (which is what most people will say, which is the case), but on the other screens, it will have the same problem, so I will go more in-depth about how to fix such issues.
#1. Make a global variable on the top. You can name the values or strings whatever, but I will use the ones I used.
var stage = "start"
#2. In the functions, make it change the stage.
For example,
function win() {
stage = "win";
//^^^^^^^^^^^^^^
background("skyblue");
noStroke();
var cloudL = createSprite(95, 50);
cloudL.setAnimation("cloud_1");
cloudL.scale = 0.5;
var cloudR = createSprite(285, 65);
cloudR.setAnimation ("cloud_1");
cloudR.scale = 0.75;
}
function startGame() {
stage = "game";
//^^^^^^^^^^^^^^^
topB.velocityX = -2;
topS.velocityX = -3;
bottomB.velocityX = -2;
bottomS.velocityX = -3;
}
#3. You make an if statement for each of the values.
if (stage == "start") {
} else if (stage == "game") {
} else if (stage == "win") {
}
#4. Then you put the executed code in each if statement, for this situation, you use background(); and pick the desired colors.
#5. It should look somewhat like this.
if (stage == "start") {
background("white");
} else if (stage == "game") {
background("midnightblue");
} else if (stage == "win") {
background("skyblue");
}
#6. For the problem of the grass not appearing on the win screen, we will move the code in the win function for making the grass here.
if (stage == "start") {
background("white");
} else if (stage == "game") {
background("midnightblue");
} else if (stage == "win") {
background("skyblue");
fill("green");
rect(0, 286, 400, 400);
}
If you did not understand some of the parts, here is the code: Game Lab - Code.org
I have marked it with “-”, so that you can see the changes I have made.
I hope your student does well and that you and your student have learned something new!
Sincerely, pluto 