Skip to content

Please update your browser

Your browser version is not supported by this site. CS First may not work properly. Learn more

arrow_back Add a Title Screen

Transcript

In this add-on, you will design and program a title screen that will appear at the start of your story.

Remember to use your creativity to customize the design and code of your project.

Check out these projects created by other CS First computer scientists just like you!

Watch this video to learn how to do it, then try it on your own.

To start, click “paint new backdrop.” This button creates a new, blank backdrop that will become your title screen. It’s important to call the new backdrop by a descriptive name, like “Title Screen,” so you can easily code with it later.

To make the title, click the “text” tool, then click a little left of the center of the backdrop and type a title. A good title does two things: 1) It hints at what’s in the story. 2) It grabs the audience.

This story uses a simple title: “Just Friends.” Tinker with the color and font until you like the result. To resize the title, click away from it, then drag the corners. You can also use the select tool to highlight and resize.

Once you’re happy with how the title looks, jazz up the backdrop using the line and shape tools.

To delete a section, box it using the select tool, and press the delete key on the keyboard. If you make a mistake, that’s okay! Undo mistakes using the “undo” button.

This title looks pretty plain, but you can make yours as simple or as wild as you like! Next, you need to make the title screen appear at the start of your story. Click the scripts tab. Notice that the stage is still selected. In Scratch, code can be written for both sprites and the stage.

There’s no code here because you haven’t written code for the stage yet.

To make the title screen appear at the start of the story, add a “when flag clicked” event and a “switch backdrop to” block. Change the value to “Title Screen.” If you didn’t rename the title screen in the previous steps, it will still be called “backdrop2.”

Now, click the flag to try it out!

Oh no! It’s kind of a mess! The Title Screen shows, but the story starts without switching to the story backdrop.

To fix this, add a “wait” block, and change the value to something short, like 3 seconds.

Then, add a “switch backdrop to” block, and change the value to the name of your story’s original backdrop.

Try it now!

Cool, it works!

Tinker with the value in the “wait” block to show the title slide for as long as you like.

Finally, the characters’ code should not run until after the title screen shows. The title screen shows for three seconds in this program, so the example places a “wait for 3 seconds” block before each character’s dialogue.

Great! Now, it’s your turn! 1) Paint a new backdrop and use the text tool to write a title. 2) Program the backdrop to change when the flag is clicked. 3) Use “wait” and “change backdrop to” blocks to switch backdrops again. 4) Finally, add wait blocks before each character’s dialogue so they start talking at the right time.

Choose an Add-On
Add a Title Screen
In this add-on, you will design and program a title screen that will appear at the start of your story.
Costume Animation (Part 1 of 2)
This add-on will show you how to animate your characters using costumes and some new “looks” blocks.
Costume Animation (Part 2 of 2)
This add-on will show you how to animate your characters using costumes and some new “looks” blocks.
Adding Motion (challenge)
In this add-on, you'll be introduced to the "glide" block, which you can then use to add motion to your story.
Add a Third Character
In this add-on, you'll add a third sprite to your story using a "broadcast" block.
Add a Second Scene to your Story (challenge)
In this add-on, you’ll learn how to add a second scene to your story, then you’ll program the dialogue in that scene on your own.
arrow_backward Back
Next arrow_forward
Instructions
  1. Choose an Add-On, and click "watch" to learn how to build it.
  2. Once you finish one Add-On, try another one below the video!