6.04 Build and Test
Now, it’s time to build your book. Start small, and add more to your project if you have time.
Tip: Remember to test your project each time you add something. It is much easier to find and fix bugs before you make more changes.
For each page 📃
Add the backdrop and new sprites you need for this page.
You will need to add code to set the positions and visibility of sprites on the first title page and each page after that.
When you are creating a book, animation, presentation, or game with levels, some sprites should only show on some backdrops.
Show and hide sprites on different backdrops: See inside
Click on the Stage or press the Space key to switch to the next backdrop.
There are two ways to position your sprites into layers.
You can drag a sprite on the Stage to move it to the front layer:
For each sprite 🐈 🐢 🎈
You will need to add code to each character and object sprite in your book. Consider whether they will do anything when the project starts, when the backdrop switches to a particular page or when the sprite is clicked.
Turning the page 📖
You will need a way for your reader to move to the next page in your book.
You can use backdrops in a Scratch project to create different pages or levels.
Changing backdrop tutorial: See inside
Click on the Stage pane and then the Backdrops tab to view the backdrops for your project. You can drag the backdrops to reorder them.
Edit costumes 🦁 and backdrops 🖼️
You may want to edit or add costumes or backdrops in the Paint editor.
Go to the Choose a Backdrop menu and click on Paint:
You will be taken to the Paint editor, where the new backdrop will be highlighted in the list. If you have other backdrops in your project, you will also see them in the list.
To set the main colour of the backdrop, click on the Rectangle tool, then use the Fill colour chooser to select a colour, then drag the shape over the full backdrop canvas:
If you want to add more details to your backdrop, you can use the Rectangle tool, Circle tool, or Brush tool, or a combination of all three!
When you have finished, make sure that you give your new backdrop a name that makes sense:
Your new backdrop will be shown on the Stage and will be available to use in Looks blocks.
You can create backdrops and costumes for sprites in the Paint editor, using just shapes.
Go to the Choose a Sprite or Choose a Backdrop menu and choose the Paint option:
Select which tool(s) to use to make the shape(s) that you want:
- Circle: Click on the Circle tool to draw a circle. Press and hold the Shift key on your keyboard to draw a perfect circle.
- Rectangle: Click on the Rectangle tool to draw a rectangle. Press and hold the Shift key to draw a square.
- Triangle: Use the Rectangle tool to draw a rectangle or a square. Click on the Reshape tool and select the corner that you want to remove. Click on the Delete tool to turn your shape into a triangle.
You can use the Fill tool to change the colour of a shape:
You may need to use the Forward and Backward tools to move your shapes forward or backward so that they are positioned correctly within your image:
You can select all the shapes and Group them together so that you can adjust them or move them as one shape:
Here is an example of a sprite created with the Circle and Rectangle tools:
Pig: See inside
Remember to name the costumes and backdrops that you create in the Paint editor.
Click on the Fill colour chooser and select the colour that you want for your text:
Select the Text tool:
Click on the Paint editor and start typing.
Click on the Font drop-down menu and select the font that you want:
If you want to resize your text, click on the Select (Arrow) tool and select the text, then drag the corner handles to resize the text:
If you want to change the Fill colour of your text, use the Fill colour chooser to select a colour, then select the Fill (Bucket) tool and hold your mouse cursor over the text (or if you are using a tablet, tap the text). The text will automatically change colour. Click on the text to make the change:
If you want each word in a message to be a different colour, size, and font, follow the process above for each word in your message.
Position your text and/or group of words with the crosshair in the centre of the Paint editor:
To layer your words, use the Forward and Backward tools:
Click on the Costumes tab for your sprite.
Tip: Duplicate the costume that you want to edit — so that you can still use the original costume if you need to. To do this, right-click (or on a tablet, tap and hold) on the costume and choose duplicate. You will now have a copy of the costume:
To remove any part of the costume that you do not need any more, click on the part to select it, then click on Delete:
The duplicated costume with parts removed should look something like this:
Tip: If you make a mistake in the Paint editor, you can click on Undo:
Go to the costume with the part that you want to add and click on the part that you need, then click on Copy:
If you want to add a part from a costume that is not already shown in the Costumes tab, you need to add the costume to your sprite first. Click on the Choose a Costume icon, then find the costume that you want and click on it to add it to your sprite:
When you have copied the part that you need, go back to the duplicated costume and click on Paste. The duplicated costume should now look something like this:
Now, switch to the Code tab. You will be able to use the new costume in your code blocks:
Click on the Costumes tab and then on Choose a Costume to add any costume to the sprite from the Costume Library:
You will need to position and resize the added costume in the Paint editor, to match the sprite’s other costumes.
Tip: If you position a sprite on the Stage and then change its costume, the sprite might appear to ‘jump’ or change size. You will need to position and resize the costumes in the Paint editor so that they all appear in the right position on the Stage.
Add sound 🎵
Select the sprite that you want to have the new sound, then select the Sounds tab. Each sprite starts with a default sound:
Scratch has a library of sounds that you can add to your sprites. Click on the Choose a Sound icon to open the Sound Library:
To play a sound, hold your mouse cursor (or your finger, if you are using a tablet) over the Play icon:
Click on any sound to add it to your sprite. You will be taken straight back to the Sounds tab and you will be able to see the sound that you have just added:
If you switch to the Code tab and look at the Sound blocks menu, you will be able to select the new sound:
Tip: You can also add sounds to the Stage.
Select the sprite that you want to have the new recorded sound, then select the Sounds tab:
Go to the Choose a Sound menu and select the Record option:
When you are ready, click the Record button to start recording your sound:
Click the Stop recording button to stop recording your sound:
Your new recording will be shown. You can Re-record your sound if you are not happy with it.
Drag the orange circles to crop your sound; the part of the sound with a blue background (between the orange circles) will be the part that is kept:
When you are happy with your recording, click the Save button. You will be taken straight back to the Sounds tab and you will be able to see the sound that you have just added:
If you switch to the Code tab and look at the Sound blocks menu, you will be able to select the new sound:
Pico and Giga talk with the speech extension: See inside
Click on Add Extension:
Choose Text to Speech:
You will get a new Text to Speech blocks menu:
Scratch editor reminders
You can copy code from one sprite to another sprite in the Sprite list:
Both sprites will have the code blocks that you have copied. If you are moving the code from one sprite to the other, you can delete the code from the first sprite after you have copied it to the other sprite.
To run your project in full-screen mode in Scratch, go to the area above the Stage and click on the icon with four arrows that point outwards. This is the Full Screen Control icon:
To exit full-screen mode, click on the Full Screen Control icon again. It will have four arrows that point inwards.
Right-click (or on a tablet, tap and hold) on your first sprite in the Sprite list below the Stage:
Select duplicate. This will create a copy of your first sprite, with the suffix “2”:
Rename your sprite:
Your sprite’s name will change in the Sprite list:
Your second sprite has exactly the same code as your first sprite. Do not run the program until you have started to change the second sprite’s code — you might not see the second sprite because it might be positioned underneath the first sprite.
Test: 🔄 Show someone else your project and ask for 🗣️ their feedback. Do you want to make any changes to your book?
⏱️ If you have time, you can upgrade your project.
💡 You could:
- Add more code to your sprites
- Add another sprite
- Add another page
- Record a sound
- Create a new costume in the Paint editor
Debug: 🐞 You might find some bugs in your project that you need to fix. Here are some common bugs:
You might find a bug that is not listed here. Can you work out how to fix it?
🗣️ We love hearing about your bugs and how you fixed them. Use the Send feedback button at the bottom of this page and tell us if you found a different bug in your project.