Why-First: Teach Kids Coding That Actually Clicks

1. Coding Course Introduction: Picture this. You design your own unique car from scratch that can fly and time travel. You can visit the dinosaurs, participate in medieval tournaments, and race in futuristic hove car rallies. This might sound like a bit of a crazy dream. But in this course, you will not only turn these dreams into actual games, but gain one of the most valuable skills. Programming. Hi. My name is Craig, and I will be your guide on this exciting journey. I've been a professor for 30 years, and in this time, I've had the privilege of teaching thousands of students just like you, how to program and build awesome games. So, what will you? You'll be developing five exciting projects, starting with a simple bug catcher game through to more exciting soccer and racing games and ending with a cool arcade ski adventure game. Let's get one thing straight. This is definitely no ordinary course. This is an exciting adventure. You'll be engaged, creating your own games, making your own apps, and solving your own problems. What if I get stuck? Well, firstly, we don't think you will because we develop your skills slowly, so you never feel lost. And as a bonus, we will be your personal guys to support you every step of the way. So, who's this course for? Well, if you're a parent who wants to give your kid the best possible start in their programming journey, this course is for you, or even if you are a complete beginner and really want to learn how to code in an easy to understand and engaging way, then this course is for you. So, if you want to learn to create fun games, cool apps, exciting animations, and much more, you are at the right place. So what are you waiting for? Join us on the ultimate coding adventure where we will turn those crazy dreams into playable games. 2. The Tool We Will Use & Setting Up Your Account: Okay, this is it. Let's get a look at the tool that we'll be using to create our awesome projects are learning to code. If you haven't already done so, go to the website scratch.it.eu. This is where all the action is going to happen. And because this is the first section of the course, I'm going to keep my happy smiling face in the corner of the screen because I want you to know that we are real humans on the other side of the computer teaching you, not just some bot. However, as we progress and get into the sun action parts where you will learn how to build some really awesome games, I'll hide my face. So we really want you to focus on the programming without distractions. But don't worry because we are always here and ready to help you. But with that, let's get go. Firstly, let's take a moment to understand what scratch is. Essentially, scratch is a programming language that has been specially designed for young coders and people who just want to get started learning to code. Like you. It basically takes the complex syntax and text from text based languages and turns it into an easy to understand code blocks that makes programming engaging interactive and fun. You know how you can build all kinds of amazing things with lego blocks. Right? You can create buildings, vehicles, and even entire worlds. So just like lego blocks, scratch provides you with colorful coding blocks, but you can snap together to build your very own digital creations like games, animations, interactive stories, and much more. And just like you don't need to be an architect or an engineer to have Fongo, you don't need any previous coding experience to start creating with scratch. It is really designed to be easy to understand. So you can focus on being creative and learning the logic of programming and how to think like a programmer, which is the most important skill. And the best part is you can achieve all this without ever getting bogged down by complex coding syntax. So it's an awesome way to get to know what programming is all about and start your coding adventure. So, first things first, open up the scratch website if you haven't done already. And I'm going to recommend that you use Chrome as your browser as you continue. A scratch just works better with Chrome compared to other browsers. So, if this is your first time going on to scratch, your screen should look something like mine. If you scroll down, you'll see a bunch of cool projects that people like you have been creating, which we will explore later. At the top here, you'll see we have different options. The first one is to create a project, which we'll be doing a lot of. There is the Explore tab, and this is where you will find more fun games developed by people using scratch, and this is where people will be able to find projects you create as well. Moving over, there is an ideas tab, which has some fun ideas for projects for you to create in the future. And finally, the about section is everything. Well, about scratch. Okay, with that all said, we can create our scratch account. Now, this is important, as it will make sure we can save our projects and not lose our progress. So all you need to do here is click Join Scratch. And as you can see, it asks you for a username and a password. This can be anything you like, but do make sure it's not your real name as it says here. We will just call our name click. And then the password can be whatever you like. Just make sure that you remember it. After this, it asks what country you live in. So now you get to scroll through this massive list to find your country. Well, I live in South Africa, so that's right near the bottom. And then it'll ask your agenda. Finally, it'll ask for an e mail. It is important to enter your e mail correctly, as this is where scratch will send a confirmation. Once you receive the confirmation e mail, you can click the confirmation link, and you're all done. Your brand new scratch account is created, and we're ready to get go. So your term, get your scratch account set up, and I will see you in the next lesson as we explore the scratch interface. 3. Welcome to the World of Coding with Scratch!: So, this is the moment you have been waiting for. It's time to create our first project. To make a new project, all you need to do is click the big create button at the top of the page. And this creates a brand new project for you and takes you to the scratch project editor where all the awesome stuff happens. Now, we're in the place where the action happens, let's take a tour so you can get a quick understanding of how it all works. So, this whole area that we're in at the moment is called the editor, and this is where you can design and code your project. It's basically where you will create anything you can imagine. The scratch editor has four main parts, the stage, the sprites, the code blocks, and the scripts. Let me explain what each part does. All right. Let's first talk about the stage area. You'll find it on the far right of your screen. The stage is where all the fun stuff happens. Just like a stage in a theater. This is where you see the action. As you create your project, everything you make will appear right here. It's the special space where you can see and build your amazing project. Now, looking down from the stage, you'll see this area here where you can choose the background of the stage. Currently, we just have this boring plain background selected. But if you click on this little button on the bottom right, you can choose a new backdrop, plus add sounds and music to the stage, but we'll explore all that in a future lesson. A scratch sprite is the character that your scratch code controls. For example, you may write some code to make your sprite move around or talk. These sprites can be all sorts of things ranging from people to animals to objects. And just like with backdrops for the stage, you can choose from loads of pre made sprites, or even draw your very own unique wins. Plus, you can even upload sprites from your computer, which we'll be doing in future lessons. Next are the code blocks. These are the instructions that you can use to make your sprites do things. It's just like real world programming. But instead of typing out complex lines of text, you use these blocks. But essentially, you're doing the same thing, you're coding. There are different categories of blocks, such as motion, looks, sound, events, control, and many more. Each category represents a different aspect of programming, helping you to build a complete and interactive project. To use these code blocks, simply drag and drop them from the block palette into the script area. And as you put the blocks together, you will start to see your project come to life. And speaking of the script area, this is the last major area we must discuss. This is where we put blocks together in a special order that tells your sprites what to do. You can connect code blocks together by snapping them like puzzle pieces. Just as a quick example, I will bring this move ten steps block onto my window. Here, as you can see, if I click it, my CT sprite moves forward on the screen. And lastly, if you look to the very top, you will see that there are these different tabs for costumes and sounds. Now, these are also very important spaces that will help us create stunning projects, but we will get into that later on. But for now, that's a quick overview of the scratch interface and how it works. Encourage you to play around and check out things for yourself because that's where the learning happens in the doing. I look forward to seeing you in the next lesson where we will start to see what all this code does. 4. Getting Your Feet Wet: The Scratch Interface: Well, I hope you had a bit of fun playing around with the sprites and the code blocks, because in this lesson, we're going to be exploring some of the code blocks together. So let's begin with an important what is code. Code is basically just a set of instructions for a computer. You see, computers actually aren't very clever. Well, they aren't very clever at figuring out what you mean like humans are. They need very clear and specific instructions, step by step in order to do what we want them to do. Imagine you're telling someone how to make a sandwich. For a human, you might just say, please make me a peanut butter and jelly sandwich. But for a computer, you would have to be much more specific like. Take one slice of bread and place it on a plate. Take the jar of peanut butter and open it. Insert a knife, and after getting some peanut butter, use the knife to spread it evenly on the bread. Then take the jar of jelly, use a spoon to scoop some onto the other slice of bread. Place the slice of bread on top of the peanut butter, and so on. You get the idea. Another example is if we could look at the sprite we have. Let's say we want it to walk to the end of the screen. The computer will not understand what we mean if we just say walk to the end of the screen. However, what we can tell it is to move ten steps. As you can see, the cat moves forward ten steps, but still it's not actually walking, it's just moving. Okay, so what we can also do is change to the next costume. Now, if we click this, we can see that it looks like it is walking. Now we're getting somewhere. But still, it isn't walking to the end of the screen. So what we could then do is grab this repeat block. Put it over these blocks, and now it will basically repeat all the code ten times. Now if we click it, we can see it moves a lot further, but still not to the end of the screen. So I can change the steps 10-50. Okay, now, there we have it. A cat successfully walking to the other side of the screen. So as you can see, while computers are incredibly powerful and can do amazing things, they need very precise and specific instructions in order to make them work because computers will do exactly what you tell them to do and nothing more. But ready yourself now, because for the next lesson, we will be officially coding. 5. The ABCs of Coding: What is Code?: Well, this is the moment you have been waiting for. It's time to code and create some of our first scripts. Well, technically, we have already created our first script as we did in the previous lesson. But this time, it'll be better. But before we do, you might be asking yourself, well, what, even is a script. The short answer is a script is just blocks of code that are connected together that tell our Sprite what to do. Like I described earlier, it's instructions for the computer. So just as we have seen, one block of code is just a block of code. But when we combine it, we get amazing things to happen like the script, which gets our cat to walk to the end of the screen. However, there is one key piece of the puzzle we are missing before we can officially call our code blocks a script, and the key piece is located under the events group. It's this when the flag is clicked. You will see now that we can drag this code block to the start of our walking script. And now, when we click this green flag, a script plays. No need to manually click on it. But that is just the beginning because you are not a programmer yet. There is still one thing you need to do. It's pretty much a right of passage. Once you've done this, you can officially call yourself a programmer, tell your friends, you're a programmer, tell your dog you're a programmer, whoever you want to tell. So move down to the Lux Code group, drag in the s and connect it to when the flag clicked. Now, for the most important step, are you ready type in hello world. Okay. Done. Now, click Play. Here, you have it. Hello World. You've created the most classic iconic first program of all time. You are now officially a programmer. No one else can tell you otherwise. So with that out of the way, let's make cool scripts and play with some of the blocks. Once again, I am going to drag in this W flag click block. And this time, I'm going to go up to motions and play with some of the code here. Let's try W flag click. Move ten steps and turn 15 degrees. Now, when we click the flag, our cat moves, the turns, and it says, Hello World. That's pretty cool. But before we carry on, I don't know if you notice, but our cat is doing a lot more turning and a lot less moving. So, how can we fix this? Well, before I just go ahead and fix it, I want you to try and fix it. Remember, learning happens in the doing. So try to see if you can get this cat to move more, then turn. I'll be waiting. Pause the video and give it a try. Well, I hope you figured it out, but even if you didn't, that's no problem. So if you remember from earlier, we changed what our cat said simply by clicking on this texture and typing in our new words. And we can do the same thing for a movement and really everything else in scratch. This is a very important thing to remember. Almost all of the code blocks in scratch are customizable, and they allow us to change their values. Just scrolling down, you can see how I could change what costume is selected or what sound gets played. This really gives us a lot more control on what happens. So, for our problem of moving more, all I have to do is change it to 20 steps. Now, as you can see, when we click the flag, our cat moves in a much wider circle. But let's not stop there. Let's bring in some other cool code blocks. Let's bring in this go to random position. And I hope you can guess what this does. Well, moving it onto our script. You can see that our cat jumps around the screen, moving in pretty different positions. Pretty cool. But let's try something better. How about this glide to a random position. What I'll do here is disconnect this script from when start click and connect this new block in. This way, this script won't run. But now, as you can see, when we click the flag, the cat glides to random positions on the screen, which is pretty neat. But the only annoying thing is how we have to keep clicking this flag. Instead of doing that, we could bring in this repeat block, like we did earlier and put this code inside the block. This way, the code will repeat ten times. Now, even when we click it again, our cat automatically runs around the screen. Now, although it's a bit slow, so what we could do is change the number of seconds from 120.2. Now, that's what I'm talking about. OCT zooms around the screen. Although our cat does eventually stop. So how can we make it go on forever, or at least until we click the stop button? Any ideas? You see if you can figure out how to make the cat keep on moving forever. That's a clue. Pause the video and see if you can do it. Well, I hope you figure this one out, because to make our cat keep on moving around, all we have to do is use the forever loop. And basically, any code that is in this loop will repeat forever. Cool. So switching it out and pressing play again. You can see that our cat just continually moves around the screen like a crazy thing. Okay. Now instead of having our cat just move around randomly. What if we want it to follow our mouse? That would be fun. You get it? Cat and mouse? Okay. Yeah, yeah. Pretty funny. Right. To make the cat chase the mouse, we can bring in this go to code block and change it from a random position to a mouse pointer. However, if we click Play, you'll see nothing really happens. Our cat just kind of moves to the corner of our screen. But I want you to think about this now. Why is our cat just moving to the edge of the screen? Why is it not following the mouse? I want you to fix this code and tell me when you're done. Of course, I won't be able to hear you. It's a computer screen you're talking to. And I'm not to the explorer. But let me know when you're done anyways. Clue. The solution is linked to a code block we just looked at. So, pause this and give it a go. Fixed it? Cool. Or if you didn't, that's also cool. As long as you tried. Throughout our lessons, I will always give you opportunities to try and do things before I show you. Remember that learning, what happens in the trying. So always try even if you don't get it right. But basically, what's happening here is our sprite is going to our mouse. But it only does it once, and it only does it when we click our green flag. So to fix this, all we need to do is put the Go to Mouse code block in a fevolu. And this time, we click Play, and you'll see it works. And it's pretty cool. As you can see, it doesn't matter how fast they move the mouse, the cat will always keep up. And this works because our sprite is forever going to our mouse pointer, not just when we click Play. Okay, let's try one more script before we wrap up this lesson. Let's grab this point towards block here. And I'm guessing you have an idea of what this does, because, as you can see, it has mouse point is selected, meaning our sprite will point towards our mouse. Let's also grab another code block and this time from the Looks group. Here. Let's bring in this change color effect by a 25. And like before, we'll put both these code blocks in a fre loop. That way, it doesn't just do it once. Also, we will add in this when the flag click to complete the code. Right. Let's give this a go. As you can see, our cat has turned into an RGB keyboard and is constantly pointing towards our mouse. Yeah, nice. Okay, that's all for this lesson. We covered quite a lot, and I'm sure you learned a lot. Now, I just want you to take this moment to write some of your own script, just experiment with different code blocks and see what they do, and I'll see you in the next lesson. So have some fun. 6. Bringing Ideas to Life: Creating Your First Scripts: I hope you had some fun playing around with some of the code blocks, so let's continue our learning journey and see what else we can do. But before we move on and build some awesome games and apps and animations, we first need to talk about what all these groups of code blocks are and what their purposes. Because if we can properly understand what each group does from the start, you'll find it much easier to create your own code. As we've seen, all the blocks and scratch are organized into different groups. As you can see, all these are blue, these are purple, these are pink and so on. Basically, each of these are grouped by what they do, and they represent different aspects of programming. So let's go through each of the groups to understand their purpose and also see some of the fun things that they can do. Firstly, all these blue blocks are to do with motion and moving your sprite around the screen. And we've been playing quite a bit with this group of code. So I'm sure you have a pretty good idea of what it's all about. But there is a bunch more you can do here using motion blocks. But moving on. Yeah, yeah. There's many to be funny. The next group is Los. And this is all about. Yeah, well, you guessed it. Looks. So let's have a look. We have also tried out some of the code blocks like switching the costumes, saying different words, or even changing the color. But there's still a lot more we can do like change the size and make the cat bigger or make it hide or show and lots more. But basically, all you need to know is that the looks group is all to do with looks, and we will often use this when we want to create fancy graphics and animations which you will see later on. Moving down, we have sounds, and I'm sure you can guess what this is about. Here, we can have our sprites make specific sounds. So with our cat, we can have make this M sound. And we can also change the pitch as you can see. And yes, it does start to get a bit crazy. Okay. Moving down, our next group is called events. And you might not be too sure what this group is about. However, this is very important group of code blocks because it allows us to automatically play our scripts when a certain event happens. So far, we have used the W flag clicked event, which basically starts our code scripts when this green flag is clicked. And you'll see how useful this is when we have lots of sprites. But as you can see, there are other events like when Space clicked. This will only start the script when the space bar is clicked. Or this event starts the script when the sprite is clicked or when I receive a message. These events all do the same thing. Instead of waiting for us to click the green flag to play our code, they will wait for something else to happen. And this allows us to control when code should start. Now, you will really get to know how this all works when we make some more advanced applications later. But with that, we can move to our next group of code, which is control. All the blocks in here are used to control our code, which basically means they help us manage the flow and structure of our scripts, kind of like how traffic lights help direct cars at busy intersections. For example, we have blocks for creating loops, which let us repeat sections of code a specific number of times or even forever. Just like we did earlier to get our cat to walk to the end of the screen or constantly follow our mouse pointer. We also have conditional statements like if then and if then ls blocks, which allow sprites to make decisions based on certain conditions being met. Similar to how you might choose to wear a coat, if it's raining or wear sunglasses, if it's sunny outside. There is also this block here, which waits. Moving this into our script, you will notice how now when I click the flag, it waits for 1 second before it plays the script. This is also an important thing to know. So play close attention. When we run one of our scripts like this one, for example, the code runs in a top down order. So we can look at it logically when we click the flag, it will first wait for 1 second, and this is the first block of code. Then it will change color by 25 and then point towards the mouse pointer, and of course, this will forever loop this code here. But if you play the script, it does seem like it is both these code blocks are running at the same time. And this is because computers are so fast that you can't even notice this is happening in order. But let's add some weight blocks to see in action. So dragging in our wait 1 second here and another here before I run the code, can you guess? What's going to do? Think guess what will the weights do? We click the flag. It waits for 1 second. It changes color, waits for another second, points towards the mouse, waits for another second, then it goes back to changing the color and so on. So playing this program, you can see how it does exactly what we predicted and how it happens in the order we specified. And as we move on, you'll see how the order in which we place our code is so important. But on that topic, these control blocks give us the power to make our project smarter and more interactive by responding to different situations as they happen. And there's still a bunch more, but you will get the idea for now. Moving down to the next group, we have sensing. And these blocks are pretty cool. Sensing blocks, let your sprites detect things like touching another sprite, mouse movement or even listening for what are user types. These blocks help your projects react to their environment. And this is very handy when we want to build interactive games. And we'll play with some of these later on when we make some fun games. Moving down again, we have operators. And this is all to do with math. Yeah, yeah, math can be boring sometimes, but I will tell you that when we are making games, we need some math to make it work, and it becomes a whole lot of fun. Operators are kind of like the tools we use to build and solve puzzles in our project. They help us do math and make comparisons, just like we do when we are figuring things out in everyday life. For example, we can add, subtract, multiplied, or divide numbers together. Find the remainder when one number is divided by another or even pick a random number. These operators also let us compare values to see if they're equal, greater than or less than one other. It's like when you're playing a card game, and you need to figure out who has the highest card, we use comparisons to decide who wins. And not just numbers. We can even combine text, also known as strings to create sentences or make our sprite say pretty funny things. So, operators give us a whole bunch of cool tools to work with when we're creating our games and projects in scratch. And they'll help us make our projects more dynamic and interactive. And finally, we have variables. Variables are like little storage boxes for information that we can use in our projects. Imagine you're playing a game and you have a score. Where would you keep track of that score? You got it in a variable. In scratch, we can create our very own variables to store and keep track of different values like scores, lives or even a player's name. We can change these values by adding, subtracting, setting, or even showing and hiding the variable on the screen. Just like in the real world, we use notes to remember important information that we might need later on. In scratch and programming, we use variables. For example, let's say you're making a game, where a character collects coins. Each time they collect a coin, you'd want to increase this score by one. You could use a variable to store the players score and then add one to it every time they pick up a coin. Variables are super helpful in making our games and projects more engaging, interactive and fun plus, they help us keep track of important information as our projects get more complex. Looking down again, you will see there is one more area called My blocks. And as you can see, there is nothing here at the moment, but we will look at using the special code block in more advanced lessons. Anyway, that's about it. In this lesson, you really gained a good basic understanding of how all these blocks work together to form complex scripts that can help us make awesome games. We also looked at how our code goes in order from top to bottom. And also always test some of the blocks now for yourself and see if you can get something fun going on by creating some of your own cool scripts, and I'll see you in the next lesson as we continue our learning journey. 7. A Closer Look: Discovering Scratch Blocks: So, we've gone over all the different co drives, all the different areas like the stage, our sprites and a bunch more. At this stage, you have a really good understanding of all the areas, but there are a few things we have not covered yet. And in order to give you a full understanding of how this whole scratch environment works, in this lesson, we will do just that. And I think the best way to do this is by going from the left side of the screen to the right side of the screen to make sure we cover everything. So, firstly, starting at the top left of our screen. We have code. And you know what this is all about. It's our code. But moving just a bit to the right, you will see we have costumes. Now, we haven't talked about this yet, but every sprite that we have in our program can have as many costumes as you like. And all these costumes are specific to that sprite. So remember how we made our cat walk across the screen by adding the code next costume. Well, that uses these two costumes to create the walking effect. And the cool part here is that scratch gives you so much control to create new costumes and edit the ones that you have. Like, for example, I could go to the second costume for the sprite, click on the tail here and just rotate it down a bit. Then let's activate the walking script again. Now you'll see how the cats tail moves when it walks as well. But it hasn't stopped there. We could also import new costumes, either from Scratch's library, upload our own, or even draw our own custom costume, which is where your artistic skills will come into play. Anyway, you'll understand how these costumes work when we build our own in our games and animations in future lessons. Moving one tab over here you can see we have sounds. And this is quite similar to costumes except here you can see this cat sprite comes pre installed with this Mo sound, which we used earlier. And again, you can upload your own sounds or choose from some of the sounds that are available on scratch. You can add a lot more depth to our character and objects in our program using sound. Now, one more thing to know about costumes and sound is that both of them are controlled by these two groups of code. So the Looks code group can control our costumes, and the sound group can control our sounds for our sprite. Let's keep moving to the side. Here, we have our script editor, where all our code goes, and you know all about that. Then we have our green flag and our stop button. Moving across, we have these buttons here, which allow you to change the layout of our interface. But I think this layout is pretty good at the moment and the best, so we'll leave that. And at the edge, there is a full screen button, so we can see our program in all its glory. Moving down, we have our code view, which you also know about. It's where the action happens. And then down again, we have this area, which we have not yet discussed. Firstly, we can change the name of our sprite. So instead of being sprite one, we can call it CT. And moving across, you can see, we have these x and y inputs. And this is an important concept. So play close attention. X and y coordinates are like the positions for everything that happens on the scratch stage. This helps us know where things are and how to move them around. Like, imagine a giant grid covering the entire scratch stage with horizontal lines and vertical lines crossing each other. The grid is made up of x and y coordinates. The x coordinate represents the horizontal position or the left and right position of the sprite on the stage, and the y coordinate represents the vertical position or the up and down of the sprite on the stage. Now, let's think of it like a treasure map. The x and y coordinates are like the instructions on how many steps to take in each direction to find the treasure. If we were told to take ten steps right and five steps up, we'd move ten steps along the x axis and five steps along the y axis. In scratch, the stage has its own coordinate system with zero x and zero y being the center point. The x coordinates range from minus 24240 while the y coordinates range from minus one 80 to one 80. When you want to move a sprite to a specific spot on the stage, you simply set its x and y coordinates. For example, let's say we want to move our CT sprite to the top right corner of the stage. We would then set the x coordinate to 240 and the y coordinate to one 80. You can also use the motion blocks in scratch, like go to x 240 and y one 80 or change y by minus five to move your sprites around the stage using x and y coordinates. Understanding x and y coordinates is important for creating smooth animations and exciting games, as it helps us position our sprites exactly where we want them on the stage. And that is why they are so important. Okay, moving down again, you can see we have the ability to show and hide our sprite, and this is something we could also do with code under the section. And moving across, we can change the size and direction of the sprite is pointing, which we can also do under the Looks Code group. Okay, moving down again. I think there's just one more thing we need to know, and that's adding new sprites. In scratch, you can have as many sprites as you want. And just like with costumes, you can use the sprites that come with scratch. You can upload your own or even create your own shapes and drawings. Anyway, let's imagine we wanted to create a game where a dog chases a cat, and you have to control the cat to run away. Here, we could add a new sprite, and we can search for dog, and let's choose this one here. And there you have it, a brand new sprite. And as you can see, it doesn't have any code in it because each sprite has its own code to control it. And also, like a cat sprite, this one comes with different costumes and sounds pre installed and ready for us to use. There's just one more thing, which is the backdrops, which are pretty similar to Sprites. It's basically just the background behind the sprite. So let's say our game is in the snow by clicking here. You can see we can change it to Arctic or desert. Our we can upload our own backdrop if we want or we can even draw one. Anyway, that's about it. You are now a pro at the scratch environment. But now, let's make you a pro programmer. 8. Mastering the Fundamentals: Navigating the Scratch Workspace: Well, this is it. It's time to develop our very first game. Don't worry, we'll keep it simple, but you will develop some core programming skills while making this game. As mentioned previously, the game we're going to build is quite simple, but it should be fun. Basically, we're going to have a dragonfly and a ladybug sprite as the plays, and you're going to be able to control the dragonflies movement with your arrows and the ladybug is just going to run around the screen while we try and catch it. We're also going to set the scene with a nice jungle background. Okay. Now that we know what our game is and the sprites and background we need, I want you to import the two sprites into the project and choose an appropriate backdrop. Pause this video and do that. Well, if you manage that well done. For this step, all we are doing is adding two sprites and a backdrop. For our sprite, we can just click this ad sprite button and search for dragonfly and just click it. You'll see how it added to the project. Again, we can do the same thing for the ladybug. Okay. And finally, we can add in our jungle backdrop by clicking this button instead. And if you search Jungle, you will find it right here. There you have it. The stage is set, and we have all the assets we need to make our game. Before we continue to write some code for our sprites, I just want you to think about the process we went through because when programming, a very important part is thinking about the bigger picture, which in our case is this game. After we know exactly what we want to make, we need to think about what we need to make this game. Well, here, all we need are these two sprites and a nice background. But it's all about understanding the bigger picture of what we want to do and breaking it down into smaller manageable steps. For example, Okay. Let's say you want to build a tree house in your backyard. Instead of trying to construct it all at once, you can break the project down at a smaller steps like gathering the materials, measuring and cutting wood, building the frame, adding walls and a roof, and then decorating the interior. By doing this, you can make the project more manageable and less overwhelming and ensure that you build a safe and sturdy treehouse that you can enjoy for years to come. The same is true with programming, well, pretty much everything in life. But that's it for now. We are ready to start bringing the sprites to life with code. 9. Your First Game Adventure: Crafting a Dragonfly Chase in Scratch: Okay, it's time to get coding underway, and I think the best place to start is with our dragon fly sprite, as it's the main character after all. Also, before we do anything, let's get rid of this cat that is on the screen and we don't need it for all this project. To do this, we can either simply click this delete button next to the sprite or maybe you've created some cool code for it already. You could just hide the sprite instead and you can bring it back anytime by clicking Show. But first things first, make sure that you have this sprite selected to ensure that you're coding the right thing. With that, it's time to create our first strip for the sprite. So let's think about this. In our game, we want to be able to control this dragon fly and make it go up and down left and right using our rakes. So how can we do that? So this is where you need to think like a computer and think logically. What are all the instructions that the computer needs in order to move with the arrow keys? If you're up to the challenge, pause the on and give this a go. Try to see if you can write the script that allows the sprite to move with the rakes. But if you have no clue, don't worry. I just want you to pause and give it a moment to think about it. Well, let's take a look at how we solve this with code. First things first, we'll start with the W flag click block, as this will start our script automatically when we click the flag. Now we know our dragonfly needs to move around the screen. We know we're going to need one of these blocks in the motion group. You might be thinking we should use this move ten steps code block as we used it to get our cat to walk across the screen. Yes, while we could use it to get the dragonfly to go right ten steps and left by minus ten steps, there is a problem. We can't get the dragon fly to go up and down with this. Instead of using this move block, there is something much better that you should be always using instead, and that is this change x by and change y by blocks. Now remember, how we said that our stage is seen as a grid, and our sprite can be at any point on this grid for minus two 40 x plus two 40 y minus one 80 y plus one 80 y. If we change our x position by a positive number, we essentially are moving our sprite to the right of the screen. And if it's a negative number, we are moving it to the left side of the screen. The same goes for changing y. If we change y by a positive number, we are moving our sprite up, and if we change it by negative number, we are moving our sprite down the screen. Now that we know all this, we can grab two of each change x and change y. Because remember, for each, we need one of them as a negative. Now if you click on each of these blocks, you can see how it moves our sprite around the screen, which is exactly what we want. Now we need is a way to control this with our keys instead of clicking. If you remember in our earlier lesson, we can do this with the sensing group of code. Here you'll see there is this block for checking if a key is pressed, which is exactly what we need. If we bring this out, you can see that we can swap the space for well, pretty much any key we like. Let's change it to right arrow pressed. This is all fine, but we need to connect this. To do this calls for perhaps one of the most important blocks ever it is found under control, and it is the if then block. Now remember how I said how often you will make decisions. If a certain condition is true, like it's raining outside, you will wear a raincoat. The same concept is very important in programming. Here, we want to check if a certain key is pressed, then something should happen obviously moving in a certain direction. I also want you to notice something very important about these blocks that you have been working with, which is the different shapes, like lego pieces, and they fit together in specific ways. Now, these shapes are designed to help you easily understand which blocks can connect to each other, just like how certain lego pieces can fit together. The shapes prevent you from connecting blocks that shouldn't be joined, which is helpful to avoid mistakes and keep your code working smoothly. In the world of text based coding, it's crucial to make sure your code is organized and free of errors. Basically, it'll be structured quite similarly to your scratch code. By having different block shapes and scratch, the platform guide you to create well structured and functional code, which is similar to how lego pieces come together to form a stable structure. For example, you'll find that some blocks have a notch on the top and a bump on the bottom. These blocks are designed to stack on top of each other. Other blocks have a special C shape, which means they can wrap around other blocks like this statement or forever loop. This helps create loops or controls the flow of your code. Anyhow, with all that cleared, let's connect up this code. If the right arrow is pressed, we want to change x by a positive number. We can put that in here, and then add on when flag clicked block to the top completing script. Let's see. Click and play and then clicking our right button. Oh, that's not good. As you see nothing at all happen. And we know we have our if statement. We are checking if the key is pressed. So what's missing? Well, do you have any ideas as to what's going wrong? Basically, it's only checking once, and just how when we wanted our cat to follow our mouse point, checking on is just not enough. We need the code to continuously check if the right arrow is pressed. To fix this. All we need to do is put all this code in a forever loop. Now, it's constantly checking to see if this condition is true. If we hit play again, notice if we click the right arrow now, it moves. Great. Now all we need to do is the same for the other keys. Now, I'm going to give you a really handy Tipa. Instead of going back to our code palette and finding the block and this key press block, what we can do instead is just right click the block of code you want and click duplicate. Now you can see we have two, and we can duplicate both of these blocks by clicking right at the top and duplicating again. Now we have four, which is all we need. Next thing to do now is change the key pressed input. Here we will do the left arrow up arrow and down arrow. But we're not done yet. We now need to change what happens. If the left arrow is clicked, we need x to be negative. Then if the up arrow is clicked, we need to change y and this time by a positive number. Lastly, for the down arrow, we must change y by a negative number. If we play now, there you have it. We can officially control our character, and you are well on your way to becoming a game developer. There are two things I want to do now. Now, the first is quite easy. Firstly, I just want to make this dragonfly not move so fast. And simply all I need to do is reduce these numbers. So I'll just halve it and change it to five and minus five. So now you'll see our character is easy to control. So the next thing is I want to get the ladybu randomly glide around the screen. So take a moment to try to see if you can do that yourself. How can we get the ladybird to move around the screen. Well, This is actually very simple. As we did this with our cat sprite if you remember, all we need to do is bring in when start click, a forever loop and then glide 1 second to a random position. Now if you click play again. You can see our game is really getting there. A lady Big is moving around and we're able to control our dragonfly. Great job. I'm getting to this point. We have certainly come a long way. 10. Coding Your Dragonfly: The Journey Begins: Well, our game is coming together quite nicely. Now we need to do is introduce the objective to the game, which obviously is to try and catch this lady bug? Because right now, if we touch the ladybug, nothing really happens. But what we want to happen is to have the ladybug vanish and have our dragonfly um and maybe play a pop sound like it's been eaten. So let's start off with our dragonfly. I want you to try and get it to say um, whatever you like. But get it to say something when it touches the ladybug. See if you can do that. Pause this video, give it a go. Can you get the dragonfly to say something when it touches the ladybug. Let's think about this. We'll need a sensing block to sense of the sprite is touching another, and we can use this one here. Now, clicking on here, we can change the touching sense from mouse pointer to Lady Bug two. Then just like with our arrow clicks, we are going to need an if conditional block and a fore loop. Then we need to say hello for 2 seconds block to get it to say what we want when it touches the ladybug. There's also one more thing. We need this play sound pop block. Just like before, we can organize our script so that it forever checks if it is touching the ladybug. If so, we will have it say um and then play the pop sound. Now, if we play it now, you will see when we now touch the lady bug, if I can touch it. There we go. It says, um, plays the pop sound. Now, one thing I can do to improve this is to play the pop sound first, then say Yum for 2 seconds. This just makes it more seamless. Okay. Cool. So our game is almost there. And before we move on to program the ladybug, I just want to point something out. Because you might be wondering why we have two separate scripts here? Like why don't we just put this piece of code inside here, so we just have one script. Well, if you were wondering that, good wondering, good question. Well, let's try it. So adding it in and now clicking play, you will see that. Now when we touch the ladybug, if I can touch it, there you go. But notice how suddenly I can no longer control the dragonfly. It just freezes. Why is this? Well, if we look at our script logically, taking the code out again, look, this is all a loop. So we are constantly checking if any of these conditions are true. If one of them is true, like we click the down arrow, it goes down. But remember how I said code runs from the top down. Well, that is happening here. So when we click Start, it's going to check if the right arrow has been pressed, then it's going to check at the left arrow is being pressed, then the up, then the down. So it's not really checking all these conditions at the same time. It's going from the top down. But because it happened so fast, it seems like it's checking it all at the same time. However, if I were to add a weight 1 second, like to this check for the down arrow. Notice how other arrows work perfectly, but as soon as it checks for the down arrow, all the other arrows freeze up. And this is because it's running the code from the top down. And when it gets to this code, it needs to wait for a second, and it can only continue the loop once the second is over. So basically, that is why this code has the same problem because there is this um for 2 seconds, and it will only continue looping the code once it's finished executing the script. So that is one of the reasons we use another script, so we can have multiple things running at the same time without any issue. Now, I could take out this sum for 2 seconds and add it back into the loop. Look, if we play it again, you'll see it works and it doesn't freeze. But even if you just wanted our sprite to play a sound, you should still use a separate script for this. Basically, having separate scripts is just so much better for keeping things organized. You see, when you make really big programs, really big gains, things can get quite confusing. And if you have just one ultra mega long script, you might not know what's going on. What we suggest is that each script you have should do just one thing. Remember that. Each script should just do one thing. This script controls the rakes, this one checks if we're touching the Lady Bug, and if you are well organized like this from the start, you'll be really thankful in the future when you make some fun and really complex games. With that, there's just one more thing to code for our game to be complete, and that is getting the ladybug to disappear when it touches the dragonfly. Try to give this challenge a shot and see if you can do it on your own. Otherwise, I'll see you in the next lesson and show you how it can be done. 11. The Chase Concludes: Catching the Ladybug: Well, let's see how we can finish off our first game. Now, just like with the dragonfly, we need to sense if we are touching the sprite. So I'm quite sure you know what to do here, because basically it's exactly the same as the dragonfly has except instead of the dragonfly sensing, if it is touching the lady bug, it's the opposite way around. But I want to show you another little trickier. Remember earlier, we learned we could duplicate code in a sprite. Well we can also duplicate code in between sprites. Going back to our dragonfly, we can simply click and drag the script and drop it onto our ladybug sprite. Doing this will automatically duplicate the script. No now two has this script. That's cool. Now all we need to do is change it from touching the ladybuges to touching the dragonflies. If you haven't yet figured out how to delete code, you just drag it into this area here and we'll delete. Now, what we want it to do is hide when it touches the dragon fly, almost like it's being eaten. So here, we can just go to the Looks tab, bring in the hide code, so our sprite hides when it touches the dragonfly. Now, if we play again. Notice if we touch a lady bug, it hides. But unfortunately, we have some problems because it's sort of kind of stage hidden, and we don't want that. And secondly, our dragonfly doesn't play the sound that we want it. But this brings us to an important aspect of programming debugging. I'm not talking about our ladybug, even though it's a funny coincidence. Debugging is essentially the process of finding and fixing errors in your code. In programming, there are two main types of errors. Firstly, there are what are called syntax errors. Basically, all that means is these are errors when you write code that doesn't follow the correct syntax or the rules of how the code and the programming language should be written. Syntax errors usually prevent your code from running at all. But thankfully, you don't have to worry about this because scratch prevents these errors because you might try to connect two blocks that don't really fit together, and this is basically saying, no, doing this would cause essentially a type of syntax error. But basically, scratch is forcing you to write with the use of blocks, perfect syntax error free code, which ain't a bad thing. However, the next type of bug are those that have to do with logical errors. These errors occur when your code is written correctly, but doesn't do what you intended to do. For example, In our game, if the lady bug doesn't hide when it's chord or if it hides too soon, that would be a logical error. Your code still runs, but the result is not what you expected. And these errors will occur all the time code. But that's just part of programming. You should never expect your program to work perfectly on the first try. You'll really be quite lucky if that does happen. Instead, it's all about debugging and finding all the errors that are in your code and getting rid of them to get it to work well. Also, as you gain more experience, you'll get better at spotting and fixing these errors. So with that all said, let's take a look at these logical errors and see if we can fix it. Looking at the script for lady bug, you can see that we get it to hide when it touches the dragonfly. But we never get it to show again. So what we could do is bring in a show block right below this. But you should also notice right away that this is just going to hide and show right away and happens so fast that it looks like nothing happens. And we can confirm this by clicking play. You can see it doesn't really hide. What we need here is a weight code block. So we can have the sprite hide and then show after a bit of time, adding it in between these two blocks and then playing it again. Yes, you can see it hides properly, and then it shows again for a second. However, we still have one more bug, and that is that our dragonfly is not saying um and making that cool sound. Now, this is a bit harder as our code seems perfect. To fix, we need to think like a computer and figure out why it's not working as expected. Let's analyze the situation. If we look at our dragonfly code, when it touches the ladybug, it's supposed to say um and play a sound. However, when we observe the game, the ladybug hides immediately upon touching the dragonfly, which means the dragonfly doesn't get a chance to detect that it's touching the ladybug. To fix this issue, we can add a short delay before the ladybug hides, allowing the dragonfly time to register that it's touching the ladybug. And we can do this simply by adding a weight block before the hide block in the Lady Bugs code and setting the wait time to something short like 0.1 seconds. This will create a brief pause before the ladybug, but it gives the dragon fly enough time to sense it's touching the ladybug, but it still appears almost instantaneous to us. Let's test the code again. Then you have it. Our very first game is working and all the bugs have been squished and debugged. Re really great work on getting to this point. You now I could say a game developer. Put that on your recupe but get ready to make some far more exciting games than this in the next sections. 12. Setting the Stage for a Soccer Header Game: Well, we're ready to get going with our brand new project. So I hope you are ready to level up your programming skills. First things first. A this is a new game, we need to create a new project. The good news is that it's actually quite easy. But firstly, make sure that your current project is saved. Now, it does do this automatically. But if you're about to quit your t or close your computer, just click the save now button. If you don't see the button, it just means that your project is already saved. So with it saved, all we need to do is click the scratch button here and then click Create. And once more, we have a brand new project. And we also have this cat free of charge. But unfortunately, for the cat, we don't need it in this project, so we can't delete it. Also, as you can see, our project is just called Untitled, so we can also name it. We'll call it soccer Header game. Yeah. I know it's not really a creative name, but you can name it whatever you like, although it's a good idea to name your program something that makes it easy for you to identify and find them later. Now with that done, we are ready. But before you die of writing, remember how in the previous section, we talked about the importance of breaking down a big project like building a game and smaller achievable steps. We do this because it not only makes the process more manageable, but will also help you develop good programming habits and even light habits. It's sort of like climbing a mountain. If you're at the bottom and you're looking right up to the top, it honestly seems impossible. But if you just look forward ten steps, you think to yourself, Yeah, I could walk those ten steps. And then you look forward to another ten steps and you walk those ten steps. And before you know it, you're at the top of the mountain. And the same is true with programming. We are just tackling this mountain of a game by dividing it into a series of smaller steps. For this game, thankfully, it isn't too large and complex, but we can still break it down. Let's begin by making a simple soccer header game where the player moves a character to keep a ball in the air. Now, we'll be using assets found in the scratch library, including our main character, Ben, soccer ball Sprite and a soccer field backdrop called soccer two. Because this mountain of a game is not too big. It's more like a hill than a mountain. We can divide it into just three steps. The steps are setting up the basic structure, developing the gameplay mechanics and polishing the game. First, we set up the basic structure. So we'll bring in all the necessary assets like sprites and backdrops to set up the games foundation. Now, for even bigger games, you might break this stage down into smaller tasks like building the start screen, then the main character or specific game elements. Second, we have to develop the gameplay mechanics. So once we have the essential elements in place, we can begin programming the game mechanics. Now, we'll need to code the character movement, the ball physics and interactions between the character and the ball. And then finally, we have the polish and refined stage. So after the core mechanics are working, we can add more details like sound effects and animations and even scorekeeping. And this is also when we'll thoroughly play and test the game, making any necessary adjustments to ensure it's enjoyable and engaging. Well, with this very important concept out of the way, I want you to try and complete the first stage by yourself, which is bringing in all the necessary assets. Remember, these are our main character, a soccer ball sprite, and a soccer field backdrop called soccer two. So pause the video and try and see if you can do this. If you try it by yourself, well, well done. But let's see how it's done. Firstly, we can import our two sprites into our scratch project. So clicking this at a sprite button, we can simply search for Ben, and here he is. Nextly we can click it again and search for the ball. Over here is an sock ball. We can use. Finally, there is the backdrop. For this, we can just click here and choose soccer to. Then you have it. The first stage is done. You've successfully set up the foundation for your soccer header game, and we're ready to start breathing life into our sprites with code. But as we continue to develop this game and every game and project you work on here after, remember the importance of breaking a big problem down into smaller steps because when you do this, really nothing is impossible. Even climbing Mount Everest can be done. 13. Bringing Characters to Life with Code: Well, now that we have everything in order, we can move to our next stage, which is to develop the gameplay mechanics. Now, just like with our previous project, we can start with our main character, which is Ben. So in this game, we want Ben to try to keep the ball in the air by heading it. All that Ben needs to do is go left and right and when we click the rakes. Now, I'm very confident that you can solve this problem by yourself. Why not? Pause the video and try to complete this part by yourself. Pause and give it go. I'll show you how to do it in a moment, but see if you can figure it out how we can just get Ben to move left and right. Okay. Let's see how to do it. We are pretty much creating the exact same script like we had for our dragonfly except this time, our character doesn't need to go up or down. The code we need is when flag clicked, a forever, and an F. Now, before we add the rest, I just want you to notice how often we have used this group of code. When the flag click forever and F. This is super important group of code that is often used because it allows you to create programs that run continuously with the forever and react to specific conditions with the F. These code blocks form the foundation of many scratched projects and are essential for creating interactive programs. Moving on, the rest is all the same. We'll bring in the key pressed, change it to the right arrow. Then go to the motions and bring in this change x by ten. This means we press the right arrow, it'll move ten times to the right. Now we can simply duplicate this, change it to the left arrow, and change x to minus ten. This means it'll move ten times to the left. There you go. The first part of our game mechanics is done and dusted. That was pretty fast, wasn't it? 14. Bouncing to Success: Animating the Soccer Ball: Okay, so we have our game mechanics down for our main character. Now we need to do the same for our ball. Firstly, we want to get our ball bouncing around the screen before we try to get it to interact with the soccer plan. How can we get our ball to randomly bounce around the screen? Well, let's give it a shot. Let's grab the win flag click and also bring in a forever loop. Also, we know it has something to do with motion. Let's have a look to see what we could use. We know we can move the ball across the screen by changing its position. And there's a neat block that says, I on edge bounce, which sounds hopeful. Let's bring both of these into our script and clicking play. Hm. No, that's not quite what we want. The ball is just moving to the right side of the screen and bouncing when it hits the edge, which is to be expected. So this change by is clearly not the block that we need. But before I continue, try to play a round of the blocks and see if you can get it right. Come on. Pause and give it a try. Did you manage to figure it out? Well, let's see how we can fix this. Firstly, this change x is not what we want. Let's get rid of it. Now, remember how with our first program, I told you not to use the move ten steps block because we can't make it go up and down. Well, that's not quite true because you actually can't. You see, when we move ten steps, we are moving ten steps in whatever direction the sprite is facing. If our sprite we're facing up, we would move up. This is all to do with direction, and the direction of a sprite can be set over here or by these code blocks. Anyway, we won't worry too much about how direction works right now as you'll get good at it in our upcoming games. But what you should know is when we bounce off the edge, it will point the sprite in a random direction that is opposite to the wall, it is bouncing off. With that all in mind, if we put the moving block in here instead, notice how our ball bounces across the screen, how we want it. We are getting there with our game mechanics. Next, we need to connect both of these sprites so we can start getting some ads going. Okay. 15. Mastering Interaction: Ball and Player Dynamics: Well, now that we have the basic game mechanics working for both of the sprites. It's time to make it all work together by checking of the ball is touching the player's head and then bouncing back if it does. But before I go ahead and sort out this, there are two things I want to fix with the player. The first is getting the player to appear further down so that we have more space, and the second is switching to a more appropriate costume. I bet you can figure out how to do both of these. Come on. Let's pause the video and figure it out. The first thing is to click on our players right so we can get it a peer low down. Now, I could just drag it like this. But this isn't ideal because if I move it again by accident, the whole thing won't work properly. Instead, what I'll do is bring in this go to block and change the x to zero, and let's make the y -90. That actually looks perfect. Let's add this to the start of script. So now every time our script will start in the correct position. Then lastly, to get our character looking correct in this game, we can go into the costumes and change it to this one, Ben C, which works much better. Now, we need to get the ball to respond to our main character. Click on the ball sprite. Now, let's think about it. Basically, what we want to happen is to have the ball bounce off the player's head. What specific instructions or code? Do we need to write in order to achieve this? Well, this problem also has to do with sensing. As we are sensing, if the ball is touching our player. We know we are going to have our basic code blocks for this, which I list them before I remind you the basic code blocks. The one start, the forever, and the F. Just like our dragonfly, we're going to need this touching code. And here we can change it to sense if it's touching Ben. Cool. We now know if the ball is touching Ben. Now what can we do to get it to bounce if it touches been? Okay. You'll notice that there is unfortunately no bounce of touching the main character block, which if you really cool. But remember, with code, there is never going to be a single block that does this. It's all about combining code and building scripts to achieve this. This is really the great thing, which you'll see in future lessons. This is programming, and what you can do is you can save these scripts and use them in different programs. Maybe in a different program, we need a script that bounces off another sprite. Once we create this script, we can reuse it forever, and this is an important concept encoding. It's called reusable code, and it saves a lot of time. But getting back to it, let's move to the motions group. Now remember, how we are using this move code block, and what is special about this is how the direction the ball moves is dependent on the direction it's facing. Simply to get our ball to bounce up, all we need to do is face it in an upward direction. And to do this, all we need to do is bring in this point in the direction block. But right now you can see it is trying to 0.90 degrees, which is to the right. But if we click on this, notice that it brings up this handy little arrow thing. For our code, we want the ball to go up so we can face the arrow up, which is zero degrees. Now if we play our code, you'll see that when we touch the ball, it bounces up. Perfect. Although as you can see, it just goes up and down up and down, which is making it a very easy game. But in the next lesson, we'll see how we can make this game a bit more challenging and a lot more fun with randomness. 16. Embracing Randomness: Elevating Game Challenge: Okay. At this moment, to say our game is easy is probably beyond an understatement. You kind of just sit there and wait for the ball. But that stops here. It's time to make this game a whole lot more challenging and fun by embracing randomness. Looking at our code for our point direction, and you can see that it just kind of points up, so this behavior is expected as that is what we're telling the ball to do. But what we really want is for the ball to not just point straight up each time, but we wanted to point just a bit to one side. So how could we do this? Well, remember how I said, this code is like lego where different pieces can fit in and on one another. Well, if you look, you'll notice this area has this circle or this oval type shape. Now looking through our code, you'll see that a lot of code is a shape. For example, if we take this exposition block, see how we can put it inside this point direction block because it's the same shape. Haver you'll notice that if we play the game now, the ball does not do what we want. This is clearly not the block we're looking for. But to give you a hint, the block that we need is actually found under the operators group. Now, remember what we said at the start, per code blocks that deal with mathematics, which are now important for us to use. Why not give it a try. Try to see if you can find the code block that we will use to get our ball bouncing correctly. Just pause and give it a go. Did you find it? Well, let's have a look. We basically want the ball to bounce upwards and also bit to the right or the left. If you look at this code, you will see that there is this pick random block. Here, we can simply put this block in the point direction. Quickly playing, you can see it does what we want, but not exactly. It's more just drifting to the side. That's because we need to change these numbers. Removing this again, we can click our point direction to get an idea of what numbers it should be? Moving this arrow. I would say that -45 and 45 or a pretty good direction. Let's input that into our pick random. Again, put it back into our code. Clicking play again. There you have it. That is much better. Game is finally getting somewhere and it's a lot more challenging. Yes. Who said math isn't fun? 17. Precision Programming: Perfecting the Header: A game is really coming along. But this is a header game after all. If you play the game, you can see that you don't just have to hit the ball with your head. You can use any part of your body and hitting the ball with your head doesn't seem to be the main element of the game. How can we fix this so that only when the ball hits our head, does it start to bounce? Look at our code. This is to be expected. All it's actually doing is sensing that the ball is touching been, which is the whole character. We don't have any code to deal with this because it's not like we have code that says if it's touching its head, do something. But that's fine because we are programmers, and we solve problems. What could we do? Well, Maybe we could write some accomplished code that checks the y position of the ball and compares it to the y position of Ben's head, and so on and we could maybe eventually get the problem solved like that. But they will take a whole lot of code and programming. But it's also about thinking outside the box to find simple solutions to complex problems. All we want our code to do is to check if we're touching Ben's head. Pause the video and think for a moment. What clever thing could we do to solve this problem? We want the ball only to bounce off Ben's head. Pause and think. Did you come up with any good ideas? Well, here is a gruesome but clever way to do it. How about this? We cut off Ben's head. Okay hold on. I sound crazy. But hear me out. If we can have a separate sprite for Ben's head, we can easily check if the ball is only touching the head. But of course, we will also need Ben's body, so we can have that also as a separate sprite. But before I cut off Ben's body from his head, I'm going to show you another trick. We can actually duplicate an entire sprite by just right clicking and hitting duplicate. Here you can we now have been two. Now with that done, we can go to our original been, go to costumes, here you can see we can actually make a lot of adjustments to our character. But all we need to do is remove the body. We can drag and select all this and hit backspace. There you go. Ben is now a floating it. However, because we duplicated him earlier, we didn't even notice this. And if we play the game again, look how it works perfectly, and even if the ball touches the body, it doesn't count. The one thing I will say though, is the fact that our bend two sprite works perfectly is a little bit unintentional as we haven't programmed it at all. In programming, we cause a happy accident. But the reason it works is because the controls are exactly the same. I just follows. Although this works, which is cool, we still need to change this code because the problem we have is that if we ever change our original code and Ben, for instance, changing the xp two seven and minus seven, you can see now things start to get a bit freaky as Ben has a double head. Instead of this code here, we can get rid of it and replace it with just a go to block. And we can now select Ben. Now if we ply our code once more, you will notice that it works no problem, and this is what we call robust code as it is able to adapt to its circumstances. So we learn some important lessons in this lesson. Think creatively, but also make sure you code in a resilient way that will work even if things change. With time, you will learn to do this more and more. 18. Game Over: Introducing Consequences for Missed Headers: Well, a game is coming together quite nicely. But I think you can see the clear problem here, which is that well? If we miss the header, it just keeps on going, and this makes for some rather easy gameplay. There's just no real challenge. In this lesson, we will be looking at how we can end our game when we miss the header. If you move over to the control group, you may have noticed a special block over here with the word stop all I think there is no explanation required for what this does, as I'm sure you can guess, this block stops all. For example, if I play this script, and then click this block, notice how the game comes to a holt. The block is clearly doing its job. It is stopping all the scripts in all the sprites. But just like the other blocks, we can change what it does by clicking here. Instead of stopping all, we could just stop this script. Basically, whatever script we put this block into, it'll stop that script when the script reaches this code block. Alternatively, we can also stop other scripts in the sprite, and as the name states, every other script in the sprite except for this one, will stop. There is one other important aspect I want you to look at. But basically, notice how right now, this is just like a normal code block. However, if I change it to stop this script or all, see how the code block changes, and there is no indent at the bottom. Basically, this means there can be no code under this block. You'll see if we try. It just doesn't connect. If you think about it, it makes perfect sense because if we stop all or stop this script, the code under it would never run anywhere. It doesn't make sense to be able to add any code underneath it. Well, now that you understand how the stop block works, I'm going to give you quite a tricky challenge. I think you're up to it. I want you to in a moment to pause the video and to see if you can get the game to stop when the ball touches the ground. Now, remember, this is going to require a lot of logical thinking or thinking outside the box, but give it a shot. Can you get the game to pause to stop when the ball touches the ground. Pause, think and try. Well, if you actually managed to get this working, that is amazing. But even if you didn't, that's also great because this is where the learning happens in trying to figure things out. This is where you really have lots of fun. Let's see how it could be done. Let's look at two different ways we can get this done. First things first, we're going to need one of our we start forever, and if combo packs. I'll just duplicate this one and just get rid of the code inside. Then I will duplicate it again because we are covering two methods. Now, the first method we're going to think about a bit is quite a bit out of the box. I don't know if you came up with this one, but if you did, that's great. We're going to go down to the sensing group. Look at this option touching color. That's cool. We can check if our sprite is touching a specific color. Interesting. The only problem is what color do we check for because the bottom is pretty much the same color. Well, let's change that. Clicking on our backdrop and then going to this editor. Notice how there are a bunch of tools that you can use to customize it. But all we need is a specific color at the bottom. To do this, I can just use this tool. Choose a unique color and draw a line at the bottom. Then you have it. Now I can change the touching to this color by using the color picker. Finally, add in my stop all. Now when we play the game, and then when we miss, our game stops. It's great. That works. That was a creative way of solving this problem. But before I move on, I'm going to show you another method, but it will be quick. As you can see here, I have already assembled the script, and if we play the game, you'll see it works just the same and doesn't even need the touch and color. Looking at the script, you can see that it checks if the y position of the ball is less than minus one 50, which basically means it's touching the ground, if it is, well, it stops. To easy. Both of these methods would work, and sometimes we need creative ways to do things. But if we think even more, we might find a way that's even easier, always keep thinking. That's basically it. Your game is ready to play. The upcoming lessons, we'll be making it a lot more fun with score and levels. But for now, just appreciate how far you've come this game that you've built, play it for a bit and have some fun. 19. Keeping Score: Introducing Variables and Game Logic: I think we can all agree that this game is missing something quite crucial. Something fundamental and absolutely necessary to all games, and that is score because how are you going to flex your friends when you can't even show them a high score? In putting in a scoring feature, you will be learning one of the most fundamental programming concepts and you'll be using a code block we have not touched yet, and that is variables. So are you ready to continue with your learning adventure? Looking at our game, what we want is a little score at the top that indicates how many times we've headed the ball, and we want the score to reset if we miss. Moving over to the variables code group, you can see that there are actually not that many code blocks here. And for code blocks that are considered so important, you might be thinking this area should be stacked. Well, unlike all the other code block groups that we've looked at, with variables, you can actually make more code blocks by clicking on this button here, which we will look at in a minute. But before we do this, I just want you understand what variables are. Now, in programming, we often need to store information so that we can use it later on and we also need a way to get this information easily. This is where variables come in. Variables are like containers that hold information, and that's why they called variables. It basically means the container can hold various types of information. We can give variables names so that we can easily access them and put information into them and use the information wherever we need it. Think of variables like boxes that we can store things in. Just like you might have a box to store your games, a box to store your books, a box to store your old socks or whatever. Variables are pretty much the same. But instead of storing physical objects like books and games and stinky old socks, variables store data like numbers and text. Picture it like this. We have a variable cored score. And inside this variable, we are storing the value zero. But when our play gets ahead, we go back, look inside our variable box scored score to discover what value is currently inside the variable. In this case, when we look inside it, zero. Now that we've looked inside the box and discovered it's zero, we can simply add one, which gives us one and store that back into the box. Then we can display our variable and the score of one is displayed on the screen. When we get another header. What does the program do? I'll go back, look inside the score box, and this time it'll see that it has a number one stored in there. We can simply add one to this, which now gives us two, store that back inside our variable, and display that on the screen. Obviously, it goes on and on. But basically, I want you to understand how variables are just digital storage boxes with names. These named variables can store any number of text to numbers, et, and we can easily check what values our variables have. And we can use our variables in a number of ways such as keeping our score for our game or even an invisible behind the scenes way like increasing the difficulty of the game as we will look at later on. So now that you understand the basic idea of variables, let's take a look at these blocks and see how they relate to what we said. Firstly, remember how I said the variables group, let you create new blocks. Well, to do that, we just need to click on this button, and this makes a new variable. So basically a new box to store our digital information. As you can see, it asks what we want to call the variable. Because this is going to hold our score information, we will call it score. Then just below this, see how it gives us a decision. Is this variable for all sprites, or is it for this sprite only. Now, basically what this means is can all the other sprites see and modify our score variable or can only this sprite access it. In programming, this is what we call scope. That's just like a fancy word for what part of the code can see or modify variables? If all sprites can see and modify the variable, that is called a global scope. While the sprite only can see and modify, that is a local scope variable. We will choose the sprite only as our sprite don't need to have access to our score variable, and all the modifications can happen inside the sprite. And clicking Okay, here you can see our brand new score variable appearing here. Look how you can even see it on the screen, which in this case works perfectly for us. So now that we have our variable, I'm going to drag each of these blocks out so you can see what they do. Firstly, we have set the variable to a number. And if you change this number and click it, well, nothing happens. And that's just because we haven't selected our score variable. Doing so, you will now see our score is set to three as reflected on the screen. So this block over here doesn't care what our variable was. It just sets it to whatever value you want, and this could even be a word like high. But we want to keep it as a number, so let's set it back to zero. Moving down to our next variable, this one is to change the value. So if we were to put one here and then click, CR score increases by one. And basically, what this block is doing is what I explained earlier. When I click it, it looks at what value is stored in our score variable, which in this case is two, and then it looks at what value it needs to be changed by, which is one, it takes two as one, and you've done the math in your head. Very good. And we get a score of three. Finally, looking down, we have these two blocks, which are quite simple. We can show a variable on our stage or we can hide it. Well, that's all there is to it. With that, you now understand the fundamentals of variables in programming, which is a super important concept. I want you to try now and see if you can implement the score variable into your code, and in the next lesson, I will show you how we did it. 20. Fine-Tuning the Scoring System: Well, how did it go? You may have run into a few problems, but a problem is just a stepping stone in your learning which leads to growth. Yeah, it's quite profound, isn't it? But that's what it is. Anyway, let's just get to. So we want to change the score by one. Each time our guy gets a header. And our guy is getting a head when he is touching the ball. So if you look at the script here, it's basically doing that. It's sensing if we are touching Ben. So it works perfectly for our variable change, and we don't even need to create a new script. So let's do this. If the ball touches B, we want to change our variable score by one and change the ball's direction. Let's check this out. Clicking play. You will see when we get ahead, it works. But just before you celebrate too much, see that if we touch the ball from the side. We get a whole stack of points. And that's one way to cheat in our game. That's a bit of a hack. So we definitely need to fix that. And also, notice that when we restart the game, our score stays at the same number. So firstly, we can fix our score not restarting, simply by adding this set variable block to the start of our script. And this way, each time we start our game, our score is reset to zero. Our next problem needs a smarter fix because if you look at this code, if Ben is touching the ball, it changes the variable by one, and it keeps doing this until he's not touching the ball. Even if we are only touching for a second, the score will increase a bunch of times in that second. To fix this, add in a weight 1 second right to the end of the code, and we don't even need to be that long, let's change it maybe to half a second. Now, if you look at the script, we set our score to zero. Then if we touch Ben, we change the direction, change our score, then we wait for 1 second, which means that our players can't cheat anymore. With that, your scoring is done, one quick. If you double click on the variable, you can make it big like this. Also, you can move it around and put it anywhere on your screen. Now, have some fun with this game and try it on and see how high can you get? What is your high score? Have some fun because you are busy creating an absolutely amazing game. 21. Smoothing the Edges: Debugging Game Flow: In this lesson, we're going to do something very exciting that very exciting thing is debugging. Maybe not. Maybe debugging is not that exciting a part of programming because it's trying to solve something that's not working. But having said that, there is nothing more satisfying than fixing a problem in your code that is really being annoying you. You will get used to it. And the two problems we're addressing both have to do with the ball. Now, although technically speaking, this is actually a bug, it's just features we haven't implemented completely. But firstly, when we start our game, our ball doesn't start in the middle. Instead, it just starts where it left off. Secondly, it just moves in whatever direction it was previously going. This quite literally makes it impossible when the game starts and our ball heads straight to the ground. How do we solve this problem? Don't look at me. You're the programmer. Use your programming skills and coding skills and problem solving skills to make the ball start in the middle and also make the ball automatically start going up when the game starts. Can you do that? I'll be waiting. Pause the video, and give it a try. So how did you go? Well, let's see how you could have done this. First things first. To make sure our ball starts in the middle, we can easily do this, which just go to motion, bring in this go to block, change it to zero x, and let's say 60 y, and then add it to the start of any of our scripts inside the ball sprite. Now, when we start, you'll see that our ball starts in the center. Great. We're getting somewhere. The next problem, however, is that sometimes our ball goes straight down, which isn't a train smash, but for consistency sake, let's make sure our ball starts with an upward motion. And again, the fix for this isn't too complex. It's all to do with what direction our ball is pointing. So just like how we set the ball's position from the start, we can also set the direction it's pointing. So dragging in this block, we can set the direction to zero degrees and then also bring it to the start of our script. Now, each time we click start, you'll notice the game is consistent with the ball's position and direction. And with this your game is very playable. But hold on your hats because in the next lesson, we will take the simple game to the next level with level difficulty, animations, and more. 22. Leveling Up: Introducing Dynamic Difficulty: Now, the game is pretty fun. There's no doubt about that. But we can't light ourselves and say it's very challenging because it's not really that tricky. Now ball pretty much just stays at a constant speed and the game difficulty is always the same. Where's the fun in that? Let's see how we can add a bit of a challenge to our game by making levels of increasing difficulty. Now, essentially, what we want to happen is to have our bore continuously increase in speed as our score increases. Now, this is where you'll start to see the true power of variables as we're going to use them to change the whole dynamic of our game and our code. If you take a look at what is actually dictating the speed of our ball, you'll see it is just this move ten steps block. So if we increase the number to say 15 and then hit play again. Now, just now how the ball is going a lot faster. What this means is to increase the difficulty of a game, we need to increase the number here. Obviously, we don't want to sit here and do it manually, let's get the variables to do the work for us. Moving over back to our variables, let's create a new one. This time, we call it ball speed. Again, we can make this a local variable by clicking here. Now, as you can see, our new variable appears right on our screen. But unlike score, our plate doesn't actually need to see this number, but we can leave it here for now while we edit the code to make sure it's doing the right thing. So now that we have our ball speed variable, you will see that we can act drag this block here and onto our scripting area. As you should notice, this block is the same shape as this one here, so we can simply drag our variable into our move steps block. Unfortunately, you also notice that well, the game doesn't really do anything and what it shouldn't. Because if you look at the code, we are moving ball speed steps, and the ball speed variable is zero, so we're moving zero steps. Quick fix to this is setting the ball speed to ten when the game starts, which is the same speed as it was. Once again, by clicking play, you'll see the game is back in working order. But now we are just back to square one. However, now, we want our game to increase in difficulty as we play. At this stage, if you look down at your keyboard, you will see a long bar called the space bar. If you click on this, what we'll do it is going to pause this video. But before you do that, this will give you an opportunity to work out how to add this feature on your own and develop your problem solving skills. Click the space bar to pause this video and try to see if you can solve this problem. I'll suggest creating a new script. But I'll be waiting on the other side of this pause and see if you can get this now to work. Did you figure it out. As I mentioned, there are often a bunch of ways we can implement new features, but the simplest solution is often the best solution. Let's create a new script that controls our game difficulty. As always, we need this block here. Then we need this change variable by block here and ensure it is ball speed selected. Now we need a way to have this continually increased. Quite simply, we can do this by grabbing a forever or a repeat loop, and either one will allow us to constantly refresh the game difficulty. In our case, I'm going to use a repeat block because we don't want the game to just keep getting more and more difficult to a point of impossibility. So let's put this block in this one, and I'm sure you can guess what will happen when we start the game. Yeah. Our boards just go straight to speed. Well, thankfully, there's an easy solution is to drag in this weight block, and then let's set it to 5 seconds. Now when we play again, you can see that our game. Slowly, but surely starts to gain in difficulty as time passes. Eventually gets to the point where it becomes near impossible. The script might need a bit of tweaking, but we'll leave you to do that. What we can also do now that our difficulty variable here has been added properly to our game is we can hide it from our screen simply by unchecking this box. A there's no real need for the players to see it. Well, that's about it for now. We have completed stage two and develop the gameplay mechanics. Now to the last stage, which is the fun stage where we polish up our game and add in some nice looking graphics and some sound and even animation. 23. Final Touches: Polishing Your Soccer Header Game: So we are at stage three, which is polishing the game, and this is where we make sure everything looks nice by adding animations and music sound and et cetera. But as I said, this is quite an exciting stage. As you get to see your game really come to life. Now, this stage can take a short amount of time or it can be a lot of time. It all depends on how nice you want your game to look and how much you want to play. But it's certainly true that having nice graphics and sound can go a long way to really improving your game. So it's important to make sure you give the stage some real life. Okay, let's get going. Looking at this game, the first thing that I don't like is the size of the ball. Let's make it smaller. Let's set its size to 80%. That looks better. Now, the second thing that needs improvement is how our main carrier just like floats left and right while he should actually be moving his legs. Now, this is where we will really get a better understanding of costumes. Clicking on our bend to sprite, which has the legs, I want to make it appear like his legs are moving. We can click on costumes. Here, the first thing we need to do is get rid of these other costumes as we don't need them, and they're just going to mess up the animation. Now, if you click on our first costume, you will see you can duplicate it. Now we have two of them, and this is where the fun world of animation begins. Clicking on the select tool. We can just select just the legs, below here, you can see we are able to rotate the legs. Because we want it to look like it's running, we will have a shift left and then shift right. Now for the tedious part, rotate it just a bit more to the left and center it. Now, duplicate the sprite. Select the legs again, rotate them, send to them and rinse and repeat. And when we get to about this angle, we're going to start shifting the legs to the right, again, rinse and repeat. Now, when the legs reach the far right, move it back one more time. This way, we have a seamless animation. Now, although we now have the special animation, we still need the code to make it work. Moving back to our tab we could start writing the code, or we could be smart and realize that the code for our original ben is perfect for bend too. Simply drag it over and then remove all these unnecessary blocks. All we have to do now is put the next column into each of these conditional checks. Meaning, if we click left or right, it will change the costume. If we play the game now, notice how much better this is, how much more realistic it looks. It shows you the power of animation, even if you wanted to, we could have made the body even rotate a bit. You can give that a try if you want. But onto the next thing, which is the ball. And here, there are a few improvements I want to make. Firstly, I want it to play a bouncing sound when Ben hits the ball and a referee whistle when it hits the ground. Moving over to our sound group, we can choose the start sound. Also, as a side note, the difference between these two is this one will play the sound until it finishes before moving to the next code block, like a weight block while this one won't interfere. This one works better in our case as we want to ensure it doesn't interfere with our code while the sound is playing. That said, if our ball touches Ben, we wanted to play the sound, so we can add it here. Next, for the referee sound, you'll see we don't have it on the sprite, so we need to add it. Go into the sound tab, we can just click this button here and just search and here it is. Now with it added to our sprite, you can see we can now select it in our code. Again, logically, this should sound when our game ends, so we can add it right here before the stop. Although when we play the game, you might be a bit disappointed because although our ball bound sound works, the whistle does not. Well, as I just said, the sound block will play until it's done while this sound block will play and execute the next code. So with the stop is the next block, the sound won't play all the way through. Let's switch this out for the other block. Do you have it. That works. Now, with both the sides added, the last thing I want to do for the ball is to have it look like it is rotating in the air instead of just staying static like it is. And for this, we need to go back to the costumes. But this time for the ball. Now I bet you can figure this out. One you pause the video, you've just seen what we've done already, pause the video and see if you can make the ball look like it's rotating. Right. Let me show you how you could do it. If you haven't already figured it out which I bet you do it. As you can see, we only have one costume here, so we need to make the animation ourselves. Here, just like with our legs, we're going to need to duplicate it. Then select it, rotate it a little, then select, duplicate, rotate a little. I'm sure you can see where this is going. But basically, we need to keep rotating until our ball gets back to the position it started it. Through the power of editing, I'm going to fast forward this process. But unfortunately for you, this is no such fast forward process, but it shouldn't take too long for you to continue doing this. Well, there you have it. As you can see, we have all these costumes that come together to form a perfect loop. If we go back into our code, we can easily implement this, by sticking the next costume in our forever loop, and when we play, look at how much more realistic this looks. Now we're on to our last touch. For this, we can move over to our backdrop here to make the game really feel more alive. What I want to do is animate the background by having flashing lights in the stadium. You know the drill, let's go to our backdrop. We can delete this one. Now this time, I'm going to first duplicate the original three times, so we have four backdrops in total. For the flashing light effect, it's actually quite easy. All we need to do is select this tool, which allows us to create circles. Then color the circle white by clicking here and dragging the slider. Now as you can see, we are now able to draw these white circles. So what I'll do is cover some of these circles with white to make them look like flashing lights. A quick tip, you can zoom in by just clicking here and you can also resize and reposition your circle. Okay. So now I'll go through each of these costumes and cover some circles just at random. Okay, done. Just like before, we can use a forever and next costume or backdrop in this case. That's definitely a bit much to make it less crazy. Let's bring in a, you guessed it, our weight block. Now we can just do something small like 0.1 seconds. That's much better. Now for the final touch, some game music. For this, we can just go into the sound tab, add a new sound, and here you can choose whatever you like, but make sure it's our loop. For this game, the video game two sound works. Going back to the code. We can duplicate the script because we don't want a white statement in here and just add the sound in and change it to video game too. And that, my friends, is it. Our game is done. It's polished. It's where we want it to be at this stage. I'm sure you can take it even further. But for now, just appreciate where it's at and the amount of subtle detail and animations that got this to where it is. Great work. Enjoy your game, and even more the fact that you are a coder. 24. Gear Up: Crafting an Endless Traffic Adventure: Right now, you have really developed a lot of programming skills. I'm thrilled to see the progress you've made. Now we're going to embark on a new adventure as programming is often an adventure of twists and turns, getting lost, and then finding a way. It's much like a navigating through a dense forest. But eventually, you find a way to the clearing where the beauty of your creation awaits you. That said, for our next programming adventure, we will really be leveling up your skills by creating a much more complex and dynamic game. This game is an endless traffic runner game where you are a car and you're speeding along a highway. This game will challenge your programming skills, but it will also be a lot of fun. So before we dive into importing sprite and designing the game, let's first take a step back and understand the bigger picture. When building a game, as I've said, it's crucial to break down the project into smaller achievable steps, and this becomes even more important, the more complex a project becomes. That said, In our end of traffic running game, we'll be building the following components. The player car, the trees on each side of the road, the road lines, the obstacle car, and the road backdrop. Now let's take a look at why we need these sprites and how they will contribute to our game. Firstly, the player's car sprite will be the main character that the user controls, dodging obstacles and navigating through the traffic. Then the tree sprites create a visually appealing environment and help set the scene for a game. While we're driving, it'll appear like we are passing trees and other plants and rocks. The road lines are all about providing a sense of motion or the illusion of motion because obviously our car can't move forward and go off the top of the screen so we can make it look like it is going forward with the road sprite. The obstacle cart sprite will be the challenge of our game. It's what the player must avoid to keep their run going. Finally, the road backdrop sets the stage for game, immersing the player in the world that we've created. Now that we have a clear understanding of the components needed for our game, let's start importing our acts. Now, this will be our first time importing sprite acids from our computer, but don't worry. It's a simple process. Before we continue, as mentioned before, you have a choice here. You have two different types of acids to choose from. Either, you can download the raw acids, which will be all the different images, sounds, music, et cetera, and follow along as we show you how to import and edit them. This will give you some experience working with the graphics. Or if you just want to focus on the coding side of things, you can download the project asset, which will have all the sprites, music and sound effects are ready to go. But personally, I do encourage you to follow along with the raw assets. This will give you some great experience. First things first, let's create our brand new project. Like all the times before, we can just click select this create button. If at this stage, you want to use the pre loaded project, simply click here, then load from your computer. The move over to our starter traffic Runner project file. But let's look at the proper way now. Firstly, let's delete the catch sprite, we don't need. The next thing we need to do is upload our sprite before, move over to this button, but don't click it. Instead, we can select this button right at the top that says, upload sprite. The first sprite we want to upload is our player car sprite. Moving over to the project assets folder. Here you will see our traffic runner folder, and if you click on that, you'll see that we have a folder for each of our sprites. Selecting our PlayerSprite. Here you can choose whatever car you want for your player Sprite. I will select this one here and hit open. Then you have it. Our player sprite is now in our project and ready to go. But let's not stop there. Let's upload our other sprite. Like before, just click Upload. This time, we can select the obstacle car sprite. Here it doesn't matter which one you select as we'll use all of them. We can select open. Before we move to our next sprite, we need to upload our other car obstacle sprites. You may be thinking that we will just have a bunch of different obstacle sprites here, but we will do something a bit more clever than that. Moving to the costumes for this car, right. Here we can again, click upload. And this time, we can select all the other cars, simply by kicking this car, holding down shift and clicking the last car. There you have it. All our cars are in one. Fancy that. Let's move on to our next sprite. Again, clicking upload. This time we can select our tree and foliage sprite. Just like with our car sprite, we can just select the first one, then hit open. Then moving over to the costume editor, we can click this button here. Then once again, we can select all these other costumes and upload and there you go. Now there is just one more sprite. Hitting upload and this time we can select this road la sprite here and click open. That's all our sprite. We just now need to upload our backdrop. Simply clicking on it, clicking backdrops, and then upload. Here we can choose this backdrop image here and click Open. That's just about it. We have all our sprites ready to go. Get ready for it. But great work so far. As we have all our sprites uploaded, we have completed our first stage of game development. You also have a good idea of the bigger picture of the game and why we have all the sprites we have. 25. Laying the Groundwork: Organizing Your Game Assets: Okay. Well, we now have all our sprites imported, so we have everything we need to start developing. But before we start coding, I think it is best that we organize this a bit better so we know what is going on. Because if you could not tell, this is a bit of a mess. Programming and well, most other things in life, staying organized is key. I don't know if you've ever cooked in a very messy kitchen, but if you have, you'll know the struggle. But luckily for you, this is going to be quick as there are only a few things that need to be atend up. Okay. Firstly, moving to our tree sprites here, as you can see, this is just way too big. You may be thinking, well, I can just change the size over here. But think about it. If you accidentally change it again, then you have to try to remember how you had it, it's always better to do it in the code editor. We can just bring out this go two block and then this set size block. Let's set the size to 30, and then we can change the position. Let's just quickly hide the other sprite so we can see what's going on. Okay. Well, the size looks pretty good. Then for the G to block, we don't even need to guess. I can just drag it to where I want it right at the corner here, and then just copy these x y coordinates into my go to block. Then lastly, we can just put a win flag clicked on the script. Then looking at the road lanes. You don't need to worry too much because we'll be working with this in the next lesson, but you can just drag it to the center for now. Then for our obstacle car here. We also need to make it smaller and change the position so we can just drag over this code again, and while we are here, we can also drag it to our player car. For x, we can just set it to zero, then y is fine. The size can be a bit bigger and that should be good for now. Lastly, looking at our car, let's move this to the center and change y to be negative as we want our car on this side of the screen. That's a bit too far down our car is a bit small. Again, we can increase the size. Then let's bring y up a bit. As you can see, this is a bit of trial and everything, but it looks about right. Well, there we have it. Look how much better that looks. We can actually see what's going on. Now that we are properly organized, we can start cooking. Well, in our case, we can start programming. 26. Crafting the Illusion of Motion: The Road to Realism: Now that everything is in order, we can move to the next stage, which is building up the mechanics of the game. Now, normally, we would start with our main player sprite because after all, it is our main player. However, before this, there is something even more important, which is our road because it makes it actually look like we're driving. Now you may be wondering, how do we make it look like our car is moving forward? Well, this is where the art of illusion comes in. You see, in our game, we want to give the player a sense of continuous motion as if they are driving down an endless road. To achieve this, we need to pay close attention to the alignment of our road lines and also other visual elements. It's like a magician's trick. If we do it just right, we can create an illusion that feels real and seamless to the player. Now, imagine you're watching a well executed magic trick. Your eyes are glued to the magicians hands as they effortlessly create the illusion of reality. That's what we want to do with our game. We want our players to be so captivated by the seamless loop that they don't notice the trick behind it. To create this illusion of motion, we'll be using stretched backgrounds and clever manipulation of the x and y positions. The key here is to ensure that our road lines and other elements are aligned perfectly so the loop appears smooth and continuous. But why is precision so important, you may ask? Well, the slightest misalignment can break the illusion, making the game feel less immersive and enjoyable. Remember, our goal is to captivate the player and make them feel like they are truly driving down and endless road. This part might get quite tricky. If you find the stage two challenge, you remember, you can always download the full project acid with the completed sprites. However, this stage will definitely increase your skill in costume design and game development. Let's get this endless loop under way. If we go to our road sprite and then costumes, you can see we have well, just these lines, right now, our road lines are the exact size of our screen, if they were to come down even the slightest bit, the illusion would be broken. What we want is to extend the road past these borders here. If you try and do this now, you will see it just vanishes into the abyss. The first thing we need to do is convert it into a vector, which now as you can see, gives us a load more options, including bringing the image off the screen. To extend this image, what we can do is bring it down. Remember, we can use the keys just so we have more control. Also, if you hole shift while clicking, you can see it moves a lot further. Anyway. Right here looks about good. Now we can copy this and then paste it before moving it up, we can make sure it is exactly aligned horizontally. Now again, using the arrow keys, we can bring it up. Now the final step is to make sure these gaps are the same. Here, just carefully look at the road as you slowly move it up to make sure these two gaps are the same. That looks pretty good. Again, this might take a bit of trial and never to get it perfect. But with that, our customer is ready. We can now move to the exciting part, animating it, which we'll do in the next lesson. 27. Mastering the Loop: The Art of Seamless Transitions: Okay, so this is it. Let the illusion begin. Well, before programming, let's look at what we want to happen. This will help us understand what we need to code. Dragging our road sprite, we wanted to come down like this, making it look like we're driving forward. Then when it reaches the end, we wanted to go back to the start, but do so perfectly, so it looks like nothing happened. Well, start off, let's just grab a win start, a forever, and a change y by ten. We can quickly hit play, that's the wrong way. Let's make it a minus ten. Well, that's pretty much what we want. Now we need to do is have the road go back up before it gets to low down. For this, all we need to do is, well, I'm not going to tell you just yet. How about pausing in the and trying to figure out how to make this perfect loop yourself so that the road goes back up. Pause and give it a thought. Well, let's have a look. Firstly, we're going to need an if condition. What we want to check is the y position of our sprite. Here, we need to check if the y position is less than say minus one 60, so we can use this operator to see if y is less than minus one 60. Remember to check which way the arrow is pointing. This way is less than and this way is more than. To help you remember this, pay attention to the size at the start. Here it is going from a size that is less than where it starts, and here it is going from a size that is greater. Now that you know that, we can move our block inside our F and then inside our forever loop. Now all we need to do is change the position back. So we just use a go to block, set x to zero, Handf y, to start off, we can just set it to one 60. Now clicking play, you can see this kind of works. But as you can also see the loop is very off. This is where we need a bit of trial and error to get it perfect. Now, the easiest way to get this is by grabbing two go to blocks. The first, we can set to minus one 60, this is where we change it back, and the next we can set to one 60, which is this block. Now, first click on the first one, then our next one. Well, you can see that the position is just a bit off. What needs to happen is we need to decrease our y a bit. That's better, but still a bit off. Again, a bit more. That looks better. As you can see, it's just a bit of trial and error. Now, although our loop is good, you can see our costu isn't quite perfectly aligned, so we can go back into the editor and try to make some micro adjustments. Again, here, you just need a key fiddling until you get something that looks good. Okay. Well, with that, we can change our y values to this new one here. And when we kick play once more. Yeah, I think the results speak for themselves. Also, although it looks good, if we change from minus one 60 to minus one 50 and play the loop again, you'll see it works out a bit better. That, my friends, is what we call a proper illusion. Obviously, you can endlessly fiddle around to get it even more seamless. But for now that's looking good. I know this has been a little bit of a tedious process, but trust me when I say, this is a very good skill to have. Now we can start looking at coding the other sprites. 28. Steering the Game: Implementing Player Control and Layer Dynamics: Now that it appears our car is moving forward, we can now look to creating the mechanics for our car. Basically, what we want to happen is we want to be able to move our car across the road with our arches. Even need to explain how to do this because I am sure by now you know how to get this code right as we have built the same mechanics in our previous games. If you want to, you can try do this for yourself. Otherwise, I'm going to run through this quickly. If you're keen, pause the video and see if you can figure this part out for yourself. Well, you know the draw. We need a forever, we need two then blocks. We need two of these key press sensing blocks in each of our if statements. Then we can change the first one to the left error and the second to the right error. We can then go into our motion blocks, grab the change x by, and add one to each of these. Then for the right, we will change x by a positive ten as it is, for the left, it will be a negative ten. Clicking the plane now. There you go. Our car is controllable and our game is starting to take shape. One thing however, is, you can see the road is on top of our car. I just going to the road sprite. We can move to Los and we can bring in this block here, which says, Go to, and we can change the back layer. This is another important thing to know about. Like when we look at our screen here, it looks like just a flat image, but there are actually multiple layers and each sprite can be a different layer. You see, layers help us create depth in our projects, making them more visually appealing, and we will be using layers in this project too. Think of layers like a stack of papers or a sandwich. I scratch, each sprite exists on its own layer. When you add new sprites, they're placed on top of existing ones, and this determines the order in which they appear on the screen. But you can change the order of these layers. This allows you to easily arrange your sprites so that some appear on top of others, creating depth and a more polished look for your project. You'll get the idea better as we move forward, but for now, notice how much better this is. 29. Refining the Turn: Directional Dynamics and Logical Flow: Okay. Now we need to change the direction of our car, so it doesn't just look like it's gliding across the screen but actually turning to achieve this, like with our other project, we can use this point direction block. But you might have noticed something strange if you try to use it. That is, if you point in a straight direction and click it, you'll see our car point to the side, which seems rather weird. But there is some sense to this. Scratch assumes that your sprites default direction is facing to the right. Let's take the default cat sprite as an example. When you bring it into your project, you'll see that it really looks like it's facing right. When you use a block to make it face up or zero degrees, it actually looks like it's facing up because it was initially facing the right. Now, I know it's still a bit confusing, but the key here is to understand that scratch assumes all your sprites are facing this way. When you create your own sprite or use a different one, just make sure to adjust its initial direction in the costume editor so it faces the right way when you start working with it. Moving back to our car, we can go into the editor. Okay. And using this arrow, we can rotate our car to have it face right. And here you have it. Now you can see that it points in the exact direction that we set it. Great. Now, let's implement this into our code. Quite simply, what we want to look like it's turning right when we click the right arrow and when we click the left arrow. We can just drag our point direction and put one in each of these f statements. For the first, we can have it at about 15 degrees. For the second, we can set it to -50. Now, if we play again, and then turn, you can see it works. Although there are clearly a few bugs here. The first is quite easy to dress, which is when we start the game, our car points to the side, which doesn't quite look right. We can just add a point direction to the start and have it point straight on the start. Now as you can see, that's much better. Although, as you can also see if we stop turning and just go straight, our car still points in whatever direction, it was last pointing. Now, this is a bit more complex, as we need a way for a car to point straight if none of the buttons are clicked. Once again, pause the video and try to see if you can get this to work and get the car to point straight. Did you figure it out? Looking at our code, you can see we have these two if statements that check if we are clicking one key or the other key. But there is another type of statement that we haven't really used, and it's so super important. If we're going down to our control, you will see we have this block, well, we know what the if block does, if a condition is true, it'll execute some code, if the right arrow is clicked, it'll turn right and with this block, it'll do the same. But if the condition is not true, it will execute any code in this block. Let's see this in action. Firstly, taking all this code out, we can swap it for this. Here we can bring in the right arrow is clicked and then point the erection and change. Then for the ls, let's just bring in this other code. Now, if you hit play, you will see that if you click the right arrow, the car does what is expected. But if the right arrow is noted, the card glides to the left. Now we understand how all that works. Let's bring it back to how it was a useful tip. Just click commands or control, if you're on windows and you'll see your code revert to how it was. Let's do this. Let's swap out this left arrow for this LS then move the code inside. Finally, in the LS, we can bring in a point direction and have it point straight. Well, that makes sense. If we click right, it points right. If we click left, it points left. Otherwise, it points up. Let's give that a try. Well, that's not right, is it? Let's try to untangle this a bit. We have a situation where clicking right doesn't seem to work as expected, but clicking left does. The answer lies in the order in which the code is processed. Remember, in programming, code is run from the top to the bottom. It checks each condition in the order they appear. When we click right, our sprite is indeed instructed to point right. However, there's more code after this at the computer styles to check, which is this here. If we click left, point left. But you see here, if this condition is not true, whatever is in this block will happen. The final block of code gives a command for the sprite to point straight. The sprite will follow this command if this condition is not met because this block is lost, it's ultimately what will be executed. I know programming logic is quite something. But the more you really try to understand it, the more clear it all becomes, it's all about thinking like a computer. That said, how do we fix this? Well, in programming, you generally don't want to have a situation where there are if blocks in a single script or loop. Instead, what we want to use is an F L. Instead of this code looking like this, we will grab another FL. Put this code inside. Put it in the loop. Finally, we can put this if in this statement. Now, if we look at the code, if the right arrow is clicked, this will execute. Otherwise, if the left arrow is clicked, this code will execute, and then only if none of the above conditions are true, no left or right is clicked, our car will point straight. Playing the game again, see now how it runs perfectly. Adding in this if else ensures that this bottom code can only execute if we aren't clicking the right error, and then if we aren't also clicking the left error, then finally, will this else execute. Now all this might be a little bit confusing, but this is really the essence of programming, us understanding the order of operations and how code is executed and organized logically. Trust me, the more you build, the clearer it will become. Play around with it and try to understand it because they are exciting things to come. 30. Creating Dynamic Obstacles: The Road Comes Alive: Well, it's time to get this show on the road quite literally. At this stage, we have this illusion of motion like how our cars driving along a highway and we have the ability to control our car by turning left or right. But now we need to focus on getting our obstacle cars on the road. These are the cars that we're going to be weaving in between as we play through our game. As you can see at this stage, we only have one car sprite, but soon you will see how from it, we can create an endless amount of cars. Again, before we just start coding, let's think about what it needs to do. Then we can consider how we will achieve this with code. So to further the illusion of motion and to add an obstacle that we must avoid, we want this car to look like it is driving at a slower speed than our car. So it would be coming slowly down a lane like this. Then we would need to dodge it by turning left or right. So let's try to tackle the first problem. Moving over to our car sprite. We can first attach a forever block onto this current script, simply, all we will do is have the car slowly move down the screen by changing the y bi negative value of say five. Then hitting play? Well, it's perfect. Because it's coming down the road. I still looks like it's moving forward because it's moving back slower than the road is moving back. But now that we have this car moving, you can see it just stops when it gets to the end of the screen. And this works perfectly. Well, perfect, if all we want is one obstacle in our game, which isn't the goal here. Instead, we need the car to go back to the start of our screen when it reaches the bottom. Well, to do this, we need to add some condition check. But if you move over to our motion group, if you remember, we had this y position and we can use this to check what the y position is of our sprite, which means we can check to see if our sprite has reached the end of the screen, and if it has, we can make it go back to the top. Firstly, what we need is an if statement, you'll notice here that you can't put this y position block in the F statement. Well, for obvious reasons, it's like if y position then do something. Well, that doesn't make sense. What we need to do is check the y position is lower than a certain value. And just like with our road lines, we can do this by grabbing this green block from the operators group. This is what checks if a value is greater than or less than another. Remember, to pay attention to the size at the start. Here it's going from a size that is less than where it starts, and here it's going from a size that is greater. We want to check if y is less than -210, which is basically the bottom of the screen. Now, if this condition is true, we want our car to go back to the top of the screen. All we need to do is bring in a G two block and set the y value to 210, which is basically the top of the screen. Play Well, as you can see, our car drives down and when it reaches the bottom, it goes back to the top. It's nice. That's looking pretty good. But there's still one more thing we need to address. That's our car. Well, it keeps coming down the same lane, which would make the game pretty easy because all you need to do is drive in any of the other lanes and we would win. We don't want cheap wins here. So what we need is for the car is somehow randomly switch between each of these lanes every time it goes back to the top. Now, this is a little bit more tricky than you might think. But let's start with what we know. We know that this will have something to do with the x value. As right now, we set it to zero each time it goes to the top. We need to change that. We also know that it has something to do with picking a random number. To start off with, let's just bring the pick random into the go to x. Now we can see what the upper and lower limits will be by dragging our car to the first lane. Yeah, you can see it is at minus 145, and the last lane is well 1405. We can have x be set to a random number from minus 1405 to 1405. If we play, you can see that each time our car reaches the end, It switches lanes, which is good. But the problem is that sometimes it goes in between our lanes, which isn't good, and this is where it gets a little tricky. We need to change the way we approach this. Instead of setting the number between minus 1405 and 1405, we need to do a bit of math, fun. What we need is a plus block and a times block, and you'll see why. Our exposition of our car can be a minimum of minus 1405, we can enter that into our first plus input. Now there are five different possible lanes that our car can be in at any moment. What we need to do is work out the space between the lanes. Our first lane is minus 1405. If we move it to the second lane, It's at -70. Now, 14570, it gives you 75, but we can just say around 75 75 is the distance between the lanes. If we move this times block into the plus block, we can enter 75, as there are five lanes, we can again use pick randomly, and here we can set it to 040 seems weird. Why not one to five. This is because well, minus 1405 is our first lane. And anything times zero. So if the random number is zero, our car will be in our first lane. I know this might be a bit confusing. But as you work more with these types of blocks, the better you understand it. But of, let's see this in action. Well, that looks almost perfect. We can adjust it just a smidge to get it even better. As you can see the last lane is a bit far, so let's just change this to be 74, it's all about trial and error. But yeah, that looks really good. Now just sit back relax and enjoy your creation because it's only going to get better. 31. From Obstacles to Traffic Jam: Mastering Cloning for Dynamic Obstacles: Well, I think is really starting to take shape. We have our road that move down constantly. We have a car that we control. We have our obstacles that we have to avoid. Now let's turn this o into obstacles by generating more traffic by adding in more cars. You may be thinking to yourself, well, this is easy enough. All I need to do is duplicate this obstacle car a few times and Bob's your uncle. Well, Bob, maybe you Uncle, but that's not really the solution. Well, let's give it a try show. You know, as I say, the simple solution is the best solution and this sure sounds simple. Right clicking on our car, and then hitting duplicate, and let's do that one more time. There we go. Now we have three cars ready to go. Let's test us out. Well, that's somewhat works. But our cars all appear at the same time and sometimes in the same line. We could just go to these duplicated cars and a wait slab at each of them at the top of the script and have it be 1 second and 2 seconds to have them evenly spaced and once again, hitting play. Well, after we wait for these cars start moving. You can actually see it works pretty well. Now, if it all works so well, then why don't we just use the solution. Let me introduce you to a little acronym, which is called dry code, D R code. What dry stands for is don't repeat yourself. Let me say it again. Don't repeat yourself. Uh huh. That's very funny. This is very popular saying in programming is often duplicating code might sound like the easy solution. However, when you start doing this, things can get really messy. It also makes things hard to maintain. For instance, if I wanted to change the speed of my cars, I couldn't just change it in one spot. I would have to go into each sprite to change it. That being said, let's look for a smarter solution. Firstly, deleting all these duplicates. Then going to our main obstacle sprite and finally going to the control blocks, you will see we have these blocks here. When I start as a clone, create clone of and delete this clone. And these are really important blocks. Dragging them down, and then, let's have a look. Let's test this out by bringing this create clone of myself inside of this F statement. Then hitting play, you'll see that each time our car reaches the end, a new clone appears at the top. But you also see that these cars don't really move. They just stay there, which isn't really idea. Will that my friends, is what this block is for. Basically, what is happening is our script is playing, and then when this condition is true, it creates a clone of itself, which is the obstacle car. C is essentially an identical copy of a sprite, such as all the costumes it has, the sound effects, and more. However, one key difference is that a clone isn't the same as duplicating a sprite because as you saw, the dupliclatd sprites move like the regular ones, while the clone just was stuck at the top. That's because the clone doesn't have access to the script because this script is only activated when the flag is clicked, and that only happens once at the beginning. This is where this block comes in. It allows us to add code to our clone sprites. If we simply duplicate this code and add it to when I start as a clone, then play, you will see that each time I character reaches the end, a clone is added and has the same functionality. But as you can also see, it really just doesn't stop coning. But I think you get the idea. Now that you have a good understanding of the important concept of dry code and coning, don't repeat yourself. Let's make this work. Firstly, we can get rid of the code in the code block as we can also disconnect this code from the win flag click button. Now we can add a forever block and weight block, and then this create a clone of myself block. Basically every second will create a c of itself. Now for the important but, Let's drag this code here onto when I start as a clone. Remember, we can't keep it like this because it'll just keep creating new cones. Basically, what we can do is when the car reaches the end, we can delete this c, let's test. Once again, that's not quite right. The car is just driving alive. This makes sense, obviously, because if you look at the code every time the car starts at a clone, it goes to zero x and one 90 y. All we need to do is get rid of that and then move this go to random position to the start of the script. Once again, if we hit play. Well, that works a lot better. There are two small bikes we can fix. Firstly, let's hide our main sprite, so it doesn't stick to our screen and then show our clone sprite. Also, we can change this go to y to a high number like 250, which makes it look more seamless. There you go. It's working properly now. If you follow along, that is absolutely amazing work on completing this lesson. We really covered some ground here, well done. Let's keep up this momentum and start bringing this game to life. 32. Randomizing the Road: Creating Lifelike Traffic Patterns: Okay, so our traffic is looking pretty good, and there's no design that, but we have two problems. Firstly, the traffic is generated at a very consistent rate, as you can see, It's just one car, the next car, the next car, and so on. They should really spawn at different rates. Secondly, they're all the same car. If you look at the costumes, you can see we have multiple different car types. This is your mini challenge. I want you to try and solve both these problems. Firstly, making the car spawn at different rates, then having them be different cars. Come on. You can do this. Pause the video now and give this little mini challenge a shot. Well, did you work it out? If you haven't worked it out yet, it's all to do with random numbers. Let me show you what I mean. Firstly, to get the car spawning speed to vary, all we need to do is drag a pick random into this weight block, and here we can have it vary from 0.6 seconds to 1.2 seconds. If we had plate, you can see that it looks a lot less robotic and a bit more natural. Finally, to make it look less like the cars are coming off a factory line and more like normal traffic. Here we can use costumes. Going into the Ls and then adding this switch costume right to the start of our script, we can have a change. You see, if you click on here, we have six different car costumes. Here again, we can also add a pick random. Because we have six costumes, we can pick a random one 1-6. Now when we hit plate, well, that looks a lot better. It's actually starting to look like a proper game. Great work so far. 33. Bringing the World to Life: Animating the Scenery: Okay, now we are in the final stages of this before we add in a crash detection, let's try to get the scenery to move so our game can feel more immersive. What we want to happen is for this tree sprite to come down the side of the road as we start driving and to make it feel like we are passing scenery. This code will be very similar to our code for our obstacle sprite. Let's just copy it over and see what happens. Moving over, we can just drag these blocks. And when you click play. Well I think that's to be expected. Our trees just act like cars and as silly as this is with a few modifications, we can get this to work for us. Obviously, we don't want our trees in the middle of the road and we can fix this by taking out this block inside the go to block. Here we can then add in a pick random. B we want it on the side of the road, we can have it pick a number between minus two 50 and -200. And I think we can also keep the size here the same as it looks right, hitting play again. Look at how much better that is. The only thing now is that our trees are moving at a different speed to road. If we move back to our roads bright, you can see we have the speed set two minus ten. Let's do the same for our trees. Play again. That's definitely better. Although one small problem we have here is the trees are stacking up at the bottom of the screen, but we can easy fix this by changing this F y check here let's change it to let's say -200. Also, let's increase the spawning speed a bit by adjusting this pick random from 0.6 to 1.20 0.620 0.3. Well, that fixes that. Trees spawn more quickly. Good job, but there's still a problem, and I'm sure you can see, which is that we only have trees on the one side of the road. And we could just duplicate the sprite, which would work. But as you know, it's always good to keep your code dry. As in, don't repeat yourself. Let's think of a smarter solution. Right now, when our trees start as a clone, it goes to a random position between minus two 50 and -200. But we also want 202 50 as an option because this is the right side of the screen. First things first, let's duplicate this pick random and then changes values to 202 50. Okay. Now that we've done that, how can we have it that sometimes it chooses this pick random, while other times it chooses this pick random. Well, pause the video and try to see if you can figure this one on your own. Although it's not as easy as you might think, but I bet you're up to it. As always, there are different ways we could get this to work. But I'm going to show you how we can use variables to solve this. What we can do is create a variable called sides. Then we can add this code block to the start of our when I start as a cone script. Then make sure you change this to set sides input. After that, bring in a pick random and here we will set to be just one or two. Now we can grab and then conditional, we can grab this equals two operator, and finally, the sides variable. What we want to do is have it like this. If sides equals one, then do whatever is in here, or if sides is not one, which is two, then do whatever is in here. We can drag this go to block inside this first condition. Then we can do duplicate it and switch out this pick random for this one here. Then finally connect all these blocks together. Let's run through this quickly. When we start as a clone, we have a variable sides, which will set to be either one or two, which indicates left or right. Then if size equals one, the trees will spawn on the one side, and if size equals two, they'll spawn on the other side. Hitting play there you have it. We have trees spawning on both sides and it looks good. I think we're almost there. Just a bit of collision detection and our game will pretty much be done. 34. Final Touches: Collision Detection and Spinout Animation: Well, this is it. It's time we make this game by adding in some collision detection to detect. If we crash into a car hit the sides of the road. We will also be adding in a cool spinout animation to give it a more dynamic and dramatic effect. But first, let's add in a dead simple crash detection. Moving to our main cast sprite, we will grab the standard when flag clicked, then forever, then, we can add in this touching block and change it to detect obstacle cars. Finally, if it does, we will have it stop or. Well, that's simple enough. Let's give this a go and see runs. Sir. Moving along the lines. A is dandy. And then if we say crash into this car here. Well, there you have it. Not bad. While we'll add it. Let's also check to see if our car is touching the edge of either lane. And we can simply do this by grabbing another two checks greater than operator and a less an operator. Then up in the motions group, we can use this exposition block, which is the current exposition of our sprite. So bringing that into both, and finally, we can check if our cars exposition is greater or less than negative 1805. Adding a stop or into both of them. Before we play, let's quickly see what we have going on here. Basically, if our car is touching the obstacle car, we stop all, and if our cars exposition is past 1805 or negative 1805, which is past the edge, we stop all. Let's give this a trip. As you can see, if we try to leave the road, well, our game ends, that's what we'd like to see. Now for the final touch, let's add our spinout crash animation. So what we want is for our car to basically have a little animation where if we touch an obstacle or if we go off the road, our car should spin. I think the best place to start with this is in the motions group because here we have this turn block, and if we click it here, you can see our car turns. That's pretty much what we want. We can bring this block and then because we wanted to turn a few times to make it look like it's spinning, we can grab a repeat block. If we put this in here and you can see how our car looks like it's spinning. Cool. Now we need to do is duplicate this block two times. And then add it to each of our conditional checks. Well, if we look at our script. If any of these conditions are true, if it touches an obstacle car, it should first turn ten times and then stop. Let's give that a go. Driving down a road, all is good. Then if we hit a car, well, that's not what we wanted. It just turned for a split second and face back to the front. But if you look at the code carefully, that makes sense because well, this code is actually working fine, but this code is interfering with it because this bit of script here is constantly getting our car to point straight if we are not turning, this messes up our animation. Now, one way we could fix this is simply dragging in this entire block of code inside this forever loop. This way, these two scripts won't conflict with each other is if one of these conditions are true. Like if we hit a car, the code won't move to the next bit of the script until it's finished, meaning it will first play mission and then stop. Giving this a go. You can see it works. But this isn't exactly a clean solution. A now we have two different types of scripts merging into one, which can make it hard to understand and edit your code as you move forward. Hitting commands or the undo or controls. What we can do instead is grab another one of these stop blocks, but change it to stop other scripts in the sprite. Then duplicate it twice, and finally add it to the start of each of these conditional checks. If you look at our code now, if we touch anything, we will stop any other scripts in the sprite running like this one here. Then we'll play the animation and then stop all. Before we give it a go, let's just change this turn by to something less than eight. Finally, giving this a go, driving down, all as well. Then hitting in a car, there you have it. Outstanding work. This is very much a playable game, and you should be proud to have got this far. Sit back, relax and enjoy your accomplishment because in the next section, we'll be looking at how we can transform this game with levels, dynamic variables, sound effects, music, and a whole lot more. 35. Leveling Up: Injecting Dynamism into Gameplay: Well, you've come so far and built a really great game and is almost ready for publishing. However, one issue we have is the staticness of our game. Like, there are no levels with increasing difficulty. Our car moves at the same speed. Obstacles cars also spawn at the same speed, and all this leaves us with a pretty bland game. So, how can we fix this? How can we make our game more entertaining by increasing the difficulty? Well, we know that one way to increase the difficulty would be by increasing the rate at which obstacle cars spawn or even better by making them move down faster. So moving to our obstacle car, let's see the two areas that control how fast our obstacle car moves and how fast it spawns into the game. Firstly, as you can see our obstacle car waits 0.6 to 1.2 seconds before it creates a cone and spawns in. This is the one part of code we would need to adjust. Then, looking at this script, you can see that the car constantly changes y by minus five. So this is its movement speed, and the other part, we would also need to adjust. So now that we have identified the two parts of the code that control the speed and spawn rate of the sprite, how can we make it that it keeps getting harder as the game progresses? Well, we could just keep duplicating this code and duplicating it and duplicating it and duplicating it. Then, for instance, change this to 0.5 and 1.1 and just keep making the spawn time shorter and shorter. But I think you know that that's not the way to go. Because as you remember, dry code is important, meaning, don't repeat yourself, we're certainly repeating ourselves here. Instead, just like with the other game we created, we can use variables to control our game speed. But before we go ahead and change, this is important that you understand just how important variables are in programming. Now, often it's tempting to just enter in a values such as this change i by minus five. Programming, this is what is called hard coded values. While this is okay to do sometimes there are a bunch of disadvantages too, let's just take a moment to consider some of them. Firstly, lack of flexibility. Imagine you've built a game with ten levels, all with hard coded difficulties. If you want to change the difficulty rate, like how quickly the game gets difficult, you'd have to adjust each level individually. Now, that's not a very efficient way, right? Secondly, updates and expansions. Let's say your game becomes popular and you decide to release an updated version or expansion. If everything is hard coded, making consistent changes becomes a very tedious task. Just like with our game, we would need to change the increased speed value for our trees and our road. And lastly, consistency issues. One of the main problems you will face is consistency, meaning, if we have a small change we want to make in our game, we would need to find every value that is affected by this change, and if our game is large, this task becomes nearly impossible. That all said, we can make our code a lot better by using variables instead of hard coded values wherever possible. Then what we can do is have one space where we adjust all the variables. And this way, our game is easy to manage and upgrade. Moving over to our variables. Think about what variables we need to create to make our game more adaptable and scalable. Well, the two things we want to control are our spawn speed and our movement speed. Let's create this. Firstly, hitting make variable. We can call this first one spawn speed, hit Create. Once again, we can call this next one movement speed and make sure it's a global variable by ensuring this button is selected. So, let's do this. Now, firstly, let's change our spawn speed. Right now, it is this hard coded value of 0.6 and 1.2. So instead of 0.6, let's drag in the spawn speed variable. Then as 0.6 is double the size of 1.2, we can set the second input to spawn speed multiplied by two. Right now, our cars won't move as our spawn speed is set to zero. But to test this out, let's quickly set it to 0.6 by simply selecting it here, entering in 0.6 and double click. As you can see, it has changed. Now hitting play, There you have it. I mean, nothing has changed, but it soon will. So get ready because in the next lesson, we're going to totally upgrade this game and make it truly adaptable. 36. Strategic Game Evolution: Mastering Variables for Dynamic Gameplay: Right. So far, we have just changed the spawn speed to a variable for our obstacle car. But as you know, our trees and foliage also have the same spawn in effect. Let's do the same for them. Moving over to this sprite, you can see that it is set to 0.60 0.3. Our spawn speed is currently 0.6, and we can simply drag this variable into here. Then as 0.3 is half of 0.6, instead of timesing it by two like with our car, we can divide it by two. Grabbing this divide from the operators, sticking in our variable in typing in two, and quickly hitting play. Once again. Nothing new happens yet. But as you can see, it works. So now that our spawning speed has been switched from hard coded values to variables, the next thing we need to change is our movement speed. Now, in our code, we have three different sprites that move down. We have our obstacle sprite, our tree sprite, and our road lane sprite. Firstly, with our road sprite. As you can see, our movement is determined by this change y by negative ten value. Let's simply grab our movement speed variable, drag it into here. Then let's quickly set our movement speed variable to minus ten and double click. Then if we hit play, as you can see, that works perfectly. Next, moving over to our tree and foliage sprite. Here you can see, we also have movement set to a hard coded minus ten value. So quite simply, we can just replace this hard coded value with this variable, and that's it. So finally, we can move over to our obstacle car. Here, as you can see, we set this value to a minus five instead of minus ten. And we did this because we wanted our car to move just a bit slower than our road, which gave it the illusion that it's moving forward. Once again, we can swap out the static value with our movement speed variable. But to make sure that it moves at a slower speed than our road and trees, we can grab a plus operator. Stick it in here and enter in five, since minus ten plus five equals minus five, we get back to the same value we had before. So, finally, clicking play, we can test out if everything is working. And yep, our game is running as it was before. However, our code is now super robust and adaptable. So time to move on to the fun part. We put in a lot of work restructuring our code, but our game basically plays the same as how we had it. Let's look at how we can make use of this new and improved code by adding levels to our game. But before we change anything, let's first create a new sprite. Now, it really doesn't matter which sprite you select and you will see y in a second. But after you've selected the sprite, we can also go into the costume editor, select the entire object and hit backspace. You probably really confused now. But basically, what we're going to do is use the sprite to set all our variables in our game. Now, why this is nice is because we have one space where all our variables are set, and this makes it easy to change values, upgrade, and make changes to our game. And also, it keeps us super organized. Plus who doesn't like to be organized? Well, at least when it comes to programming. So first things first, Let's add in our most crucial block when start click. Moving down to our variables, let's drag in two of these set variable value blocks, and here we can set spawn speed and movement speed. What we want to do is just set it to the current value we have it at now to ensure our game always started the speed. That's 0.6 and minus ten. Now to increase the difficulty, all you need to do is grab a forever loop weight block, and then two of these change variable by blocks. With that, we can set our weight to 8 seconds. Then we can set this block to change spawn speed and the other to change movement speed. So, for our spawn speed variable, it is currently set to 0.6. So we only want to make small adjustments here. So what I'll do is change the spawn speed by -0.02. This way, our cars will slowly start spawning in faster. Then for our movement speed, we can change this value by minus one. Now before we hit play, let's quickly understand what is going on here. Firstly, our game is set to its initial level one speed. Then every 8 seconds, we slowly decrease the amount of time it takes for our cars to spawn in, and we also decrease our movement speed by minus one, which gets our cars and the obstacles to appear like they are moving faster and faster as the game progresses. Now, this time if we play the game, you'll notice that every 8 seconds, these values decrease, and our game starts to get faster and faster. Now before we wrap up this lesson, let's quickly add a score element to this game for bragging rights, of course, to do this, all we need to do is create a new variable which we can call score. Next, we can add a set score to zero, like we have with these variables. Finally, every 8 seconds, we can go ahead and change the score by let's say 43 because who doesn't like a large score to motivate them? Before we click Play, let's quickly hide these other variables, and then move our score variable to the top. Also, we can just double click on it, so it displays as one large number. Well, with all that done, we now have increasing difficulty, a score, and most importantly, super robust code that allows us to adjust values in all our spaces easily. Now for the absolute most important part, go and keep on playing the game until you reach a high enough score that you can brag about. Well done. You are really doing great. 37. Mini Challenge: Integrating Variables for Enhanced Game Mechanics: Now's the time to put your amazing programming skills to the test. This is your mini challenge. If you remember from our early lesson, we discussed a three step process we could use when developing games, which were firstly, setting up the basic structure, which is importing our sprites, understanding what the sprite should do, and overall how our games would work. Second, developing the gameplay mechanics, which is basically all our code that gives our games its functionality like obstacle cars moving down the road, or our player card, moving left to right. Then thirdly, polishing the game, and this is a step we are pretty much in now. We're at the point where our game is looking great, but we just need to give it that extra touch. And one way we can do that is by adding in music and sound effects. So this is your challenge. I want you to figure out a way to add a sound when a obstacle car passes our player car at a close distance. So just like if you were on a road and you hear a car speeding by, it would make that sound as it passes by. So I want you to do the same for this game. Two tips I will give you is that the sound you should use is called car you're going to need to use code within the sensing group. With that, pause the video and try to see if you can add the sound effect to your game. Okay. Well, how did that go? Because it might not be as simple as you first thought. Well, let's do this t. The first thing we're going to do is select our obstacle car sprite as this will be the sprite making the sound. Then we're going to click on the sound tab and choose the sound that I mentioned carvem. Now, with that added to our sprite, we can get to work. So we want this clone to interact with our cast sprite and make it play the sound when it gets close. So we can utilize this for ever loop found in when I start as a clone script. Here, what we need is to check if our clone sprite comes within a certain distance of our cast sprite. So we can move over to the sensing tab and grab this block that is called distance two. Here, we can change the input from the mouse pointer to our player car. And then what we need is less than operator, so we can grab one of these, just like you see the code here, when our y is less than minus two ten, our cone deletes itself. Instead of that, we can check if the distance of our player car is less than 90, and if it is, we can have it play the sound. So all we need to do is grab an if conditional, and then this start sound code. Then stick it all together, and finally drag this whole block inside our forever loop. Now, hitting play, as you can see, when we pass by a car real close, it now makes a sound. Yes, you'll notice that it sounds like it's glitching out a bit, and this is basically because our code keeps playing the sound continuously until our car is out of reach. But don't worry about that right now as when we add in our background music soon, it'll all come together. Well, that's it. With that, our obstacle car has a cool sound effect, give it a try. If you didn't manage it, because in the next lesson, we're going to add some final touches that will complete our game. 38. The Final Touch: Enriching Gameplay with Sound Effects and Music: Well, this is it. It's time to finish this thing off. So, to finish off this game, we're going to add in a few more sound effects, and then add some background music. So let's start with the easiest because, I mean, who doesn't like doing the easiest stuff first. But we want to add some nice background sound to our project. So clicking on our backdrops, right, we can add in a when flag click and a for volute Then moving to the sounds tab and hoovering over this button. We can then select upload sound. And here we can select a background sound from our music and sound effects folder. For this game, we can use funk casino. Moving back to our code, we can drag in the play sound until done block and select funk casino or whatever sound you upload. And hitting play. Notice how much better that is. And also notice how our sound effect for our car works a lot better. I actually sounds quite good. So with that done, let's move to our next sound effect, our car skidding sound effect. And here, basically, what we want to happen is have our car make a skidding sound when we hit into an obstacle. So moving over to our player car sprite, we can add in this sound. So clicking on the sounds tab and choosing a sound, we can then search for skid. Which is a swing here. So selecting it and moving back to our code. Now, what we want is for our car to play this skidding sound when it touches an obstacle. So if you look at the script here, this is basically the script that senses if our car is touching an obstacle. So all we need to do is add in this play skid sound to the start of each of these checks. So adding one to each. We can then hit play. Hit it's an obstacle. Yeah. That's not quite right. But basically, what is happening is our play skid sound is interfering with our other code because if you look at the script, it plays the skid sound until it is done before it moves to the next blocks of code. So to fix this, all we need to do is remove all these play skid sounds until done blocks and replace them with this start sound skid. And with that, we can play again. It is an obstacle. Then you have it. That's much better. Now, before we wrap up this lesson, there is just one more thing, and that is changing the pitch of our obstacle car so that as these cars pass by at a faster speed, it sounds faster too. So moving over to our obstacle car sprite, all we need to do is grab a win flag, click, then this set pitch block and set the pitch to zero, which is basically setting it to default when the game starts. Then grab a forever loop. And then we can put this change pitch effect by block inside our loop. And finally, to make sure the pitch doesn't instantly go extremely high. We can add weight block and change it to, let's say 10 seconds. I'll let you test that out for yourself because we've reached the end of our lesson and the end of our section, and we've completed this game. Really, really great work on getting this far. You have certainly accomplished a lot. So give yourself a good pad on the back because you really do deserve it. 39. Embarking on Arcade Ski Adventure: Conceptualizing the Masterpiece: Well, this is an exciting moment because this is the start of your next masterpiece. As in this lesson, we'll be starting to develop our next game. I hate to say that, but this one will put all your past projects to shame. Let's do this. And I think by now, you know the drill. First things first. Let's start by creating our new projects. And just like all the other times, we can do this simply by clicking this button here. Now, before we do anything, if you look to the top here, you can see our project is just called untitled, which is a bit uninspired. The first thing we can do is rename this to arcade ski Adventure, or whatever you like. One more thing, you can delete this default at sprite, as we definitely don't need it in this project, no skiing for the cat. Now, with that out the way. Before we import any sprites or do anything, we need to get a high level overview of our game to understand what it is, what it does, and then what steps we can take to achieve this. Because remember, it's important to break down a big problem into achievable steps. We discussed how we can follow a three step workflow when making games, which we're setting up the basic structure of the game, then developing the gameplay mechanics and finally polishing the game. Now, those three steps are cool. But while this method works great for smaller games, for more ambitious projects, we need a more detailed plan of action. So let me introduce you to the expanded five step process, tailor made for larger games, and following this guide will help you a lot with the exciting games, apps, and animations you will produce in the future. Stage one, ideas and design. At this stage, it's all about ideas. Imagine it as sketching the blueprint for our game. What's the story line? What kind of characters are we looking at? What's the central theme. By the end of this phase, we'll have a comprehensive game design idea that outlines everything about our game. Stage two, setting up the foundation. Think of this as laying the bricks and mortar for our game. Just like before, here we will be importing all the sprites you need and then laying them out, so you have a better idea of how it will all work. Stage three, developing core gameplay mechanics. Here our game starts to show signs of life. This is where the real action begins, coding player movement, setting game logic, designing levels, and everything that makes our game well, a game. Stage four, enhancement and expansion. Now that we have a playable game, it's time to add layers to maybe a new level or a challenging enemy or even a surprise power up. This stage is all about adding features and upgrading our game. So when you get to stage four, you need to go back to stage one. So let's say we want a new enemy in our game. Here, you would have to go back to the design stage, then to importing it, then to developing as mechanics, if you get the idea. And then finally stage five, polishing and finalization. This is the final touch. We'll refine the graphics, introduce sound effects, fine tune the user interface, and rigorously test our game to iron out any bugs and enhance the overall user experience. So by following the structured five step process, we'll ensure that our game development journey is organized efficient and most importantly, enjoyable. And remember, every big game starts with just a simple idea. With careful planning and step by step execution, there's really no limit what we can achieve. But with all that out the way, let's get going with step one. This should be quick enough because we already know what we want for our game. Basically, we want something not too different from our last game. Here we're going to have these obstacles that come towards us that we need to dodge. This again, we'll give the player the illusion of motion. But this time, it will look like they are skiing down a mountain through a forest. Here we want the trees to fade into view and our player to have a nice turning effect. We also want our player to have snow pixels that follow them, which should look like ski marks you would see in normal snow. And that's basically it for the first part of our game. Then we add new things like a start screen, a restart button and other exciting stuff that we can revisit these first steps. But get ready because for the next lesson, we will be incorporating all our sprites. 40. Structuring the Stage: Importing the Arsenal: Well, it's time for step two, which is to properly organize our project by importing all of our sprites. Now, remember for this stage, we are not going to import our starts green and other features into the game. A remember, with our workflow, we discussed before, we will do this later on. This also makes things a little less overwhelming. That said, however, if you don't want to follow along and manually import these things, you can also download the starter version of the project, and just like before, by clicking this button, then clicking load from your computer. Then selecting the starter project. Here, you will see that we have all our sprite ready to go, yes, this also includes our start screen sprite and our buttons. That said, however, as I want you to learn the process of developing a game properly so you can do it by yourself and practice makes perfect. Let's do this the proper way. Now, let's bring in our first sprite. Clicking this button here, we can select our player sprite, which is located under this folder. As you can see, there are three different sprites to choose from. And this is because there are these different costumes. We can just select any one of these as we will add the rest just now. Hitting open. Here, you will see our player sprite. Now before we add the obstacles, let's quickly add the other costumes for the sprite. Moving over to the costumes tab, and clicking here, we can then select the other two costumes. With that done, we can now import our tree sprite, which are the obstacles in our game. Clicking this button here and then moving over to our tree sprite folder here. Just like before, we can select any one of these obstacle sprites. Once we've done so, we can move over to our costumes tab and then select the rest of them. And there you go. We have all our sprites ready to go. And before we move on to our final sprite, there are just a few modifications we need to make, which is how this bush costume is just way too large, so we can simply select it and shrink it down like this. Also, we can do the same for these stones as they are also, but big. Okay, nice. So before we add in our snow sprite, let's just size these trees so they look right because as you can see, they are definitely still to for our tree sprite, let's say it size to 50, which looks a lot smaller compared to our player, which doesn't really make sense unless our player is some sort of giant. Let's say our player sprite, a lot smaller, let's say 17. So now as you can see that looks a lot better. The last thing is our snow pixels. And this time, we are going to make our own. Now, to do this, instead of selecting Choose a sprite, we're going to click this button here, which allows us to design sprites of our own. With this, we can select the square shape. Before you do anything, we need to change the color to be more gray like snow. Selecting this button here, we can decrease the saturation and the brightness. As you can see, we have a nice gray color. With that, we can draw a small square right in the middle of our screen basically because we want this to be like a snow trail, we can decrease the size, and here just playing with it until you find something that looks right. That looks okay. With that, we need more snow pixels for the other ski. But instead of doing all that again, we can just hit this duplicate button. And while we're at it, let's give our sprites a name like snow pixel one and snow pixel two. Then you have it. All our sprites are imported and ready to come to life. So get ready because these next few lessons are going to be lots of fun. 41. Initiating Motion: Crafting Player Dynamics: Right. So we have all our sprites in order, and we're ready to start working on our gameplay mechanics. And to start off with, let's get our player sprite working. Now, just so we can focus on one thing. Let's quickly hide these other sprites by just clicking this icon here, and we can do the same for this. And there we go. Now, let's move our main player sprite down the screen somewhere near minus one to five. There we go. So we have our player sprite to be able to move from left to right on the screen, thankfully, we know pretty well how to do this because of our last project, you remember? Let's just bring in the basic blocks once again, the W start forever and F and also the F L block. To get our plate to move left or right, we can grab two of these key pressed code blocks and change it to left and the other to right. Then we can put them into each of these F inputs and structure it just like we did before. Now, before we add in our change x by and point direction, let's duplicate this script here. Basically, I'm doing this so we can have two separate scripts, one that controls our pointing direction and the other that controls our movement. Doing this keeps our code a lot more organized by ensuring each script we have doesn't try to do too many things. This is called componentization in programming and it's a very important concept. I also makes our code more reusable, as we can create scripts that do certain thing well, and then we can use the script in different projects. Compared to if we were just to have one long entangled script that was specific only to one project. Like we could use this movement script somewhere else. But if it had the point direction with the movement integrated, it would be much more difficult to use it with other code. So let's start with our movement script. So I right arrow clicked, we can change x by ten, if left arrow clicked, we can change x by minus ten, and clicking play. As you can see, our movement works, and yeah it's a bit rough. But we'll be improving this soon to make it look more smooth. But for now, we'll roll with this. Let's get our direction animation working now. Basically, like we did before, if right arrow clicked, we can add in this point direction and point to the right and if left arrow clicked, we can point to the left just like that. Let's try that out. Okay. That's not right. And if you remember from before, because our Sprites costume position is not facing right, we have this problem. Now, instead of changing the costume direction and the editor like we did before, let's look at another solution. Here, we can just set point right to one oh five and point left to 75 and forward to 90 degrees and clicking play. You see this works. Although it might be better practice to change it like we did before. But as I say, if it ain't broke, don't fix it. With that done, all we need to do is switch the costume. And this is easy enough. So if we click the right arrow, we can change costume to right and the L to the Ford costume and the left to the left costume. Just like that. To easy. Clicking play. As you can see, it looks a lot better, but I encourage you to play around the code, see if you can maybe tweak it to be even better because we are only getting started. 42. Enhancing Realism: Mastering Ski Dynamics: It's time to make our skiing character look more like they're actually skiing and less like they're driving. Because right now, our character just moves left and right, sort of similar to our car. However, what we want, is to be able to almost glide as if you were in the snow, meaning if we move to the left and then let go of Akes it should keep sliding for a bit, whereas at the moment, our character just stops. So how can we achieve this more dynamic and smooth turning motion. And at first, there may seem like there is no obvious answer here. You may be thinking to use this glide block here, but you can only glide to a specific position and can't just change your position with a gliding motion. However, programming is all about problem solving. Using the tools we have, and one of those tools are variables. Here, there are a lot of things that variables can do. Let's see how we can use them to our advantage. Let's create a variable and we'll call it movement direction. Now moving back to our script here, let's remove this change x by in DF statements and drag one of them into the four loop. I know this seems strange, but bear with me. Then drag this movement direction into the change x by. Now finally, if the right arrow is clicked, I want to change the movement direction by one. If the left arrow is clicked, I want to change the movement direction by minus one. And I hope this is starting to make sense, a, because basically what is happening in the script is our character is always moving in the direction of this variable. And the value of this variable is determined by the if we click the left or the right arrow. So let's give this a test. So as you can see, when we click the left or right, our movement direction variable goes up and down. Also, as you can see, our player movement is a lot smoother, and it feels a lot more like actual skiing. However, there's a problem you might notice. And if we let go of our keys after turning, our play just keeps drifting off into the direction it was going, which is definitely not ideal. So to fix this, we need a way for our variables to automatically return to zero. And you may be thinking, Oh, we just stick this inside of our als block. Well, testing that you'll see. If we ski to the left and go, well, that's a bit harsh. O you'll notice that if we ski to the right, it almost goes in slow motion. Well, that is just because our F script is badly set up because if you look at it, we have an F L statement and an if statement below it, which is never something you should do, as the L should always be the last in the conditional check. Let's fix this mistake now. To fix this, all we need to do is grab another if L block. Then stick this code inside, get rid of the if statement, and then finally put all this code inside our F L. Now if you look at it, you can see that our LS is the final condition. If we play, it doesn't go in slow motion, although we still have the same harsh stopping problem. But before we fix it, let's quickly fix this other script, as you can see we made the same mistake here, much better and much more clean code this. Now, let's fix the last problem of our character just stopping when we let go. The first thing we can do is get rid of this set movement direction to zero, and here we need a way for it to slowly bring our variable back to zero. The best way to do this is by using our old friend mathematics, but thankfully not the hard type. So we're going to need some more if checks. Let's first grab one more of these, if blocks, and one F block. We'll put the first one inside here, and the second one inside this one. Okay. For this first F n block, we basically want to check if our movement direction is already zero. And if it is, we don't want to do anything more. So to do this, we're going to grab a few blocks here, which are the two movement direction variables, a greater, a lesser than and an block. So we can connect all these together just like that. And here we want to check if our movement direction is greater than 0.1 and less than -0.1. And what this is doing is basically checking our movement direction is not equal to zero. So we can put this in our first F condition. Now to the next one, simply, we can just duplicate this here, stick it inside our F statement, and set it to zero. Basically, now, if movement direction is less than zero, we want to change movement by a positive number to slowly bring it back. Let's say 0.2. Then finally, in this L statement, we can change movement direction by -0.2. This may all seem a bit confusing. But if you look at it as a whole, it's not so confusing. Go through it from the top. Basically, we are first detecting if our sprite is moving. If it is, then we want to slow it down. If it is moving to the left, we slow it down by increasing this number. Otherwise, if it is moving to the right, we decrease this number. That's pretty much it. Let's give it a go. Skiing left and right is working well. Then letting go of our keys. As you can see, our player slowly comes to a stop perfect. Now we can hide our movement direction variables as it's all working. That's the end of this lesson. I know it might have been a confusing one. So what I want you to do now is just rarely take a good look at the script to better understand it. Also play around with it. Change a few values and see what happens because this is what learning is all about. You can always press the magic button, commands or control to do what you did. Undo until you have it figured out. 43. Enhancing Trees: Leveraging Past Insights: Okay, so our player sprite is looking really good. I think it's time to move onto our tree and foliage sprite. Now, this process is also going to be quite similar to our car obstacle sprite from our previous game, so we can take that knowledge and implement that here. That's what programming is all about. Using what you've learned and applying it in different scenarios to solve different problems. The firstly, let's click this button here so we can see our sprite again. Now, we could go ahead and build all this code from scratch, but I want to show you something cool. If you look down at the bottom of your screen, you will see that there is this button that says backpack. And if you click it, you'll see it opens up this window at the bottom. And basically, what this is is a place where you can store scripts and reuse them in other places. Because remember how I said earlier, how creating reusable code is so important. Well, here, you're going to see. If we move back over to our traffic race again, and then to our car sprite, what we can do is open up our backpack and looking at the script here that controls the clone cars, making them glide to the bottom of the screen. What we can do is drag the script over here into our backpack. As we also need the script that creates the clones, we can grab that too. Before we do so remove this block from the weight statement, then drag it. Now we can put this block back. This way, we don't have all this code that we don't need in our backpack. Now moving back to our ski game, you might just need to close and reopen the backpack to refresh it, and there it is. Now, all we need to do is drag it on in, and we can do the same for the script. And there you go. You will see here that brings with its variables, which is movement and speed, and you can actually keep that as we will use them in this game. Before we edit the script, let's shed some light on another key programming principle, compartmentalization. Yes, I know it sounds like a big word, but it's an important one. Let's try to understand what this means with a real world visualization. Imagine your game as a large bustling busy city. Now, in a city, you wouldn't just jumble up the homes and the offices and the industries and the parks all in one space, would you? Instead, you would zone them into districts or compartments, you'd have residential zones and industrial zones and business zones, parks, et cetera. This is the essence of compartmentalization encoding. By segmenting our code into distinct sections or compartments, each dedicated to a specific function or task, and by doing this, we achieved two major benefits. First, a code becomes much more organized and manageable. Just as city officials would only need to review and manage a specific district for any changes, developers can focus on individual compartments of code without getting all overwhelmed by the entirety of the code. Secondly, this approach greatly helps in creating reusable code. Now, when code sections are compartmentalized effectively, they can often be picked up and placed into another project that may be just some minimal adjustments, just like we reuse the obstacle code from our traffic racer game. On this point, I want to show you how we can do the same for our traffic racer game to give it a quick upgrade. So if we go to our main player sprite, open up our backpack and then drag the script into it. We can then move back to our traffic racer game, refresh the backpack, and then drag the script into our main car sprite. Then we can remove all these change x blocks from the script like so. Now, it will change x by our movement direction just like with our ski game and hitting play. Well, that somewhat works. The only problem is our car direction looks a bit weird. So to fix it. We can also just insert these movement direction variables into our point direction. So this way, our car faces the way it's turning. So clicking play once more. Well, that's a lot better, and it adds a whole new element to our game. And it was so quick. That's the power of reusable code in compartmentalization. But with all that said, let's move back to our skiing game and also to our tree sprite. So now all we need to do is edit the script a bit so it works better for this game, just like we did with the traffic game. So we can change Switch costumes to pick 1-11, and that's how many costumes we have. Then we can remove all this as we no longer have lanes to worry about, but we can just put in a pick random for our x input and have it between minus 22220. Then we can remove this movement speed variable from the code and just set it to minus nine. Then we can set the size to 50 as it's our current size. Finally, we can remove the condition that makes the carve room sound. Giving that a go, As you can see trees come down nicely and starting to feel a bit more like skiing. However, there is one problem, which you may have noticed is that the stone sprite seems to get stuck on the bottom of the screen. Well, we can fix this by going into the costume editor using the selection tool and clicking on our rock and then dragging it higher up. Now you'll notice that it should stop getting stuck. But if yours is still getting stuck, just move it up a bit higher the same for any other sprites that are getting structures, keep moving them high until they stop getting stuck. But there you have it. We are skiing down some fresh slopes. Looking like an absolute natural you are. 44. Crafting Snow Trails: Simulating Ski Marks: It's time to make our skiing game look like a skiing a. The easiest way to do that is by adding a snow trail to our main character. In this lesson, we're going to look at how we can convert these small little squares into a snow trail effect. First things first. Let's move over to one of our snow pixel sprites. Now, let's think about what needs to happen. Basically, we want this gray block to go to our left ski. Then when it is at the base of our ski, we want it to glide down. Obviously, this wouldn't really work if we just had one as we wouldn't really have a trail, just like before, we can take advantage of clooning to create this effect. To save some time, let's go to our tree sprite and then drag the script here that creates clones into our pixel sprite. Now for the next part, we can drag in the when I started a clone block. Now what we want is for this pixel to go to our left ski, so we can first show it as it's currently hidden. Then we can go to our motions group and drag in this go block. And then select our player spot. Then what we want to happen is for our pixel to start moving down to make it look like we are moving forward. Now an easy way to do this is to grab a repeat block and then stick a change y by block inside. Here, we can change y by minus five, and finally, we can delete the clone. Giving that a test. Well, as you can see, it somewhat works, but because we have a weight block here, it's not spawning in fast enough. Simply, we can remove this block and give that another go. Well, that pres well. I think you will see that our pixel does spawn into the middle of our character, and as you know, we want it to follow our ski. Time for a quick, mini challenge. Pause the video out and try to see if you can get our snow pixel to follow the ski instead of the middle of our sprite. Come. Pause the video and give that a go. Well, hopefully you didn't try to over complicate this challenge because the solution is actually quite easy. Here, all you need to do is grab a change x by add it below G two block, and just keep fiddling with this number until you get something that perfectly aligned to our scheme like this. And now to get the other ski working. We can just drag both of these scripts over to our sprite here, like so, and then just adding this change x by until it matches with our other ski like. One problem you may also be facing is your snow pixel spawning in front of your ski character. And here you have to do is go over to the Los tab set this block to go back layer and just click it and you don't even need to bring it in. Then you have it with the most basic sprite and really simple code, look at how much better that makes the game. It now looks like we're actually skiing and we have a trail that follows behind us. And that's all for this lesson. But before I go, I'll leave you with a quote from a famous program which is a fool admirers complexity, a genius, admirers simplicity. Remember, often the most simple code is the best code. 45. Code Optimization: Enhancing Game Mechanics: A game is really starting to take shape. But before we move forward and as we keep developing, we need to ensure our code is always robust and freer problems. Sometimes you will only find these mistakes when they impact your game in some way. But the more you program, the more you will understand how to keep your code clean. But that said, let's take a look at our code and see where we can improve it. Firstly, looking at our tree sprite, here we have this hard coded weight 1 second, and that determines the rate of how quickly our trees spawn in. If you remember from earlier, having hard coded values isn't always a good idea, especially if we want to modify and upgrade our game in the future. Instead of having this hard coded value, let's create a variable for it instead. Let's just call this variable a spawn rate, and we can move it into the weight 1 second input. Now, as our spawn rate is set to zero, trees are just going to flood in. But before we set this variable to a different value, before, let's create a sprite called variables that we can use to control all our global variables. I'll just select a random sprite like this ball. Rename it two variables, and just delete all of its costumes. Now we can bring in a when start click, then we can set our spawn rate variable to one. Like I we hit play, you'll see it works. Let's have a look to see where else we can improve. Looking at our main player sprite, you will see that we never set the value of our movement direction at the start of the game. Basically, you'll see that if we ski to the left, then stop the game and then start the game, is still skiing to the left. We can fix this quickly by moving back to our variable sprite and setting our movement direction to zero. Fixed. Now, the next thing you may have noticed is how our player sprite can move at crazy speeds left and right, if we hold down for long enough. We need a way to limit the maximum movement speed. If we go to our player Sprite, you will see this code here, that if we click left or right, we just constantly change movement direction by one or minus one. We need to put a limit on this. Here is a mini challenge for you. Pause the video and try to see if you can stop this movement direction from getting too high. Pause it now and see if you can figure that out. Did you get it right? Well, let's have a look how it could be done. Remember in program, there are often a bunch of ways to do something. So if you manage to solve this problem, but your solution doesn't look the same as mine, that's not an issue. The key, however, is to have and find the simplest but most robust solution to problems. So here where we say, if left arrow clicked, I'm going to add another if condition that will check to make sure that the value isn't too high before increasing it. We can also add an F condition to the right arrw. Now what we want to check is if the movement direction is greater than 18, which we will have be our max speed. Of course, -18 will be our max speed in the other direction. Check if the movement direction is less than -18 just like that. And if we give this a play. Well, that's not quite right, and here we have a simple problem. Basically, we are only allowing the player to use the arrows direction if they are moving at more than 18 or less than 18, we want it to be the opposite of this. Ensuring players can't go faster than 18 or -18. Simply all we need to do is go to the operators, grab this knot and stick them on each of these f conditions. Like that. Now testing the game again. That works a lot better. Now before we close off this game, let's quickly add some functionality so that our trees spawn at an increasing speed. To do this, we're going to use a quick and dirty solution, which is everything we have been trying to fix in this lesson. But this will help you see what bad code looks like. And also, we'll look at a much nicer solution in a future lesson. Moving over to our variable sprite, here, let's grab another on start. All we're going to do is grab a weight and then grab a set variable and change its input to spawn rate and then change the weight to 15 seconds. Now for the dirty part, grab this block, duplicate, grab it again from the start and duplicate it again. Once more. Now we're going to slowly lower the spawn rate, and we'll do this all the way until we get to 0.3, starting from one, just like that. So you can see that was quick and easy. But as you are well aware, this is definitely not a dry code, and we do repeat ourselves, and this code is very cumbersome and it's hard to upgrade and maintain as you know, so we'll look at a much better solution soon. But for now, if we give this game a go, you'll notice that every 15 seconds, our spawn rate slowly decreases and our trees start coming in faster. Nice. 46. Final Touches: Perfecting Your First Game: Right. It's time to get down to business. So our game is looking nice, but there is a major feature which we have ignored, and that is crash detection because right now, we can just ski to our heart's content. I into a tree, well, that's not going to stop us, and that would be fun to do in real life. But it doesn't work like that in real life, so it shouldn't work like that in our game. In this lesson, we're going to fix that. Let's create a new script that will detect if we have crashed into a tree or not. So on our main sprite, it's standard procedure. We can move in a win flag, click a forever and an F condition. Now, we can move over to our sensing, bring in this touching check block, and change it to detect our tree sprite. Then if this condition is true, we can just add a simple stop all. So our game will stop if we hit any trees. Giving that a play. As you can see, we are skiing along nicely. Next thing. If we hit into any trees. Well, they all disappear. This is something that works, but as you can clearly see, there are definitely a few issues here. The first being that how trees disappear and the stop is so sudden. The second issue is how sensitive this code is as if we just kick into the side of our tree our game stops. The first issue, we will ignore for now as we will look at a great way to solve it in the next essence. Let's focus on the second issue, which is how our code is just too sensitive. Here is your mini challenge. Here I want you to try and find a solution to our stop or script. Only triggers if we touch the tree for more than a 0.2 seconds. Pause this video now and give this a go. How can you implement it, it only triggers the stop if we've touched the tree for more than 0.2 seconds. Well, let's see how it's done. Thankfully, the solution to this problem is quite simple, just requires a bit of creative thinking. Here, all you need to do is select this if check, duplicate, remove the stop, then move this back into the script, and then we can grab a weight block. Here we can stick it in between these two if checks. Lastly, we can change it to 0.2 seconds. Now, if you look at the script, it basically checks to see if we are touching a trio rock, and if we are, it waits 0.2 seconds and then checks again. If we are still touching it, then we lose. So it's as simple as that. This basically means making the crash detection less sensitive. 47. Crash Detection Basics: Implementing Initial Collision Logic: So as you know, when we hit into a tree, they just can't disappear, which is really not what we want. Instead, we want the trees to slowly grind to a hot. Now, if you look at the script we have here, basically, when we touch the tree sprite, we just stop all, and this stops all code and is causing a lot of problems. And this is not just with our trees disappearing, when we stop all our entire game stops. This means that we can't add in any restart button as this button wouldn't work if the code is all stopped. So how do we fix this? Now, this is why I'm going to introduce you to a new block we haven't yet used, which is the broadcast message code here. As you can see, it's very similar to when flag click button, but the key difference is that the script doesn't wait for a Wen flag click, but instead waits for a specific message to be broadcast. For instance, consider a game where a players sprite encounters a treasure chest. This event can broadcast a message, found Treasure, which in turn triggers a script that listens for found treasure and plays an animation of the chest opening, sound effect, echoing and the creek of the lid, and the score updating to include the new found treasures, and it all happens simultaneously. But that's not all. The broadcast feature is not just about triggering multiple actions at once. It's about enhancing control and coordination of your project. It allows you to create complex interactive and responsive projects without the clutter of overly complicated code and using tons of variables that constantly check if a condition is true or not. It's like having a conductor leading an orchestra, ensuring each instrument or in our case, each sprite plays at the right time to create a beautiful and harmonious experience. Right. With all that said, let's see how we can improve our code with this broadcast feature. Looking at our code here. Instead of stopping all, what I'll do is swap it for this broadcast message and then click New message and call it player crash. Now, just broadcasting the message player crashed, won't do anything. We need to now create code that listens for this broadcast. To do this, we can move into our tree sprite and here we can grab this when I receive message, and the message we are looking for is player crashed. When we receive this message, we want our trees to come to halt. Now, the first problem we have is how our trees have a hard codd movement speed at the moment of minus nine, which doesn't give us much control. Let's fix this. Quite simply, we can swap out this minus nine for this movement speed variable that we have already in our project. Then moving over to our variable sprite. We can drag in this block and set our movement speed variable to minus nine at the start of the game. Now that that is done, we can move back over to our tree sprite. Now when we receive the message player crashed, we can change our movement speed by 0.5, we can use this repeat until block to ensure our trees are at a complete stop. We can say repeat, grab this equals block and say movement speed equals zero. Just like that. Now, if we give it a test and hit into a tree, you'll see that our trees now come to a stop, although it's still a bit too fast. We can just add in weight and change it to 0.1 and give it another try. And there you have it. Now there is just one problem. That is how our trees keep spawning in. To solve this, all we need to do is grab the stop or block and change it to stop other scripts in the sprite. Then we can just place that right at the end of our script and giving that one more try, heading into a tree. Well, as you can see our trees slowly come to a stop, which makes it look like our player is slowing down. Perfetto. 48. Refined Crash Mechanics: Integrating Broadcast Messages: Now it's time for the important part, the crash animation. Because if our crash doesn't look like a really epic, our players won't understand why the trees are to be avoided. So let's have a look at how we can enhance this game with a nice animation. Let's get to it. Moving over to our player sprite, we can add in this when I receive player crash broadcast. Basically, what we want to happen is for our player sprite to have a spinout effect when they touch a tree. Quite simply, all we need to do is go to the motions group and bring in this turn effect. Then we can just repeat this, five times. Giving this a go, skipping along until we hit a tree. Well, that didn't quite work. As you can see, it tries to turn, but it just turns back and also, even after we crashed, we can still ski left and right, so let's see if we can fix that. Well, if you look closely, you will see that the problem is caused by the script here. And to fix this problem is quite simple. Basically, just like we did with the tree sprite. What we need to do is stop the other scripts. So grabbing a stop all, we can change it to stop other scripts in the sprite. And this time instead of putting out the end of the script, we can add it to the start of the script. So again, giving that a play. You will see how much better that works. Now we have a pretty nice animation that works when we crash. But I still think we can do better. If you look down at our script, you can see that we turn by 15 degrees, which is fine and all, but it does not look exactly smooth. I'm going to do something a little sneaky here. Instead of 15, I'm going to turn by movement speed. Yes, I know this seems weird, but as you'll see, it works when we give this a play. Notice how much better that animation is. Now, the final thing to improve this even more is replace this repeat five times with a repeat until block. Now, just like we did with our other script, we can repeat until movement speed equals zero. Just grab this equals block and this variable and set this to zero like that. Giving that another go, crashing into another tree. Well, I think the results speak for themselves. That looks like a remarkable crash. 49. Crash Animation Mastery: Enhancing Player Feedback: Algorithm. I'm sure you've heard that word before. It's used all over and it's so important in programming, but what exactly is an algorithm, and what does it do? So in this lesson, we're going to uncover some of these mysteries and we'll also implement a simple algorithm in our game. So first things first, what is an algorithm? Well, imagine you're following a specific recipe to bake a cake or playing a new game that has a set of rules to follow. That's what an algorithm is. It's like a recipe or a set of rules that computers follow to do something cool. That said, how do computers use algorithms? Well, you know, when you type something into Goole and get a list of web pages, that's an algorithm helping find those pages for you. Or have you ever noticed how a website can show you items in order of price from lowest to highest? That's an algorithm tool. Or in video games, algorithms can help control what the other characters do and decide the outcome of certain actions. They're used almost everywhere from YouTube to Netflix to TikTok to Amazon. So now that you have some kind of idea on what algorithms are, let's discuss the algorithm we are going to build in our game. We're going to have an algorithm in our game called the safe path algorithm, it plays a crucial role in making the game both challenging and playable. So how does it work? We start with a rectangle sprite positioned at the top of the screen. Then the rectangle moves slowly to the left or right across the screen. As the rectangle moves, it prevents trees from appearing in its current position. This action creates a safe path for the player. That said, why is it considered an algorithm? Well, there are three reasons, sequential steps. The algorithm involves specific steps executed in order, positioning the rectangle, its movement, and the blocking tree. Secondly, decision making. The random movement of the rectangle requires decision making processes and determining which direction to move at any given moment. Thirdly, problem solving. The main issue here is to prevent the player from being trapped by trees, and the safe path algorithm addresses this by always clearing a path. Basically, the safe path algorithm ensures there is always an open route for the player to move avoiding an unplayable situation which wouldn't really be fair in our game. The player can continue moving forward navigating through the obstacles, making the game play experience both fair and engaging. Now, I sense, the algorithm balances the game. It ensures that it's challenging on the one side, it's also obviously possible to navigate. This enriches and enhances the whole playing experience. Now, while I will be building this, I'm going to go at a very fast pace as we won't be using this in our game as we continue. This lesson is more to help you understand an important programming concept. However, you can still use it. If you'd like to change the dynamics of your game, a bit, you can still apply this. First things first, we need our rectangle sprite and this sprite is simple enough. We can just hit paint button. Then in the editor, we can just select this tool and then just draw a simple rectangle. We can adjust the size of bit, so it looks something like this. Then going to the code, all we have to do is grab a win start, a forever, a glide, and a pick random, which we will stick under the x input. Then we'll change the pick random to minus 22220, and we can set y to one 80. Now, if we play, you will see we have this box that goes from one side of the screen to the other. So now that we have the movement, we need one more thing, which is to report the position and we do this to make sure that the other sprites can know what position our rectangle sprite in is at all times. All we need to do is duplicate the script, remove the glide and move over to other variables and create a new one, which we will call safe path. Now we can grab this set into our forever loop, change it to safe path, and we're going to set our safe path to our x position. Now Sprite moves, it constantly sets this variable to its current position. Now, remember how I said an algorithm is like baking a cake or playing a game where you need to follow instructions or rules. So this is our instructions or rules. So our trees aren't allowed to spawn in the location of our algorithm sprite. So now all we need to do is make sure that the tree sprites follow these rules. Moving over to the sprite. If you look at the script here, as you can see, our trees are just going to a random exposition. So to fix this, we're going to grab a repeat and to block and insert it right over here. Then we can duplicate this bit here and put this go to block inside our repeat until. Finally, what we want is to keep changing our exposition until we are not in the path of our rectangle. To do this, we're going to need a few blocks, which are greater than a lesser than and a plus minus two of our safe path variables, and finally, two of our expositions. How we want to connect is just like this. Yeah, I know this may have been a bit confusing. Let's run through the coat. Our trees spawn in a random exposition. Then we have this part. If our trees current exposition is within 100 pixels to the left of our safe path, then it needs to try again. Or if our trees are 100 pixels to the right, it also has to try again. If they are not in the path of the sprite, it will continue. You see this in action, we can quickly go to our variable sprite, disconnect this over here, and change our spawn rate to zero. Then under our safe path sprite, we can hide it. Now clicking play, they can see a bunch of trees spawning. Yet we still have a safe path to follow. So yeah, that's algorithms in a nutshell. I know this lesson was pretty fast paced, so don't worry if you weren't able to follow along because as I said, this lesson is more to give you a simple understanding of an important concept. But for a game, we won't be using this algorithm as we continue, but if you'd like to use it, you are more than welcome. 50. Unveiling Algorithms: Crafting the Safe Path: So this stage, we have discussed almost every code block that is available to us. However, there's just one more thing, a code block and a coding concept so important to programming that I needed to wait until you were a pretty competent programmer before I introduced it to you. And that is functions. So what is a function? And why should we care about it? You have a toy making machine, which would be pretty cool. You put in some materials, press a button, and out comes a toy car. Every time you want a new car, you just press the button again and out comes a car. Although the only problem with this machine is each time it's the same car. Now I imagine you have another machine that's even better because if you want a red car, you put red paint and out comes a red car or if you want a blue car, you put in blue paint and outcomes a blue car, you get the idea. Well, both of these machines are examples of functions, except one of the functions allows inputs which can change the output. Now, in the world of coding, functions are like that magical button. You write a piece of code once, and then you can use it over and over again just by calling the function's name. Now, some functions can accept inputs like a number or string, and depending on what the input is determines what output the function will give you just like our car making machine that gives different color cars. But as well, some functions will always return the same output. How do functions work? Well, first, we write a function. It's like building our toy making machine, setting it up to make a particular toy. Next, anytime we need that specific task done, we call the function, just like pressing the button on the machine. The function then executes the task and gives us the result, just like the machine popping out a toy car. Why are functions important in programming? I'm sure you could probably already guess why. Firstly, saving time. Without functions, we would have to write the same code again and again and again, for the same similar tasks. Functions save us time. We write once and we use many, many times. Next, organizing code. Functions help us keep our code clean and organized. Each function has a job, and it makes it easier to track down and fix any issues. Thirdly, less mistakes. Having one piece of code means there's only one place to check and fix if something goes wrong. No more searching through blocks and blocks of code. Lastly, sharing code. Functions can also be shared between different parts of our program even between different programs. As you know, reusable code is so important. Imagine this. You're creating an exciting game where a brave knight goes on a quest. During this quest, the night encounters treasure chest. Now, each time the night touches a chest, it opens up, and the coins inside it all jump out. Now here's a catch. Our game has not one, not two, but many treasure chests scattered in different levels. We want every chest to do the same magical opening act. So how can we make this happen without writing the same code for every single chest. Here comes the function. We can write a function named open chest that contains the code to make the chest open and coins pop out. Now, every time the night touches a chest, we simply call the open chest function. It's like telling the game. Hey, do the chest opening thing now, and voila, the chest opens and coins come out and ta no matter where the chest is in the game, it works. And to give you a real world scratch example of functions and use, there is a popular project in scratch called smooth movement engine. I encourage you to check it out for yourself. But clicking play on this project, notice how all these sprites move in a very fluid motion. And if we click next, next again, you can see all the projects that utilize smooth movement. Anyway, if we click this C inside button, you will see that there is this code block called custom block, and if we zoom out, you will see all the different functions. Yes, they're quite complex. Don't worry about trying to understand how it works. The important thing here is what the functions do. If we move over to the M blocks tab, you'll see all these different blocks. But basically, these blocks are all used to call the functions. Let's say we had a sprite and we wanted it to move up. Let's first delete all these sprites so you can see this action and also show the sprite. Now we want our square sprite to move forward 100 steps. Now instead of using the movement code block, we can call this function here. As you can see, this block gives a lot of options. Let's say we wanted to move 100 steps in 2 seconds with an easing type of one. Clicking play, as you can see, our sprite moves smoothly down our screen. Now, let's say we wanted to turn and move forward again. We could grab this smooth turn block. Let's say we want to smooth turn 45 degrees in 1 second with a easing type of three. Then we can just duplicate this other smooth movement and stick it at the end. Now if we hit play, notice how our sprite moves slowly and smoothly forward. Then takes a smooth turn and finally moves forward again. And all I took was three blocks of code. But if we were trying to manually create the smooth movement for each movement, it would take ages and our code would be so confusing to understand what was actually going on. In summary, functions are one of the programmers best tools to write efficient, organized and clean code. Function is like a handy helper that does a specific job whenever we ask it, and it's so reliable we know it's worked because it's been tested and reused by mastering functions, you're well in your way to becoming a skilled coder who can make complex and interactive programs. 51. Mastering Functions: The Core of Reusable Code: So we've talked a lot about functions and have seen a few examples. But as you know, the real learning happens in the doing. In this lesson, we're going to create some functions of our own. To do this, we're just going to get back to the basics by creating a new project. I don't think I have to explain to you how to do that. With our new project created, as you can see, we have our classic cat sprite ready for action. Now for this project, we are going to do something a little bit different and not just with functions. We're going to make our cat draw with pens, and it's pretty groundbreaking stuff. So before we get into functions, you may be wondering, how do I use this pen that you're speaking up. Well, if you look right at the bottom, you will see this small button here. Now, if you click it, you will see it brings up a bunch of different extensions that you can add to your project like music and camera, et. And a lot of different ones that use external hardware. Anyways, the one we're interested in is this draw extension. Clicking on it. As you can see it adds this extra code group to our project and all these different code blocks that are for the pen. Now, our project is going to be quite simple. The cat is going to ask how many circles we must draw, and then well, it's going to draw them. To do this, we can grab a win flag click and then move to the sensing group, bring down this ask block. Here, we can just say how many circles shall draw. So if we click Play, our cat asks how many circles it should draw. We can enter in a number, and of course, well, nothing happens. So now what we're going to do is create a function that draws circles. Moving down to my blocks, here you can see we can click this option here to make a new block. This is where we can name our function. I'll just call it draw circle. Then remember how earlier, I told you that some functions can have inputs while some don't. Well, for our circle function, we could just have it that we call it just draws a single circle and that's that. Or we could have it accept an input where we can choose how many circles we want to draw, just like with the example of the toy making machine where we can decide if we want blue or red or whatever color car. In this case, we can decide for the function to accept an input, which will change the output that the function creates. So to do this, all we need to do is click this add an input like so. Then as you can see, at the top, we now have an input. I'll rename it to number of circles and then hit. Now, as you can see, we now have this block right here, and this is where we define our function. This is basically like we are building the machine telling at what it needs to do when it gets caught. What we want our machine or rather our function to do is draw circles. To draw circle is quite simple. All you need to do is put the pen down, then go over to motion, and move ten steps, then turn 15 degrees and repeat this 30 times like that. If you just click on this function, you'll see our cat draws a circle. That's cool. But how do we use this function? Well, here we ask the user, how many circles shall I draw to use this function. All we need to do is grab this block, draw circle underneath, which calls our function. And if we had play and click this button, as you can see, our cat draws a circle. But of course, there's a problem being our cat just draws one circle. This is where we need to tell the function how many circles it must draw. Instead of leaving this blank, we can go to our sensing group and grab this answer block and use it as an input. Basically, what this is doing is calling our draw circle function with the input entered in from the user. However, this still won't do anything because if you look at our function, we never tell the machine what to do with the input it gets when it's being called. What we need to do is grab another repeat block and put all this inside. Instead of entering in a value, we can grab this number of circles block and put it inside. Now, let's look at our script step by step so we can better understand it. I can't ask how many circles to draw. Let's say we enter in five circles. We then call our circle drawing function with the number five as the input. What this function does is it puts the pen down, and then we have this repeat block with the input being the number of circles, since we entered in five, as the input for our function, it's going to repeat all this code five times. The code is this move and turn, which basically creates the circle. Seeing this in action, here our cat asks how many circles we want. Let's say three, as you can see ICT draws three circles, just like that. The only problem we do have is that we can't see them all as it's all in the same area. Let's upgrade this function a bit. Thirsty, we will put the pen up, so it doesn't draw everywhere. Then we'll have our cat go to no position. Then we can put the pen back down. Lastly, we can have a change the pen color by ten. So let's just to raise or when we start. Giving this another go. Let's do four. Well, that's not quite right. ICT is doing the same thing. Well, our problem is all this code should be inside our repeat block. Moving it inside, like so, and giving it another go. How many circles? Let's say seven. Slowly, but surely, as you can see, our cat draws seven circles. It also draws each circle a different color. Now remember set functions are so useful because we can just write the code once and use it over and over and over. Well, if you look at this code, while the function is very useful as it makes our code very easy to understand and manage. As we can see clear what is going on, we are asking a question and then we're drawing a certain number of circles. But we aren't really using this function to its full advantage because, well, we are only calling at once. Let's say in our program, we wanted our cat to draw circle if we clicked on it because we have this function. Well, that's simple to do. We can just grab this when the sprite is clicked block, then we can just say draw circle and enter one. Now, clicking play, how many circles? Let's say two. After that's done. Now if we click the CT, it draws a circle. Nice. Also, let's say we wanted to make our circle smaller for some reason. We can just go into our function, change the move to say five steps. Now clicking play, entering in one, it draws a smaller circle. But also, if we click the CT, it also draws a smaller circle. As you can see, using this function ensures our code is consistent and it's easy to manage and easy to use. Now that's the power of functions. But before I end, if you want to have fun with this, hold down shift while you click the flag, and you will see it goes into turbo mode. Then if we enter a crazy value like 100,000, our goes absolutely crazy drawing circles, have some art fun with that. 52. Exploring Functions Through Creative Coding: Well, it's time to get back to it and finish what we started. Our arcade ski game is fun, but it's missing that crucial element. That takes it from being a fun game to a really fun game, and this is what polishing is all about. It's the final stage of our workflow. For the first step of polishing, we are going to make our graphics a bit better, make our game feel much more real. The first thing I want to discuss is layers. We briefly discussed this in an earlier lesson, but let's run over it again. In scratch, each of our sprites appear on our screen with an x and y position, as you know. Now, this is easy to see, but our sprites also have a z axis, which we can't easily see as everything is two D and we are looking from a top down view. We basically the z axis is the layer. So imagine a stack of papers. You might have 20 pieces of paper on top of one another and each has its layer. If the paper is on the top of the pile, it is at layer one, and if it's on the bottom, it's layer 20. Naturally, if a paper is at a higher layer like layer one, it will cover the paper that is at a low layer like layer two. The exact same thing happens in scratch when our sprites are on different layers. If we play a game quickly and if we crash into a tree, you will see that well, we ski over the tree, which doesn't make sense. How do we fix this? Well, if we move over to our player sprig, we can grab another when flag clicked and then move up to the Lux tab. Here we will see we have two options. Either we can make it go to the front or back, or we can have it go backwards or forwards a layer. If we were to say go to back and then hit play, as you can see, our snow trail goes in front of us. This isn't an option. Let's bring this back to the front like this. Now this time, we can instead say, go back one layer. Now rather than sending this to the very back, we're just moving it back one layer, which means our player sprite will be in layer two. Now, drag in the script over to both no pixels. We can have it go backwards two layers, and we can also do the same for the other sprite. Clicking play. Well, that's weird. Our pixel is still in front. Any ideas what's happening here? Well, the reason for this is because each time we start the game, it keeps going back more and more layers. What we need to do is go to each of these sprites and bring in this go to front layer, just like that. We can also do the same for our tree sprite. We can just drag in a wind flag click and then go to front layer. Now this way, when we start our game, each of our sprite starts on the same layer, but our player moves back one and our pixels go back two. Trying this out. As you can see it works perfectly. When we crash into a tree, we don't glide in front of it. Now that's much more realistic. With that out of the way, there is one more thing we need to do. When we play the game, as you can see, our trees just pop into view, which is a bit jarring. Won't be better if they faded in. Almost like there was a mist and they were coming into view from the mist. Sounds great. But it sounds like a rather complex task. But fear not because there is a fairly simple way to do this. If you look over at our looks group, you will see this change color or set color to. Dragging the set color effect into our player sprite. You'll see that if we click it, nothing happens. But if we change this number to say 40, our sprite changes color. I almost looks like an alien. But this isn't what we want. We can set it back to zero. But you will see that if we click here, there are all these other options. The effect we're interested in is this ghost effect. Let's set it to 95. And clicking it, you'll see how Sprite almost fades out. We can use this to fade in our trees. Quickly resetting it. We then can move over to our tree sprite. Now, this is your next, mini challenge. Try and see if you can create this effect, where our trees fade into view instead of just suddenly appearing. Come on, give it a try before we show you how to do it. Did you get it? Let's see how it's done. Now, what we want to happen is when our sprite starts as a clo, we want to set the ghost effect to 95, then to make it fade in. What we're going to do is grab this change effect by block, and again, set it to ghost. Here we want to drag it into this forever loop so that the ghosting slowly fades out, which makes it look like our trees are fading in. To do this, we need to change this value because currently our ghosting is at 95, and we want to bring it back to zero. We can just enter in minus three here, or whatever looks best for you. Let's give this a test. You can see that our trees now look like they are slowly appearing into view from the mist. Yes, it's a very subtle effect, but it just makes our gain that much better. That's it for now. If you can see any other areas where you think the graphics can be improved, I encourage you to give it a go and see what you can do. 53. Enhancing Game Realism: Graphics and Layers: There is a quote by the famous filmmaker, George Lucas, it says, sound is 50% of the movie. The same can certainly be said for video games. A game is fun and all the graphics are pretty cool, but it just isn't very immersive. Let's transform our game with sound. Firstly, we need a nice background sound for our game. Now, as we are skiing the snow, we should have some sound that makes you feel like you're skiing in the snow. Moving over to our state srt, we can use this area to add our sounds. Clicking on the sounds tab, we can move over to this button and click Upload sound. Now, if you move over to our sound effects folder, you will see we have this sound called Winter Storm. Clicking that. Here you can see it is now imported. All we need to do now is go back to our code, grab a wind flag clicked and a forever loop and then drag in the play sound until done block. Here as you can see, it's already selected our sound. All there to do is play the game. Now, that's more like it. It actually feels like we're in the snow. Now, you could keep this as it is, and it would be pretty cool. But we can make it even feel more exciting by bringing in another sound, which is actually some music. Clicking the upload sound button again and then moving over to the music folder. Here I'll choose the song here. But you can choose whatever song you like. Now, because I want both my music and sound effects to play at the same time, I'll just duplicate this script, and then change the sound to the new song that we imported. And now all there is to do is hit play. Now, that sounds more like a game to me. What are the sound do you think we need that would really complete this. Think about it. Skiing, and then crashing. Yes, we need a wipe out sound. So this time, we go into our player sprite, and then the sounds group upload, then move over to the sound effects folder. And here you can see we have this ski wipeo effect. Clicking that, we can then move back to our code, it's quite simple really. Basically, when we touch a tree, we want it to start sound, ski wipe out. We can just drag this block over in here. Now let's try it, hitting play. And then crashing into a tree. Well, there you have it. Subtle, but a nice touch. That's about it. There's still definitely more you could do with sound like a nice skiing effect, sound as a player turns left and right. But I will leave all that up to you and your amazing creativity. But as you can see or rather here, sound is definitely 50% of the movie or in our case, the game. 54. Amplifying Immersion: The Power of Sound: So, the next thing we want to do in our game creation is make it competitive because while it's fine to ski down on mountain, if we can't boast about a high score, then we have a problem. In this lesson, we're going to add a scoring system to our game. Now you might be thinking, I know how to do this. I'll just create a variable chord score, stick it at the top of the screen, and I'm done. Yes. That's good thinking, and that would work. But we've put lots of good work into this game and it's graphics, and we don't want it to be let down with a basic looking variable that counts score. We need something exciting. We could start designing a cool score sprite that looks super nice and also create some nice animations in all that's not what we'll do. Grab a pen. Or type this somewhere. I want you to write this down because it's very important and it will save you countless hours of time. Are you ready? Don't try reinvent the wheel. Again, don't reinvent the wheel. Now, pin that somewhere, you won't forget it. Don't reinvent the wheel. This basically means if something has already been done, and someone has spent endless hours working on it, don't reinvent it. What I'm saying is, of course, we could create the score sprite ourselves. What is even better is if we could just use someone else's score sprite. It's faster. And it lets us apply our brain and our time to other parts of our programming. In fact, this is what programming is all about. Reusing both your own code and open source code when it is available. Now, in the context of scratch. Let's say you play someone's game and you think, Hey, I really like how they have that nice transision animation or like the early example with the smooth movement engine. Instead of trying to create your own smooth movement, you can use theirs in your own project. Scratch allows you to do this, and the good thing with scratch is that it automatically gives other people credit when you use their code in your project. Let's do this for our own project. Here you can see, I found a nice soccer mini game. While the game is a little rough around the edges, it's still in Beta after all. You will notice that the score animation is really nice. How can we use this for our project? Well, the first thing we need to do is click this C inside button. As you can see, there is the score sprite we're looking for. Just to make sure that you're on the same page as me. I want you to open up this project and you can do so by clicking on the link that is under the lesson. Or you can just manually enter in this link. If you still can't find it, all you need to do is click File and load from your computer and under completed projects, you will see this one called soccer Mini Game. With the project open, now all we need to do is copy over the sprite. To do this, all you have to do is right click the Sprite, and then select port. Here you can save it to wherever you like. Just remember where you save it. I'll just choose downloads. Now moving back to our ski game. Here we can hover over this, choose a sprite, and then click the upload sprite. Now, here you can see we have our score sprite, which we can select. So open, there you have it. Our score sprite is now in our game and ready to use and think of all the time we've saved. With all that save time, let's give the sprite a bit of customization so it better suits our game. Moving into the costume editor, I'm going to delete all of these costumes and then click the upload button. Then moving over to the score folder, you can see we have these nicer looking numbers. We can just select the first one, then hold down shift and click the last one, and doing this will select all of them. Now we can click open. Okay. And there you have it. Our new scoring design is imported. With that, let's have a look at the code. As you can see, this code is utilizing functions. But let's quickly run through it. So we have some idea of what's going on. So when star is clicked, they are setting the score to zero. Then they seem to have a loop making sure the score doesn't go into the negatives. Then over here, they are running the setup function, which does a bunch of things like setting size and costume and also creating a c, and then this clone calls another function and so on. But for now, we will leave it at that. You're more than welcome to analyze this code for yourself, which I'm sure you can figure out with all you already know. 55. Mastering Score Dynamics: From Simple Tally to Competitive Edge: Okay, let's make the score work. And just to just it out, if we play a game and click the script over here, a bunch of times, as you can see, our score starts to increase. Although there are a few problems indeed fixing because it is clearly too big. And if you are anything like me, you would have probably assume we can easily change this by lowering the set size number. But clearly, this is not the case. But to save you the trouble of trying to figure out what is going on here, the size is actually set by this number over here. So what we can do is just lowering this number to say ten. If we hit the script, you can see that it works. Although it still appears gigantic for a second. This time, it's because of this set size option down here. If we set it to a low value like 15 and give the game another play. Clicking on the script, a bunch of times, you can see it looks much better, although when we pass the number ten, our numbers appear too close together. Now, sometimes the best way to fix a problem like this is just keep changing numbers until it works. It's the brute force method. But to speed the time, in this case, the number we need to change is the one here, and we can change this number to 0.4. Giving that another go. When we reach ten, as you can see, that looks better. Play around with these numbers over here to get a more dramatic or less dramatic effect. Basically, whatever you think looks best. But I'll leave it like that for now. Now that we have the score working well and looking nice, let's implement it into our game. And in our previous games, we would just have it wait a certain amount of time and then increase the score. But I want something more interesting than that. What I want is for each time we pass a tree obstacle for the score to increase. As you know, if we play the game and click the script, the score scounts as you can see, this is a broadcast message. All we need to do is broadcast player score, and it should go up. Moving over to our tree sprite. All we need to do is go over to this broadcast message code and drag it into this scripture. Just right before we delete the clo, then we can just change it so that it broadcasts the message player score. Let's give that a go. As you can see, each time we pass a tree sprite, our score goes up. It has a nice little animation. It's almost too easy. Look how much it transforms our game. But one thing you may have noticed if you're trying to beat the game, and that is it's still quite easy. You can pretty much go on endlessly. Let's fix that. Moving over to our variable sprite, you will see that we have this disgraceful code over here. As you should know, this isn't good code as we repeat ourselves. Let's get rid of all this code and do something better. Moving over to the variables group, we can create a new variable called level. Now we can use this to control the difficulty of our game. Grabbing a when start, forever and I here's what we're going to do. Firstly, at the start of our script, we're going to set our level variable to one. Then we're going to grab a less than operator and our level variable and stick it in here. Basically what we want to do is check that the level is less than ten as we don't want our game to be too hard. Level ten will be max. Then we can grab a weight, stick it in here and set it to 15. Every 15 seconds, we want our level to increase by one. We'll just change level by one. Now, every 15 seconds, our level will increase by one, and it'll stop increasing when it reaches ten. The only problem is, well, this doesn't really do anything because it's our spawn speed and speed that change our difficulty. To increase the actual difficulty of the game, I'm going to use the broadcast function. Moving over, we can drag this in and then click new message. I'll call this one level up. We can now drag the when I receive block and change it to level up. Then what we want to do is lower the spawn speed. We can drag a change variable block, set it to spawn rate and set it to -0.1. Quickly, looking at our code. Every 15 seconds our game levels up, which broadcasts this message which increases our spawn speed. We can get an idea of the levels. I'll change this to just 1 second and hit play. As you can see, that it quickly increases in difficulty. Until eventually we reach our max level, as you can see a lot of trees spawn in, and if this seems too hard, you can easily change it by changing this value here. Also, let's say you wanted an insane mode where you increase the speed as well. We could just go to our variables, drag this and change movement speed by minus one. Giving that another go. As you can see, our game definitely gets insane. But anyways, I'll leave it to you to fiddle around to get it perfect because our game, no rather our masterpiece is almost done. 56. Crafting the Gateway: Building an Inviting Start Screen: So we're almost at the finish line. But to get to the finish line, you need a start line, and that's exactly what we're doing in this lesson. We'll be adding in a start screen. As you know with our game development workflow. The first thing we need to do is think about how it's going to look and how it's going to work. Thinking about it, what we simply want is a nice looking screen that is the first thing that appears when we start the game. With that 30 seconds idea draft out of the way, we can move on to step two, which is laying out the foundation. First things first. Let's bring in our main backdrop for our start screen. For this, we can use our main stage. Clicking on it, and then backdrops, you'll notice that we don't have any backdrops at the moment. However, because we are simulating snow, we are just using blank white backdrop. Keep that in mind. Clicking the import button, then moving to the folder. Start screen, we can select these two start screen files and hit open. Here you can see, we have this animation that flickers. You are here text. But as you can see, there is this big empty gap at the bottom of our start screen. This is where we want to add a nice little animation that plays with trees. For these trees, we could technically import them into our background. However, because we want to create a nice layered effect, we are going to make it a new sprite. Again, uploading a new sprite. Here you'll see we have this tree line sprite over here. Selecting that and hitting open, you can see some nice trees. Now, what we want is for these trees to move over to the left and then back to the right, which will create our animation. The only problem, however, is our trees are pretty much the exact size of the screen. There's little room to move them. What do we do? Well, we have two options to fix this. We could either scale them up, which would work, but even better. If we move over to the costume editor and click this button, convert to vector, selecting this tool, what we can now do is move it all over to the right, copy it and then paste. Then we can try get it to somewhat line up. With this tree line done, we can duplicate the sprite so we can have two tree lines. Now we need to do is add in our start button. Once again, hitting upload. We can select the start button image, and there you have it, a gigantic start button. Great. But before we try write any proper code, let's organize all this so we actually have an idea of what's going on. Firstly, let's fix this start button. I think that here 25 is a much more realistic size. With that, you can just move it to the bottom here. Finally, for our trees, we want it to be something like this. This tree line should cover this blank space. Then this bottom tree line needs to be in the very front, so it covers our start button just a bit, which gives us a nice lad effect. Well, that's basically it for now. Our sprites are imported. Everything is in place. Now, all we need to do is get coding. Prepare yourself because it's about to start. 57. Setting the Stage: Layering and Activation for a Seamless Start: Well, all our new sprites are in order. They are just waiting for us to bring them to life. Now, the first thing we need to do is get the layering right. The only problem is scratch only lets you set a sprite to go to the back or front or go backwards or forwards, a layer. There isn't an option to have it go to a specific layer. Currently, what we have been doing is having our sprites go to the front and then go back. While this trick works, if you have three or four sprites, it causes problems when you have more than that. To set a sprite to a specific layer, what you need to do is first have the sprite go to the back, then bring it forward however many layers are needed. This is the opposite of how we had it. If you look at it, this bottom tree line will be at the highest layer. We will bring it forward six layers. Then the button will be a layer lower so we can bring it forward five layers. Then the next set of trees, we'll bring forward four layers. What that means is that our obstacle tree sprite needs to come forward three layers. Then our player sprite, two layers, and finally, our snow pixel just one layer. Starting off with the snow sprite, we can go in and change this to go to back and then go forward one layer, and do the same for the sprite, just like that. Then our player, we can say go back and then go forward two layers. Our trees also change to back and we can bring in a go forward and change it to three layers. Also, I almost for it. We also need to set the layer of our score sprite. Let's drag this script over to it and we can have this go forward four layers, just like that. Now, to make our lives easier, we can just drag this code, script into each of these new sprites, we added just like that. Then moving over to our first set of trees, we can go forward five layers. Now, for our start button, we want to go forward, six layers. Finally, our bottom tree line, we can have it move forward seven layers. Okay, so that looks pretty good. Now we need to make it actually work because you'll notice if you click the play button, well, we have a weird merge of our game happening in our start screen. Our first priority is getting the start sorted out. Basically what we want is for our game to start when we click this button, meaning this start screen and trees should hide and our player and obstacles should appear. Now, instead of using an if mouse down and touching sprite, like we've done before, we can use this block here when the sprite is clicked. Okay. Now, when we do click the button, we want to broadcast a message and the message we want is Start game. Drag in this block when the sprite is clicked over, then the broadcast message? We can create a new message called Start Game. Now with that done, let's ensure our other sprites respond. Firstly, with our background, we can disconnect this music from the on flag click and rather have it play with the broadcast message when I receive start game. This way, our ambient sound is always playing, but our music only starts when the game actually starts. Right. I have a mini challenge for you. Are you ready. What we want to happen is for our animation that rotates between these two backgrounds to play when we click the flag. Then when we click the start button, we want to stop the animation and switch to the blank backdrop. Can you make it work? Here's a tip. Idally you should use functions to create this. Pause the video and give this guy. Okay. How did you go? This one may be a bit harder than you thought. Well done if you did get it. The first things first. We need to create a function. We'll call this background animation. Here, we need to add an input and we can call this game start and hit Okay. Now we need to define this function. Bringing in this classic forever and block, then grabbing an equals operator, and here we can check if games start equals true. Now if it is, we want to switch to our first backdrop. But if it is not, we want our animation to play. To do this, we can grab two switch backdrops and then stick a weight in between, and then a weight at the end. Also change it to start screen one and two. Then all we need to do is grab another when flag clicked, bring in this block to call our function, and then set the input to false. Then we can drag another when I receive block like so, set it to start game, then bring in this function call and set it true. But now, I'm just realized that this doesn't really make sense because calling background animation with false starts the animation while calling it with true ends, but we'll ignore that oversight for now. Clicking play. As you can see our animation works. Clicking start, it goes away and our music starts. Now with that all done, let's move on to our tree sprites. This one will be a little bit easier. Firstly, dragging in a when flag click. Here we can just show the sprite. Then dragging in the when I received block and setting it to start game, we can hide the sprite. Lastly, we need to create animation. Now for this, we can just grab a forever loop and a repeat loop. Inside the repeat loop, we could have a change x by five and then wait 0.5 seconds. Then we can just duplicate this and this time set it to minus five. Lastly, at the start of our script, let's set the x position to zero and set the y to its current position. Now, for our other tree sprite, because it's the same, we can just drag both these scripts into it like this. The only thing we do need to do is change the y position. Here we can just set it to its current position. Clicking play. As you can see, we have a nice animation with the trees clicking start. The disappear. Now, clearly, there is a problem that our sprite and trees are still running. Let's address that. Firstly, moving to our player sprite, we can just drag in a hide onto this one flag clicked and then drag in when I receive, set it to start game, and then drag in a show block. Now we can just drag this when I received block into our tree sprite, our snow pixel sprites, and our score sprite. First, moving to our tree sprite, here we can drag the script onto our W I received start game and stick it onto the when flag click. Then moving to our snow pixel, we can do the exact same thing here. Switching that around and moving the hide, just like that. With the second snow sprite, we can also do the same switch and move. Lastly, with our score. Here we can just drag this set up function call script over to our W I receive start game Last, you can drag in a hide onto the W flag clicked. Clicking play. As you can see, that looks pretty good. When we click Start, well, there are a few problems. Anyways, we'll deal with all of this in the next lesson where we'll finish off this game. But I encourage you to give it a go and try to see if you can fix these final small issues on your own. 58. The Final Touch: Refinements and Revelations: Well, it's the grand finale now. It's time to finish what we started. This is the final phase of development. It's where we look through all our code, test our game a bunch of times, make sure everything is perfect before launch. But first things first, we have a problem when we click Start, which is how all these sprites don't disperse. Let's just fix this one by one. Firstly, with our start button, all we need to do is drag in the when I receive block, change it to start game and then drag in a hide block. Then drag onto the W flag, click. Testing this out and clicking. Start, we can see that it works. Now moving on to our tree sprite this is where we made a mistake previously when we drag this show block I receive start game block. Actually, we don't need this as this happens automatically in our other script, so we can just remove it. Now we can literally do the same for the other sprites. Firstly, our snow pixel. Just remove the show. Then the second snow pixel, do the same. Lastly, with our score, we can also remove the show. Kicking play. Then hitting start. As you can see, our problem has been fixed. Now, there is one more animation I want to add into our start screen, and it is for our start button. Here I want the button to zoom in and out. It's basically going to be very similar code to our tree sprite. Moving over to it, we can just drag a flag clicked forever to repeat blocks. And two change size by blocks, which we can stick into each of these. For the first one, we can set it to 0.2 and the last two -0.2. The last thing we need to do is set the size to its current size, which is 25. Then just bring in a go to block to ensure that it stays in position. That's all. Hitting play, as you can see, we have a nice little animation and clicking start. Well, that works well. Now, one extra thing that can be improved is our obstacle trees. If you have played the game for long enough, you can see the trees just appear in a line formation, which doesn't look very natural. Moving over to our tree sprite, all you have to do is duplicate the script here, like so. But now, if we had to play it, these trees would spawn at the exact same time, which would be even more natural. We want some variability. To fix this, we need to use a bit of math and I know how much you love your math. What we can do is remove this variable here, and then move over to the operators and grab a few blocks here, which are this plus a pick random, a times block and a divide block. Then we can duplicate our spawn variable two times. Now that we have all the pieces, we need to connect them spawn rate plus pick random, then the times block into the first input. Then insert this divide block into this input, and then the spawn variables into each of these inputs. Now, with all that connected, for the first input, we can type two and negative one for the second. Let's quickly run through this so you understand what we're doing here. When the game starts, we continuously create clones. Now, to make the coning feel more natural and instead of always waiting the same amount of time between clones, we add some randomness. We determine the waiting time as follows. Firstly, take the set spawn rate. Example 0.5 seconds. Secondly, randomly pick a value between half of the spawn rate, subtract it from itself, making it negative and the full spawn rate. Thirdly, add this random value to the spawn rate. For example, If the spawn rate is 0.5, the waiting time can be anywhere between 0.25 and 0.5 seconds. The random variation ensures the cones don't appear too predictably and it gives it a far more natural fear. However, the only thing we may need to just now is our spawn speed because now we have two sets of obstacles. To do this, we can lower the initial spawn rate by increasing this number here or changing how much it decreases over here. Okay. Now, there is one other issue you may have picked up on. If you remove this weight statement, you'll see how sometimes trees appear in front of each other. How do we fix this? All we need to do is grab a go to layer block and a move layer block. Then under the script here, when I start as a clone, we wanted to go to back a layer, and then come forward, say 35 layers. Doing this ensures that our trees are laid correctly, and also that our player is behind our tree. We can test it out. If you have a keen eye, you'll notice that the trees are stacked correctly and also our player slines behind our trees. So at this stage, we have reached a very important moment. Follow along with us. Really do. You've got to follow along with us. Just take a moment. Put one of your arms up into the air. Come on. Make sure you're doing it. Put one arm up into the air. Now, reach down as far as you can behind you. You're doing that? Good. Now, tap somewhere in the middle of your back. Excellent. You've just stretched. But more importantly, you have given yourself a well deserved pat on the back. Well done. Your game is complete and making it this far means you are one of our top students and it shows that you have the persistence of a real programmer. Well done. You've done really well to get you. I think it's time that you sit back relax and enjoy what you've created. Why don't you challenge your friends and family to play your game? Hey, if you're going to add a secret mechanic that makes the game harder when they played, who am I to judge, it's your game. It's your persistence and perseverance that have got you here a fantastic job and well done.