Start Screen for Games

CS Discoveries Unit and Lesson Discussion
1

I would like my students to create a start screen or direction screen for their games in Lesson 22, however we are stuck on how to do this. Did we miss this in a Lesson somewhere? Can someone at least point me in the right direction where to go back and look. Or try to explain it here.

Thanks!

2

Here is one way to look at it.
Hopefully it makes some sense.

//create all of your sprites but make only the ones you need for the start screen visible. 
// you can either make the x and y value of the sprite such that the will not appear on the screen
// or set visible = false 

//this var will tell us what screen to draw
var screen = "start" ;

function draw()
{
  
  if(screen == "start")
  {
   //This condition will be true at the start and here is where all of the code to draw the start screen 
   //is put. 
  //We also need a mechanism to change the value of screen to "playing". 
 //This could be a timer var reaching a certain value or a MousePressedOver(sprite) function as a 
 //condition to an if statement.  
 }

  else if(screen == "playing")
 {
     //here is all of the code for when the game is playing
    //we will have to first, hide all of the sprites that we don't want to see from the "start" screen again 
   //either by moving them off the screen  sprite.x  = 500 or by setting sprite.visible = false ;
 }

 else
 {
     //This could be where the end game screen code is.
 }

}//end of the draw function.
3

Hi Sarah,

I’m working on something that might be relevant to you, and I’ll send you a private message about it. It’s not something we’re ready to publish, but if you’d like to take a look at it knowing that it could change under your feet, you can give it a try.

Elizabeth

1 Like
4

That would be great!

5

Elizabeth,
I am also working with my students on the start screen. Has your tutorial been published yet?
Thank you.

6

yes, this would be a nice step to include in the lesson.

7

Good morning Elizabeth! I am reaching out because is preparation for teaching this fall, I wanted to have my kids build elaborate video games that include different screens. Would you mind sharing the information that you talked about with me?

I would really appreciate it!

8

See if this template helps and feel free to reach out with any questions or thoughts.

1 Like
9

Sorry if this is old, but you do not the visibility value to be changed, the sprites will overlap each other.
Also if you want custom made sprites (the ones that you create) here is an example (if you need it)

var stage = "menu"
var sprite = createSprite(200, 200);
sprite.setAnimation("sprite");

var screenOne = createGroup();
screenOne.add(sprite);

function draw () {
 if (stage == "menu") {
  background("white");
  drawSprites(screenOne)
 }
}
10

Hello, Elizabeth!
I am working on Unit 3 now and will be doing it again in the fall. If you have something relevant that would help students make start screens for their games, can you please share? Thanks!

11

@coffeyh,

I don’t believe that Elizabeth is with Code.org anymore. At any rate, the message earlier in this thread is good advice for creating starting screens. If you haven’t taken a look at it, you may want to. If you have and it doesn’t make sense, please reach. back out so we can help clarify.

Good luck!

Mike