1 00:00:07,980 --> 00:00:08,470 ZAMYLA CHAN: All right. 2 00:00:08,470 --> 00:00:10,960 Hello, everyone, and welcome to Walkthrough 0. 3 00:00:10,960 --> 00:00:12,670 My name's Zamyla, and I'll be leading these 4 00:00:12,670 --> 00:00:14,450 walkthroughs this year. 5 00:00:14,450 --> 00:00:17,650 In CS50, every problem set is accompanied by a walkthrough 6 00:00:17,650 --> 00:00:20,390 whereby we'll go through the week's problem set, talk it 7 00:00:20,390 --> 00:00:22,760 through, talk how to get started, discuss different 8 00:00:22,760 --> 00:00:26,120 techniques and tips to really break the problem set into 9 00:00:26,120 --> 00:00:27,600 some manageable bites. 10 00:00:27,600 --> 00:00:29,630 I'm also really happy to answer any questions that you 11 00:00:29,630 --> 00:00:31,440 have on the problem set. 12 00:00:31,440 --> 00:00:33,320 Without further ado, I'm glad you're here, whether you're 13 00:00:33,320 --> 00:00:35,590 here in person or tuning in online. 14 00:00:35,590 --> 00:00:36,840 Let's get started. 15 00:00:39,940 --> 00:00:42,420 >> So the first p-set in CS50-- 16 00:00:42,420 --> 00:00:44,590 actually, we're not going to get into typing and machine 17 00:00:44,590 --> 00:00:45,630 code stuff quite yet. 18 00:00:45,630 --> 00:00:47,360 We're actually going to be using Scratch, which is a 19 00:00:47,360 --> 00:00:49,860 program that allows us to do some drag and drop 20 00:00:49,860 --> 00:00:50,780 programming. 21 00:00:50,780 --> 00:00:54,020 And so even though we're not typing, it really allows us to 22 00:00:54,020 --> 00:00:55,870 explore some of the fundamental concepts that 23 00:00:55,870 --> 00:00:58,710 we'll use all throughout CS50. 24 00:00:58,710 --> 00:01:01,260 Now, some of these concepts are 25 00:01:01,260 --> 00:01:02,860 listed here in the Toolbox. 26 00:01:02,860 --> 00:01:05,830 What I'd like to do for every walkthrough is present you all 27 00:01:05,830 --> 00:01:08,390 with a set of tools that you can use for the walkthrough. 28 00:01:08,390 --> 00:01:09,140 And so, don't worry. 29 00:01:09,140 --> 00:01:11,710 We'll go over all of these terms and all of these 30 00:01:11,710 --> 00:01:13,320 theories during the walkthrough. 31 00:01:13,320 --> 00:01:15,790 Now, whether you end up using all of these tools, or just 32 00:01:15,790 --> 00:01:19,340 some of them, it's really good to know what you're equipped 33 00:01:19,340 --> 00:01:21,225 with to be able to tackle the problem set. 34 00:01:25,650 --> 00:01:29,110 >> So in Scratch, the first lingo that you need to know is what 35 00:01:29,110 --> 00:01:30,110 a sprite is. 36 00:01:30,110 --> 00:01:34,280 So every object or every character, be it a cat a dog 37 00:01:34,280 --> 00:01:36,450 or a ball, is called a sprite. 38 00:01:36,450 --> 00:01:40,710 And so, if I want, say, two cats-- whether or not they're 39 00:01:40,710 --> 00:01:41,360 identical-- 40 00:01:41,360 --> 00:01:45,630 I'll need to make two separate sprites in Scratch. 41 00:01:45,630 --> 00:01:49,250 And so sprites have scripts associated with them. 42 00:01:49,250 --> 00:01:51,360 Scripts are actually what you're going to be building-- 43 00:01:51,360 --> 00:01:53,290 dragging and dropping-- with your blocks. 44 00:01:53,290 --> 00:01:57,490 And so what scripts do is kind of determine and define how 45 00:01:57,490 --> 00:02:00,090 the sprite behaves. 46 00:02:00,090 --> 00:02:03,130 Sprites aren't actually just images, because we have 47 00:02:03,130 --> 00:02:05,790 costumes also associated with the sprites that kind of 48 00:02:05,790 --> 00:02:07,430 determine what the sprite looks like. 49 00:02:07,430 --> 00:02:11,000 And you can have more than one costume for a given sprite. 50 00:02:11,000 --> 00:02:14,860 >> So at some point during your Scratch program, as we'll show 51 00:02:14,860 --> 00:02:17,150 later on today during the walkthrough, you can actually 52 00:02:17,150 --> 00:02:19,640 change the costume of your sprite to make it look either 53 00:02:19,640 --> 00:02:22,490 slightly different or completely different. 54 00:02:22,490 --> 00:02:26,290 And so there are three ways of creating a sprite in Scratch. 55 00:02:26,290 --> 00:02:28,970 One, you can draw your own in Scratch's 56 00:02:28,970 --> 00:02:30,430 built in paint editor. 57 00:02:30,430 --> 00:02:35,240 You can upload your own image, use one of Scratch's built-in 58 00:02:35,240 --> 00:02:38,590 ones, or, the last option, get a random sprite. 59 00:02:38,590 --> 00:02:41,760 Now, if you are feeling particularly lucky, then I 60 00:02:41,760 --> 00:02:45,120 welcome you to try your luck and create a random sprite. 61 00:02:48,680 --> 00:02:50,890 >> So all of the sprites are placed on 62 00:02:50,890 --> 00:02:52,290 the stage in Scratch. 63 00:02:52,290 --> 00:02:55,130 The stage-- we can treat it as our canvas. 64 00:02:55,130 --> 00:02:57,510 And so all of the sprites are placed on the stage. 65 00:02:57,510 --> 00:03:02,920 And this stage, what it does is allows all of the sprites 66 00:03:02,920 --> 00:03:04,160 to move around on it. 67 00:03:04,160 --> 00:03:09,380 And just like sprites, the stage also has scripts. 68 00:03:09,380 --> 00:03:11,930 And so these scripts, to place them on the stage-- 69 00:03:11,930 --> 00:03:14,230 it's really useful when, say, you have a script that doesn't 70 00:03:14,230 --> 00:03:17,720 exactly pertain to one specific sprite, but rather 71 00:03:17,720 --> 00:03:20,860 pertains to multiple sprites or just, in general, something 72 00:03:20,860 --> 00:03:21,870 that you want to do. 73 00:03:21,870 --> 00:03:25,070 So you can place those scripts on the stage instead, and that 74 00:03:25,070 --> 00:03:28,010 would be slightly better design. 75 00:03:28,010 --> 00:03:32,680 Now, while you can have multiple sprites, it's good to 76 00:03:32,680 --> 00:03:34,420 keep in mind that you can only have one stage. 77 00:03:34,420 --> 00:03:37,820 But stages also have backgrounds. 78 00:03:37,820 --> 00:03:40,590 As opposed to costumes, like sprites do, stages have 79 00:03:40,590 --> 00:03:41,100 backgrounds. 80 00:03:41,100 --> 00:03:44,340 And again, you can either draw your own or upload your own 81 00:03:44,340 --> 00:03:46,140 image to use as a background. 82 00:03:49,770 --> 00:03:54,100 >> So does anyone have any questions before we go on? 83 00:03:54,100 --> 00:03:54,380 OK. 84 00:03:54,380 --> 00:03:56,880 Feel free to interrupt me what during the walkthrough, and 85 00:03:56,880 --> 00:03:58,780 I'm happy to answer any questions you have. 86 00:04:02,750 --> 00:04:03,230 OK. 87 00:04:03,230 --> 00:04:05,950 So when you start your sprite program, what you're going to 88 00:04:05,950 --> 00:04:08,430 do is you're going to click the green flag. 89 00:04:08,430 --> 00:04:10,820 But if you don't connect anything to this block right 90 00:04:10,820 --> 00:04:13,400 here, then nothing's actually going to happen. 91 00:04:13,400 --> 00:04:16,450 Because, you see, what the scripts and the stage need to 92 00:04:16,450 --> 00:04:20,149 do is actually know to respond to the event-- 93 00:04:20,149 --> 00:04:22,360 that's what we call them, events-- of the green flag 94 00:04:22,360 --> 00:04:23,200 being clicked. 95 00:04:23,200 --> 00:04:26,840 So you need to actually attach blocks to the groove at the 96 00:04:26,840 --> 00:04:30,270 bottom of that green flag clicked block, and then the 97 00:04:30,270 --> 00:04:32,670 program will know what to do and how to respond to the 98 00:04:32,670 --> 00:04:35,700 green flag being clicked. 99 00:04:35,700 --> 00:04:38,180 >> Well, what comes after that? 100 00:04:38,180 --> 00:04:43,930 Well, we have a plethora of blocks in Scratch to use, and 101 00:04:43,930 --> 00:04:47,150 where the meat, really, of your program lies in these 102 00:04:47,150 --> 00:04:48,000 statements. 103 00:04:48,000 --> 00:04:49,900 And so these statements are conveniently 104 00:04:49,900 --> 00:04:51,270 organized by color. 105 00:04:51,270 --> 00:04:54,970 You have actions related to movement, 106 00:04:54,970 --> 00:04:56,930 sound, looks, et cetera. 107 00:04:56,930 --> 00:04:59,530 And so you can see you can navigate between them in the 108 00:04:59,530 --> 00:05:02,480 tabs in your Scratch program. 109 00:05:02,480 --> 00:05:04,870 And so, while you'll have other things built around it, 110 00:05:04,870 --> 00:05:08,520 what the statements actually do is actually tells the 111 00:05:08,520 --> 00:05:10,380 sprites or the stage to do something. 112 00:05:10,380 --> 00:05:13,450 As opposed to just saying, OK, when you do this, the 113 00:05:13,450 --> 00:05:16,660 statements actually contain the real meat of it. 114 00:05:19,410 --> 00:05:22,210 Let's say you want to only execute a certain action, say 115 00:05:22,210 --> 00:05:26,180 you only want the cat to meow when a certain thing happens. 116 00:05:26,180 --> 00:05:28,430 We can take advantage of Booleans, which you learned in 117 00:05:28,430 --> 00:05:29,470 lecture one. 118 00:05:29,470 --> 00:05:32,580 And so these are expressions that evaluate to 119 00:05:32,580 --> 00:05:34,140 either true or false. 120 00:05:34,140 --> 00:05:37,510 And so these are identified in Scratch by the-- 121 00:05:37,510 --> 00:05:42,360 you see the angles at the end of those blocks. 122 00:05:42,360 --> 00:05:45,420 And so you have a variety of different types of Booleans. 123 00:05:45,420 --> 00:05:49,550 You have "is the most being pressed down," "does 2 plus 2 124 00:05:49,550 --> 00:05:53,830 equate to 5," or "is the user pressing down a certain key on 125 00:05:53,830 --> 00:05:55,510 the keyboard?" 126 00:05:55,510 --> 00:05:57,210 >> Now, you can't just use these alone. 127 00:05:57,210 --> 00:06:00,970 What you have to do is combine them with a condition. 128 00:06:00,970 --> 00:06:04,420 So the condition's there under the control tab in Scratch. 129 00:06:04,420 --> 00:06:07,350 And so they conveniently have a little placeholder that 130 00:06:07,350 --> 00:06:10,940 shows the shape of the block that you need to put into it. 131 00:06:10,940 --> 00:06:14,720 So depending on the context of the situation, you can choose 132 00:06:14,720 --> 00:06:17,600 a Boolean and then place it inside your condition. 133 00:06:17,600 --> 00:06:19,570 And there you have a conditional statement. 134 00:06:19,570 --> 00:06:23,030 If you put statements inside that block, then you have a 135 00:06:23,030 --> 00:06:26,980 structure set up, whereby once a certain condition is met on 136 00:06:26,980 --> 00:06:30,494 the left, you then execute the statement. 137 00:06:30,494 --> 00:06:31,462 Yes? 138 00:06:31,462 --> 00:06:33,720 >> STUDENT: If a variable represents a number, can you 139 00:06:33,720 --> 00:06:36,302 use the variable inside the Boolean, like the green one, 140 00:06:36,302 --> 00:06:36,790 for example? 141 00:06:36,790 --> 00:06:37,540 ZAMYLA CHAN: Yes, you can. 142 00:06:37,540 --> 00:06:41,500 You can drag and drop the variable value inside the 143 00:06:41,500 --> 00:06:42,750 circular shape there. 144 00:06:48,820 --> 00:06:52,160 >> Now, one of the advantages of computers is the vast power 145 00:06:52,160 --> 00:06:54,980 and speed at which they can execute repetitive processes. 146 00:06:54,980 --> 00:07:00,370 And so, instead of, say, repeating an instruction over 147 00:07:00,370 --> 00:07:03,020 and over and over again and actually typing that out-- or 148 00:07:03,020 --> 00:07:05,000 in this case, in Scratch, dragging and dropping and 149 00:07:05,000 --> 00:07:05,960 dragging and dropping-- 150 00:07:05,960 --> 00:07:08,750 what we can do is encapsulate it in a loop. 151 00:07:08,750 --> 00:07:11,640 And so, loops can be used to either execute things 152 00:07:11,640 --> 00:07:14,750 infinitely with a forever loop, or for a 153 00:07:14,750 --> 00:07:15,880 set number of times-- 154 00:07:15,880 --> 00:07:20,800 say, repeat "say hi" 10 times or until a certain 155 00:07:20,800 --> 00:07:22,040 condition is true. 156 00:07:22,040 --> 00:07:26,370 And so again, you see that Scratch is hinting that when 157 00:07:26,370 --> 00:07:29,540 you have a condition such as "repeat until," then the only 158 00:07:29,540 --> 00:07:34,760 thing that will fit inside there is a Boolean value. 159 00:07:34,760 --> 00:07:35,120 All right. 160 00:07:35,120 --> 00:07:38,170 >> So now, we know that we can encapsulate repetitive 161 00:07:38,170 --> 00:07:39,840 processes inside of loops. 162 00:07:39,840 --> 00:07:42,880 You can see why something like this might not be ideal. 163 00:07:42,880 --> 00:07:45,600 It doesn't fit on the slide. 164 00:07:45,600 --> 00:07:48,500 Essentially, it just does the same thing over and over again 165 00:07:48,500 --> 00:07:49,340 10 times, in fact. 166 00:07:49,340 --> 00:07:53,380 It moves 10 steps, says hello, moves 10 steps, says hello. 167 00:07:53,380 --> 00:07:56,140 So now you can see that once we have loops, something like 168 00:07:56,140 --> 00:07:58,420 this is a lot better. 169 00:07:58,420 --> 00:08:02,690 It's shorter, it's smaller, and it actually completes the 170 00:08:02,690 --> 00:08:03,610 same thing. 171 00:08:03,610 --> 00:08:06,420 Now, in Scratch this might not make much of a difference, but 172 00:08:06,420 --> 00:08:08,510 it actually saves you some time. 173 00:08:12,720 --> 00:08:16,800 >> So onto the variable expression-- 174 00:08:16,800 --> 00:08:20,260 you can actually use variables and put them inside of 175 00:08:20,260 --> 00:08:20,930 conditions. 176 00:08:20,930 --> 00:08:23,490 As expressed right there, you see we have a variable named 177 00:08:23,490 --> 00:08:26,810 "counter," and we're equating that to see whether 178 00:08:26,810 --> 00:08:28,040 it's less than 0. 179 00:08:28,040 --> 00:08:30,900 So variables are essentially, I'd say, 180 00:08:30,900 --> 00:08:32,330 containers for values. 181 00:08:32,330 --> 00:08:36,330 In Scratch, those types of values can either be words or 182 00:08:36,330 --> 00:08:37,390 they can be numbers. 183 00:08:37,390 --> 00:08:41,860 And so, with these variables, what we can do with them is we 184 00:08:41,860 --> 00:08:42,970 can set their value. 185 00:08:42,970 --> 00:08:46,590 So in the first example here, we have the example of text 186 00:08:46,590 --> 00:08:50,470 containing the value "Hello, World!" In the second example, 187 00:08:50,470 --> 00:08:53,220 it's assumed that we already have a variable named 188 00:08:53,220 --> 00:08:56,020 "counter," and in that case, we're changing it by 3. 189 00:08:56,020 --> 00:08:58,170 We're incrementing it by 3. 190 00:08:58,170 --> 00:09:01,680 And then in the last example, the variables can be dragged 191 00:09:01,680 --> 00:09:04,320 to be put in a Boolean expression. 192 00:09:06,830 --> 00:09:12,200 >> Now, when you create a variable, what you have to 193 00:09:12,200 --> 00:09:16,900 decide is whether you make the variable for all of the 194 00:09:16,900 --> 00:09:19,380 sprites in your Scratch program, or for just the 195 00:09:19,380 --> 00:09:22,710 specifics sprite in which you've selected when you make 196 00:09:22,710 --> 00:09:23,930 the variable. 197 00:09:23,930 --> 00:09:27,480 And so this is a very important decision to make. 198 00:09:27,480 --> 00:09:30,100 And it really comes down to what scope you want the 199 00:09:30,100 --> 00:09:31,200 variable to have. 200 00:09:31,200 --> 00:09:35,170 So for instance, an example of local scope would be if you 201 00:09:35,170 --> 00:09:38,370 choose just for this sprite to have the variable. 202 00:09:38,370 --> 00:09:43,250 So that would mean that only that sprite would be able to 203 00:09:43,250 --> 00:09:44,440 access that variable. 204 00:09:44,440 --> 00:09:46,670 Only that sprite would be able to see it, 205 00:09:46,670 --> 00:09:48,020 change it, modify it. 206 00:09:48,020 --> 00:09:49,910 If you choose for to have a global scope-- 207 00:09:49,910 --> 00:09:52,520 so that's if you say for all sprites, if 208 00:09:52,520 --> 00:09:53,960 you select that option-- 209 00:09:53,960 --> 00:09:57,780 then that means that the stage as well as all of the sprites 210 00:09:57,780 --> 00:10:01,350 will be able to see, modify, and access that variable that 211 00:10:01,350 --> 00:10:04,420 you've created. 212 00:10:04,420 --> 00:10:07,080 Any questions so far on variables or anything? 213 00:10:07,080 --> 00:10:08,674 Yes. 214 00:10:08,674 --> 00:10:11,248 >> STUDENT: For the variables, can you have two variables of 215 00:10:11,248 --> 00:10:14,300 the same name if they're on different sprites? 216 00:10:14,300 --> 00:10:16,370 ZAMYLA CHAN: As long as they are local sprites--- 217 00:10:18,870 --> 00:10:20,700 ah, yes, sorry. 218 00:10:20,700 --> 00:10:24,010 So the question was whether you can have two variables of 219 00:10:24,010 --> 00:10:28,890 the same name in a program and if you have two variables with 220 00:10:28,890 --> 00:10:32,760 the same name but are both local sprites, so sprite one, 221 00:10:32,760 --> 00:10:36,070 the cat, has a variable name "counter," and sprite two, the 222 00:10:36,070 --> 00:10:38,870 dog, has a variable named "counter," as long as those 223 00:10:38,870 --> 00:10:43,040 are both local sprites, then their scope doesn't extend to 224 00:10:43,040 --> 00:10:44,540 the rest of the program. 225 00:10:44,540 --> 00:10:47,080 And so none of the other sprites or the 226 00:10:47,080 --> 00:10:48,360 stage will get confused. 227 00:10:53,860 --> 00:10:54,210 All right. 228 00:10:54,210 --> 00:10:58,230 >> So I mentioned before the entry point when we had the 229 00:10:58,230 --> 00:11:01,560 when green flagged clicked block. 230 00:11:01,560 --> 00:11:05,350 And so what that is-- 231 00:11:05,350 --> 00:11:08,880 it says, OK, when the event happens that the green flag is 232 00:11:08,880 --> 00:11:11,450 clicked, this is what you should do. 233 00:11:11,450 --> 00:11:13,220 And so that isn't actually the only event 234 00:11:13,220 --> 00:11:14,380 that we have in Scratch. 235 00:11:14,380 --> 00:11:16,060 We also have other events. 236 00:11:16,060 --> 00:11:18,320 So we have, for instance, when a key on 237 00:11:18,320 --> 00:11:19,290 the keyboard is pressed. 238 00:11:19,290 --> 00:11:23,660 And you could actually choose the letters A through Z, 0 239 00:11:23,660 --> 00:11:27,270 through 9, or the arrow keys. 240 00:11:27,270 --> 00:11:30,770 And then we also have other events, such as when your 241 00:11:30,770 --> 00:11:33,150 sprite is clicked. 242 00:11:33,150 --> 00:11:36,590 And so when you start with that, you notice the key trend 243 00:11:36,590 --> 00:11:38,950 is that they only have a groove on the bottom, and so 244 00:11:38,950 --> 00:11:42,950 then that, again, keys you in that nothing attaches above 245 00:11:42,950 --> 00:11:43,640 that block. 246 00:11:43,640 --> 00:11:48,770 You build from that and below. 247 00:11:48,770 --> 00:11:53,040 >> Now, say, what happens if we want some event to happen just 248 00:11:53,040 --> 00:11:58,200 when, I don't know, a cat is touching a certain section of 249 00:11:58,200 --> 00:11:59,830 the stage or something like that? 250 00:11:59,830 --> 00:12:02,420 We actually don't have any built in 251 00:12:02,420 --> 00:12:04,410 event to signify that. 252 00:12:04,410 --> 00:12:07,850 So what we'll have to do is actually create our own event. 253 00:12:07,850 --> 00:12:09,950 And that's called broadcasting. 254 00:12:09,950 --> 00:12:13,070 So when you want to signal that a certain has happened, 255 00:12:13,070 --> 00:12:16,910 then you use-- in the control tab, there is a block called 256 00:12:16,910 --> 00:12:20,400 "broadcast." And so then, you'll type in the name of the 257 00:12:20,400 --> 00:12:24,990 event that you want to broadcast, and then whichever 258 00:12:24,990 --> 00:12:26,350 sprite or sprites-- 259 00:12:26,350 --> 00:12:28,640 you can have multiple sprites reacting to this message-- 260 00:12:28,640 --> 00:12:31,460 or the stage will have to handle it, will have to 261 00:12:31,460 --> 00:12:34,970 receive it, will have to say, OK, I understand that this has 262 00:12:34,970 --> 00:12:37,850 happened, so I'm going to do this with it. 263 00:12:37,850 --> 00:12:40,850 And so whenever you broadcast an event, that's with the 264 00:12:40,850 --> 00:12:44,870 understanding that either that sprite or another sprite is 265 00:12:44,870 --> 00:12:47,860 going to have to receive that event and respond. 266 00:12:52,610 --> 00:12:55,710 >> Now, the last concept before we get into an actual example 267 00:12:55,710 --> 00:12:58,390 of a Scratch program is threads. 268 00:12:58,390 --> 00:13:02,110 So threads is when your computer is executing 269 00:13:02,110 --> 00:13:04,320 simultaneous processes at the same time. 270 00:13:04,320 --> 00:13:06,940 I guarantee you that all of us have taken advantage of 271 00:13:06,940 --> 00:13:09,810 threads when we we're watching a movie at the same time as 272 00:13:09,810 --> 00:13:11,540 typing an essay or something like that. 273 00:13:11,540 --> 00:13:14,020 The computer is executing several things at the same 274 00:13:14,020 --> 00:13:17,480 time, just like Scratch can. 275 00:13:17,480 --> 00:13:22,060 So as you can see in this example, these two scripts can 276 00:13:22,060 --> 00:13:25,460 be used for the exact same sprite, because these 277 00:13:25,460 --> 00:13:27,590 beginning entry point blocks can actually used 278 00:13:27,590 --> 00:13:28,840 multiples of times. 279 00:13:28,840 --> 00:13:32,570 I guarantee you that probably the green flag clicked block 280 00:13:32,570 --> 00:13:36,890 will be one of the most popular 281 00:13:36,890 --> 00:13:39,230 blocks in your program. 282 00:13:39,230 --> 00:13:43,500 So here we see that when the green flag is clicked, there's 283 00:13:43,500 --> 00:13:47,970 a process going on, as well as when the green flag is 284 00:13:47,970 --> 00:13:50,150 clicked, there's a separate process going on. 285 00:13:50,150 --> 00:13:53,650 And so Scratch will run these two at the same time. 286 00:13:53,650 --> 00:13:55,930 And so using these threads, knowing that you can actually 287 00:13:55,930 --> 00:13:58,010 have more than one entry point-- 288 00:13:58,010 --> 00:14:00,450 even if it is the same entry point-- 289 00:14:00,450 --> 00:14:04,340 it's going to become really useful if you want to, say, 290 00:14:04,340 --> 00:14:06,290 separate distinct tasks from one another. 291 00:14:10,060 --> 00:14:10,490 All right. 292 00:14:10,490 --> 00:14:17,670 So let's actually look into an example of a Scratch program. 293 00:14:25,790 --> 00:14:26,360 >> OK. 294 00:14:26,360 --> 00:14:29,150 So I've already made a little program for us here. 295 00:14:29,150 --> 00:14:34,740 So I'm just going click the green flag to start and see 296 00:14:34,740 --> 00:14:36,520 what it does. 297 00:14:36,520 --> 00:14:39,590 So we have an orange fish here-- 298 00:14:39,590 --> 00:14:41,420 a fish sprite-- 299 00:14:41,420 --> 00:14:47,960 seems to move and then reset and go back. 300 00:14:47,960 --> 00:14:49,250 And then we have a shark sprite. 301 00:14:49,250 --> 00:14:51,705 And this shark sprite can move, it can rotate, it can 302 00:14:51,705 --> 00:14:53,180 swim around. 303 00:14:53,180 --> 00:14:53,520 OK. 304 00:14:53,520 --> 00:14:56,650 So that's kind of fun. 305 00:14:56,650 --> 00:15:00,750 But we can definitely add more to that. 306 00:15:00,750 --> 00:15:05,790 For instance, we see that when the shark is moving, it can 307 00:15:05,790 --> 00:15:07,740 actually get off the screen and almost 308 00:15:07,740 --> 00:15:11,150 disappear from sight. 309 00:15:11,150 --> 00:15:13,010 So we want to change that, because we don't want the 310 00:15:13,010 --> 00:15:14,610 shark to escape. 311 00:15:14,610 --> 00:15:19,840 And so let's stop our script and then edit the shark 312 00:15:19,840 --> 00:15:22,720 scripts, perhaps add something. 313 00:15:22,720 --> 00:15:27,400 Notice that in this particular sprite here, the forever loop 314 00:15:27,400 --> 00:15:29,160 ends with a straight edge. 315 00:15:29,160 --> 00:15:30,920 It doesn't have any groove. 316 00:15:30,920 --> 00:15:34,410 So in fact this makes sense, because it's a forever loop. 317 00:15:34,410 --> 00:15:37,430 It's executing something infinitely. 318 00:15:37,430 --> 00:15:40,240 So it won't ever end. 319 00:15:40,240 --> 00:15:41,810 Even if there was something below it, would 320 00:15:41,810 --> 00:15:43,030 never get to that. 321 00:15:43,030 --> 00:15:49,000 So you are actually forced to introduce a thread. 322 00:15:49,000 --> 00:15:49,500 >> All right. 323 00:15:49,500 --> 00:15:52,490 So let's add another script. 324 00:15:52,490 --> 00:15:55,210 So I'm going to start with this entry point of when green 325 00:15:55,210 --> 00:15:56,850 flag is clicked. 326 00:15:56,850 --> 00:16:04,900 So what I want to do is continuously check whether the 327 00:16:04,900 --> 00:16:07,210 shark is going to be touching the edge. 328 00:16:07,210 --> 00:16:10,560 But I know that, actually, under Motion there's a neat 329 00:16:10,560 --> 00:16:16,170 little block that says, oh, if on edge, bounce. 330 00:16:16,170 --> 00:16:18,930 So what we want to do is continuously execute. 331 00:16:18,930 --> 00:16:22,010 And so what this "if on edge, bounce" does-- it actually 332 00:16:22,010 --> 00:16:26,170 already checks if I'm on the edge, then bounce back. 333 00:16:26,170 --> 00:16:31,770 So we need to find some kind of loop to continuously 334 00:16:31,770 --> 00:16:34,350 execute this statement. 335 00:16:34,350 --> 00:16:37,360 So if we look under Control, does anyone have an idea of 336 00:16:37,360 --> 00:16:42,060 what loop we might want to use? 337 00:16:42,060 --> 00:16:42,530 Yeah. 338 00:16:42,530 --> 00:16:43,470 >> STUDENT: The forever loop. 339 00:16:43,470 --> 00:16:44,300 ZAMYLA CHAN: Exactly, yeah. 340 00:16:44,300 --> 00:16:45,080 The forever loop. 341 00:16:45,080 --> 00:16:48,370 So let's track that here, and then say, if on edge, bounce. 342 00:16:48,370 --> 00:16:51,580 And then let's see. 343 00:16:51,580 --> 00:16:52,120 All right. 344 00:16:52,120 --> 00:16:54,460 So the fish is moving as per usual. 345 00:16:54,460 --> 00:16:55,540 And then, oh-- 346 00:16:55,540 --> 00:17:00,280 now the shark can't escape and bounces off the screen. 347 00:17:00,280 --> 00:17:01,155 Cool. 348 00:17:01,155 --> 00:17:01,600 All right. 349 00:17:01,600 --> 00:17:02,770 So I was looking in. 350 00:17:02,770 --> 00:17:03,710 I can't-- yes? 351 00:17:03,710 --> 00:17:06,196 >> STUDENT: How do you make that apply to the shark as it moves 352 00:17:06,196 --> 00:17:07,329 to the fish? 353 00:17:07,329 --> 00:17:07,780 ZAMYLA CHAN: Ah. 354 00:17:07,780 --> 00:17:15,910 So the reason why only the shark bounces, as opposed to 355 00:17:15,910 --> 00:17:20,530 fish as well, is because this script that we wrote is inside 356 00:17:20,530 --> 00:17:21,290 the shark sprite. 357 00:17:21,290 --> 00:17:22,950 You see, up here, the shark sprite is selected. 358 00:17:25,609 --> 00:17:25,990 All right. 359 00:17:25,990 --> 00:17:30,730 So let's add something else. 360 00:17:30,730 --> 00:17:34,260 I was exploring on the different costumes that 361 00:17:34,260 --> 00:17:37,870 Scratch has, and I saw this cute little shark-chomp. 362 00:17:37,870 --> 00:17:41,070 So I thought that, hey, well, maybe we can implement the 363 00:17:41,070 --> 00:17:45,975 shark chomping, for instance, when we press space. 364 00:17:45,975 --> 00:17:47,560 I'm just going to stop this. 365 00:17:47,560 --> 00:17:49,990 All right. 366 00:17:49,990 --> 00:17:50,476 Yes. 367 00:17:50,476 --> 00:17:54,370 >> STUDENT: Could you just show the-- is that under Costumes? 368 00:17:54,370 --> 00:17:54,900 ZAMYLA CHAN: Oh, yes. 369 00:17:54,900 --> 00:17:59,560 So I went under Costumes, and then I looked under Import. 370 00:17:59,560 --> 00:18:02,780 And so here, Scratch has a whole array of costumes that 371 00:18:02,780 --> 00:18:03,500 you can choose. 372 00:18:03,500 --> 00:18:07,120 And so then there's a whole bunch of animals, and then the 373 00:18:07,120 --> 00:18:09,560 shark has a couple of costumes associated with it. 374 00:18:15,116 --> 00:18:15,580 OK. 375 00:18:15,580 --> 00:18:22,480 So in this script here, I'm already checking continuously 376 00:18:22,480 --> 00:18:26,090 in the forever loop, OK, well, if the left arrow is pressed, 377 00:18:26,090 --> 00:18:28,720 then I want to rotate counterclockwise. 378 00:18:28,720 --> 00:18:32,180 If the right arrow is pressed, I want to rotate clockwise. 379 00:18:32,180 --> 00:18:33,800 If the up arrow is pressed, then I 380 00:18:33,800 --> 00:18:36,050 want to progress forward. 381 00:18:36,050 --> 00:18:42,250 So what we can do is just add to this script, instead of 382 00:18:42,250 --> 00:18:45,350 adding a separate one, because this is already checking in 383 00:18:45,350 --> 00:18:48,640 the theme of which keys are being pressed. 384 00:18:48,640 --> 00:18:52,050 >> So let's add one that says if the space key-- let's use the 385 00:18:52,050 --> 00:18:54,200 space key to chomp down. 386 00:18:54,200 --> 00:18:58,970 So these key left arrow pressed, et cetera, these are 387 00:18:58,970 --> 00:19:00,680 in the brighter blue. 388 00:19:00,680 --> 00:19:04,520 So let's go to Sensing the brighter blue, and look down. 389 00:19:04,520 --> 00:19:09,020 Oh, and here is a key space pressed. 390 00:19:09,020 --> 00:19:13,510 So what we want to do is have the shark switch to its 391 00:19:13,510 --> 00:19:15,320 chomping down costume. 392 00:19:15,320 --> 00:19:16,670 That has to do with how the shark 393 00:19:16,670 --> 00:19:18,160 looks, so we go to Looks. 394 00:19:18,160 --> 00:19:21,560 And here we have, conveniently, switch to 395 00:19:21,560 --> 00:19:23,680 costume shark-chomp. 396 00:19:23,680 --> 00:19:27,980 But when we chomp down, we don't want the shark to be 397 00:19:27,980 --> 00:19:30,820 chomping down forever, so let's add, OK, well then, 398 00:19:30,820 --> 00:19:36,950 after it chomps, we want it to switch back. 399 00:19:36,950 --> 00:19:41,790 OK, so let's see what that does. 400 00:19:41,790 --> 00:19:43,990 So we have it moving around. 401 00:19:43,990 --> 00:19:44,720 OK. 402 00:19:44,720 --> 00:19:46,660 So we have it chomping. 403 00:19:46,660 --> 00:19:51,240 It's chomping kind of quickly though, because in Scratch, 404 00:19:51,240 --> 00:19:53,710 it's executing them instantaneously. 405 00:19:53,710 --> 00:19:58,300 So then, let's go to Control and make it appreciate its 406 00:19:58,300 --> 00:19:59,785 chomp, wait one second. 407 00:20:03,890 --> 00:20:09,130 And here it chomps down a little longer before it goes 408 00:20:09,130 --> 00:20:11,180 back to its hunger. 409 00:20:11,180 --> 00:20:11,530 >> OK. 410 00:20:11,530 --> 00:20:13,210 So I'm pretty happy with the shark now. 411 00:20:13,210 --> 00:20:18,740 But the fish, what it seems to be doing-- it's progressing a 412 00:20:18,740 --> 00:20:20,750 couple of steps, in fact, five times. 413 00:20:20,750 --> 00:20:24,940 It's moving 50 steps. 414 00:20:24,940 --> 00:20:29,280 And then what it's doing here in this top block here is I'm 415 00:20:29,280 --> 00:20:35,180 saying, OK, well, it's going to go to a certain value of x. 416 00:20:35,180 --> 00:20:38,560 To find the coordinates, you can actually just mouse over 417 00:20:38,560 --> 00:20:40,550 the screen, and then in the bottom-- 418 00:20:40,550 --> 00:20:41,530 right over here-- 419 00:20:41,530 --> 00:20:43,210 it'll show you what the coordinates are. 420 00:20:43,210 --> 00:20:45,950 So you can take advantage of that to input the coordinates 421 00:20:45,950 --> 00:20:46,830 that you want. 422 00:20:46,830 --> 00:20:49,160 And so what this statement here is saying is saying, OK, 423 00:20:49,160 --> 00:20:54,200 well, the fish starts at this certain x value and then the 424 00:20:54,200 --> 00:20:55,540 height of it can change. 425 00:20:55,540 --> 00:20:59,740 I'm actually going to pick a random height that still stays 426 00:20:59,740 --> 00:21:02,580 within the constraints of the stage. 427 00:21:02,580 --> 00:21:04,320 And so here, what I'm taking advantage of is 428 00:21:04,320 --> 00:21:05,680 broadcasting events. 429 00:21:05,680 --> 00:21:09,310 So you see that this event handler is new fish1. 430 00:21:09,310 --> 00:21:14,730 So whenever the fish receives the new fish1 event, it'll 431 00:21:14,730 --> 00:21:16,250 execute this. 432 00:21:16,250 --> 00:21:19,740 And then you see that after it moves forward its set amount 433 00:21:19,740 --> 00:21:21,400 of times, then it actually broadcasts 434 00:21:21,400 --> 00:21:22,720 again, OK, new fish1. 435 00:21:25,560 --> 00:21:31,860 But instead, how about let's make it so that the fish only 436 00:21:31,860 --> 00:21:35,320 continues to the end of the screen before it resets, 437 00:21:35,320 --> 00:21:37,180 instead of just kind of going to the center of it. 438 00:21:40,480 --> 00:21:46,180 So instead of saying, repeat five times-- because we don't 439 00:21:46,180 --> 00:21:48,380 really know how many times will be needed until it 440 00:21:48,380 --> 00:21:52,180 reaches the end of the screen, let's use something else. 441 00:21:52,180 --> 00:21:54,870 >> So I'm going to separate this out, because we 442 00:21:54,870 --> 00:21:56,080 don't really want this. 443 00:21:56,080 --> 00:21:59,610 To delete blocks in Scratch, what you do is you just drag 444 00:21:59,610 --> 00:22:03,415 it to the left, release, and then it gets deleted. 445 00:22:03,415 --> 00:22:05,470 If you decide that you didn't want to do that, then you can 446 00:22:05,470 --> 00:22:08,970 always undelete it. 447 00:22:08,970 --> 00:22:10,640 But we want to get rid of this. 448 00:22:10,640 --> 00:22:15,490 What we want to do is we want to keep on moving 50 steps and 449 00:22:15,490 --> 00:22:19,400 pausing one second until we touch the end of the screen. 450 00:22:19,400 --> 00:22:25,480 So can anyone spot a loop that we might want to use that 451 00:22:25,480 --> 00:22:28,750 repeats a process just until we touch the screen. 452 00:22:31,594 --> 00:22:33,490 >> STUDENT: Repeat until. 453 00:22:33,490 --> 00:22:36,750 ZAMYLA CHAN: I heard "repeat until," and that's correct. 454 00:22:36,750 --> 00:22:40,990 So yeah, this repeat until block also takes a-- 455 00:22:40,990 --> 00:22:43,770 but we see that this repeat until block isn't quite 456 00:22:43,770 --> 00:22:44,570 complete, right? 457 00:22:44,570 --> 00:22:48,490 So we need to say, OK, well, repeat until when? 458 00:22:48,490 --> 00:22:51,380 So we say, OK, well, repeat until the fish is touching the 459 00:22:51,380 --> 00:22:52,680 edge of the screen. 460 00:22:52,680 --> 00:22:55,230 And so I'll tell you that that is under Sensing. 461 00:22:55,230 --> 00:22:58,930 There's this touching Boolean. 462 00:22:58,930 --> 00:23:04,510 And so you can select here what you want to be checking 463 00:23:04,510 --> 00:23:05,530 that the fish is touching. 464 00:23:05,530 --> 00:23:09,200 So here, we want to say touching the edge. 465 00:23:09,200 --> 00:23:13,110 And then we want to add this back in. 466 00:23:13,110 --> 00:23:21,940 And so now, if we watch our fish go, once it touches the 467 00:23:21,940 --> 00:23:25,170 edge, it'll move back again. 468 00:23:25,170 --> 00:23:25,660 All right. 469 00:23:25,660 --> 00:23:27,390 So I'm happy with that. 470 00:23:27,390 --> 00:23:30,890 And let's open HungryShark1. 471 00:23:34,620 --> 00:23:38,230 >> OK, kind of like a cooking show, I added a little bit 472 00:23:38,230 --> 00:23:39,850 more features. 473 00:23:39,850 --> 00:23:43,080 So for instance, you see that the fish now is actually 474 00:23:43,080 --> 00:23:45,960 gliding quite smoothly, as opposed to before, when it was 475 00:23:45,960 --> 00:23:48,350 kind of moving and stopping, moving and stopping-- 476 00:23:48,350 --> 00:23:52,890 essentially just jumping set pixels. 477 00:23:52,890 --> 00:23:56,810 I looked under Motion, found this glide statement, and I 478 00:23:56,810 --> 00:24:00,515 said, OK, instead of just moving and stopping, moving 479 00:24:00,515 --> 00:24:04,850 and stopping, I'm going to glide 70 units to the right, 480 00:24:04,850 --> 00:24:08,500 but stay at my same y position here. 481 00:24:08,500 --> 00:24:09,680 All right. 482 00:24:09,680 --> 00:24:11,430 So we have a shark that can chomp. 483 00:24:13,940 --> 00:24:15,060 Cool. 484 00:24:15,060 --> 00:24:18,610 But it is called HungryShark, after all, so let's have the 485 00:24:18,610 --> 00:24:20,550 shark eat the fish. 486 00:24:20,550 --> 00:24:29,120 >> So how might we tell the fish or tell the shark that it has 487 00:24:29,120 --> 00:24:30,680 chomped down? 488 00:24:30,680 --> 00:24:32,470 How might we communicate? 489 00:24:32,470 --> 00:24:33,220 Yes. 490 00:24:33,220 --> 00:24:35,120 STUDENT: On the second costume of the shark, 491 00:24:35,120 --> 00:24:36,550 it catches the fish. 492 00:24:36,550 --> 00:24:38,460 ZAMYLA CHAN: Yeah, exactly. 493 00:24:38,460 --> 00:24:42,710 So we know that when we are switching the costume to the 494 00:24:42,710 --> 00:24:45,500 chomp, that we have chomp down. 495 00:24:45,500 --> 00:24:49,530 Now, we will eventually have to check. 496 00:24:49,530 --> 00:24:51,880 Say we want the fish to disappear once its eaten. 497 00:24:51,880 --> 00:24:54,820 We will have to somehow communicate to the fish that 498 00:24:54,820 --> 00:24:59,405 it'll have to hide, for instance, or disappear from 499 00:24:59,405 --> 00:25:01,670 the screen once it's been chomped down on. 500 00:25:01,670 --> 00:25:08,200 >> So what kind of concept, what kind of tool can we use to 501 00:25:08,200 --> 00:25:10,440 have the shark communicate to the fish, OK, 502 00:25:10,440 --> 00:25:11,526 I've chomped down? 503 00:25:11,526 --> 00:25:12,340 STUDENT: Broadcasting. 504 00:25:12,340 --> 00:25:14,290 ZAMYLA CHAN: Yes, exactly, broadcasting an event. 505 00:25:14,290 --> 00:25:17,733 So let's go to Control and let's say broadcast. 506 00:25:20,280 --> 00:25:24,730 And let's broadcast chomp. 507 00:25:24,730 --> 00:25:25,420 All right. 508 00:25:25,420 --> 00:25:27,690 But once we broadcast something, that's with the 509 00:25:27,690 --> 00:25:29,390 assumption that we're actually going to have something 510 00:25:29,390 --> 00:25:30,360 receive it. 511 00:25:30,360 --> 00:25:32,110 And so that's going to be the fish. 512 00:25:32,110 --> 00:25:36,600 So let's say, when I receive chomp. 513 00:25:40,360 --> 00:25:43,720 Now, when the shark chomp down just an empty space, we don't 514 00:25:43,720 --> 00:25:46,180 want the fish to react to that at all. 515 00:25:46,180 --> 00:25:50,780 So let's say, OK, well, only if the shark is touching the 516 00:25:50,780 --> 00:25:52,310 fish at the time of the chomp-- 517 00:25:52,310 --> 00:25:54,210 that's when we'll actually do something. 518 00:25:54,210 --> 00:25:58,560 So then, we're going to use the condition if, right, 519 00:25:58,560 --> 00:26:01,100 because we're checking whether something is true or not. 520 00:26:01,100 --> 00:26:03,170 So if we go back to Sensing, then we can 521 00:26:03,170 --> 00:26:05,760 use here, if touching. 522 00:26:05,760 --> 00:26:07,490 And then here, we'll choose the shark. 523 00:26:12,280 --> 00:26:14,710 Then under Looks, this hide block-- 524 00:26:14,710 --> 00:26:19,250 that'll basically make the fish disappear from the stage. 525 00:26:19,250 --> 00:26:22,760 We'll make it hide, but we want another fish, right? 526 00:26:22,760 --> 00:26:23,820 Our shark is hungry. 527 00:26:23,820 --> 00:26:24,960 We want to give it more fish. 528 00:26:24,960 --> 00:26:31,640 So then let's also broadcast a new fish again. 529 00:26:31,640 --> 00:26:31,890 OK. 530 00:26:31,890 --> 00:26:35,880 So let's see what that does. 531 00:26:35,880 --> 00:26:36,310 >> Cool. 532 00:26:36,310 --> 00:26:38,830 So it chomps down and another fish appears. 533 00:26:38,830 --> 00:26:41,360 But that's a bit too quick for another fish to go. 534 00:26:41,360 --> 00:26:44,610 So let's just wait a second before we 535 00:26:44,610 --> 00:26:45,860 broadcast a new fish. 536 00:26:48,350 --> 00:26:49,110 All right. 537 00:26:49,110 --> 00:26:49,380 OK. 538 00:26:49,380 --> 00:26:52,460 So this is a pretty good making of a game. 539 00:26:52,460 --> 00:26:54,350 But all games need a score, right? 540 00:26:54,350 --> 00:26:57,070 So what could we use to keep score? 541 00:27:00,370 --> 00:27:00,630 Yes. 542 00:27:00,630 --> 00:27:01,005 STUDENT: Other-- 543 00:27:01,005 --> 00:27:01,830 ZAMYLA CHAN: Yeah. 544 00:27:01,830 --> 00:27:02,290 Exactly. 545 00:27:02,290 --> 00:27:04,520 Yeah. 546 00:27:04,520 --> 00:27:06,480 So we do want to keep track of basically how 547 00:27:06,480 --> 00:27:07,660 many fish it's eaten. 548 00:27:07,660 --> 00:27:09,430 To do that, we'll have to make a variable. 549 00:27:09,430 --> 00:27:11,100 Let's call that score. 550 00:27:11,100 --> 00:27:14,240 And so presumably, since this is a game that we're playing, 551 00:27:14,240 --> 00:27:18,060 we're going to want the fish to be able to-- 552 00:27:18,060 --> 00:27:19,860 say, once its eaten it can increase the score or 553 00:27:19,860 --> 00:27:23,780 something and then the stage will probably have to do 554 00:27:23,780 --> 00:27:25,020 something with the sore as well. 555 00:27:25,020 --> 00:27:28,280 So I'm going to choose to make this a global variable and say 556 00:27:28,280 --> 00:27:30,920 for all sprites. 557 00:27:30,920 --> 00:27:31,470 OK. 558 00:27:31,470 --> 00:27:33,880 So when do we want to increase the score? 559 00:27:33,880 --> 00:27:36,440 When a fish has been eaten. 560 00:27:36,440 --> 00:27:39,390 And so we already have a process here that's dealing 561 00:27:39,390 --> 00:27:40,800 with the fish being eaten. 562 00:27:40,800 --> 00:27:43,570 So let's add this statement here-- 563 00:27:43,570 --> 00:27:44,820 change Score by 1. 564 00:27:49,208 --> 00:27:49,670 Cool. 565 00:27:49,670 --> 00:27:54,580 So once you eat a fish, the score increases. 566 00:27:54,580 --> 00:27:54,790 >> All right. 567 00:27:54,790 --> 00:27:57,090 So say I am tired of this game. 568 00:27:57,090 --> 00:27:58,410 I stop. 569 00:27:58,410 --> 00:28:01,110 And then, oh, I want to come back to the game. 570 00:28:01,110 --> 00:28:02,630 I want to start a new game. 571 00:28:02,630 --> 00:28:05,550 Well, the score is still 3, even though I'm 572 00:28:05,550 --> 00:28:06,680 playing a new game. 573 00:28:06,680 --> 00:28:10,190 We don't really want to score never to reset, right? 574 00:28:10,190 --> 00:28:16,240 So let's add a statement when the game is started in the 575 00:28:16,240 --> 00:28:19,990 stage to say, OK, well, we want to reset the score. 576 00:28:19,990 --> 00:28:23,100 So here we set the variable score to 0. 577 00:28:23,100 --> 00:28:27,960 And so now, whenever you start a game, the score 578 00:28:27,960 --> 00:28:30,920 will start at 0. 579 00:28:30,920 --> 00:28:32,270 Cool. 580 00:28:32,270 --> 00:28:33,520 OK. 581 00:28:36,875 --> 00:28:37,340 OK. 582 00:28:37,340 --> 00:28:40,240 So now, let's go on to HungryShark2. 583 00:28:40,240 --> 00:28:43,500 >> So I've done a little bit more now, and what I've done is 584 00:28:43,500 --> 00:28:44,860 right clicked on the fish sprite. 585 00:28:44,860 --> 00:28:47,970 I wanted more fish, and so I clicked duplicate and it made 586 00:28:47,970 --> 00:28:51,930 a new sprite identical to that one and also copied in all the 587 00:28:51,930 --> 00:28:53,030 scripts as well. 588 00:28:53,030 --> 00:28:56,810 So then this fish2 is essentially identical to 589 00:28:56,810 --> 00:28:59,630 fish1, except instead of starting at the left and 590 00:28:59,630 --> 00:29:02,550 moving right, it starts at the right and moves left. 591 00:29:02,550 --> 00:29:06,390 And then I also chose a new costume for it. 592 00:29:06,390 --> 00:29:09,022 Then I found another costume that was a spotted fish, and I 593 00:29:09,022 --> 00:29:11,950 was like, cool, this looks poisonous, so let's pretend 594 00:29:11,950 --> 00:29:13,600 that this is a poisonous fish. 595 00:29:13,600 --> 00:29:18,250 And so I said, OK, well, instead of eating the 596 00:29:18,250 --> 00:29:20,980 poisonous fish and having your score increase, I actually 597 00:29:20,980 --> 00:29:22,210 want it to decrease. 598 00:29:22,210 --> 00:29:27,890 So here we have score decreasing by 1 whenever the 599 00:29:27,890 --> 00:29:29,990 shark eats it. 600 00:29:29,990 --> 00:29:31,650 And then, I really liked the costumes that Scratch 601 00:29:31,650 --> 00:29:34,450 provided, and I looked and then I found the shark's-- 602 00:29:34,450 --> 00:29:36,050 it looked like a sick shark. 603 00:29:36,050 --> 00:29:38,040 And so then I edited it I made it green. 604 00:29:38,040 --> 00:29:41,880 And I was like, cool, it's a sick shark. 605 00:29:41,880 --> 00:29:42,150 All right. 606 00:29:42,150 --> 00:29:49,150 >> So let let's add to our script some kind of way of making the 607 00:29:49,150 --> 00:29:53,660 shark switch into being sick whenever it 608 00:29:53,660 --> 00:29:56,800 eats a poisoned fish. 609 00:29:56,800 --> 00:29:57,380 OK. 610 00:29:57,380 --> 00:30:03,620 So because we copied all of the scripts from our original 611 00:30:03,620 --> 00:30:07,760 fish into the poison fish, it already has this sprite here 612 00:30:07,760 --> 00:30:10,680 that says, when I'm chomped down, am I 613 00:30:10,680 --> 00:30:12,020 actually chomped down? 614 00:30:12,020 --> 00:30:15,660 So we can take advantage of this to communicate to the 615 00:30:15,660 --> 00:30:18,170 shark, oh, well, you just ate a poison fish. 616 00:30:18,170 --> 00:30:18,850 You're sick. 617 00:30:18,850 --> 00:30:23,100 And so this would be what kind of action? 618 00:30:23,100 --> 00:30:25,110 What would be want to do? 619 00:30:25,110 --> 00:30:25,650 Broadcast. 620 00:30:25,650 --> 00:30:26,240 Yeah, exactly. 621 00:30:26,240 --> 00:30:28,930 So let's broadcast. 622 00:30:28,930 --> 00:30:33,650 Let's call it shark sick. 623 00:30:33,650 --> 00:30:34,320 OK. 624 00:30:34,320 --> 00:30:36,930 So now, the shark, obviously, is going to be the one who's 625 00:30:36,930 --> 00:30:38,250 receiving this event. 626 00:30:38,250 --> 00:30:44,150 So let's add when I receive the shark being sick. 627 00:30:44,150 --> 00:30:44,410 OK. 628 00:30:44,410 --> 00:30:46,300 So we know we have this costume-- 629 00:30:46,300 --> 00:30:49,400 the shark is sick. 630 00:30:49,400 --> 00:30:51,900 And then we know from before that we kind of appreciate 631 00:30:51,900 --> 00:30:54,420 when we can pause a little bit before switching back. 632 00:30:54,420 --> 00:30:54,875 Yeah? 633 00:30:54,875 --> 00:30:56,467 >> STUDENT: How do you copy script from 634 00:30:56,467 --> 00:30:57,605 one sprite to another? 635 00:30:57,605 --> 00:30:58,510 ZAMYLA CHAN: Ah. 636 00:30:58,510 --> 00:31:03,610 So in this instance, when I just duplicated the sprite, to 637 00:31:03,610 --> 00:31:07,880 copy one script to another sprite, what I did here was 638 00:31:07,880 --> 00:31:11,630 just say duplicate, and it actually made an entire new 639 00:31:11,630 --> 00:31:14,110 sprite with all of the scripts included. 640 00:31:14,110 --> 00:31:18,100 But say you want to just copy one certain script to another 641 00:31:18,100 --> 00:31:23,740 sprite, then what you would do is actually just drag this, 642 00:31:23,740 --> 00:31:29,990 hover over another script, and now here it duplicated it. 643 00:31:29,990 --> 00:31:32,590 In this instance, it already had it, so we can just delete 644 00:31:32,590 --> 00:31:33,170 that again. 645 00:31:33,170 --> 00:31:37,060 But to copy one script into another, what you do is just 646 00:31:37,060 --> 00:31:40,230 drag it onto the other sprites. 647 00:31:40,230 --> 00:31:40,490 OK. 648 00:31:40,490 --> 00:31:42,390 >> So we're back at the shark being sick. 649 00:31:42,390 --> 00:31:45,650 So it's received shark is sick, and it says, OK, well, 650 00:31:45,650 --> 00:31:49,110 once I'm sick, I'm going to switch to my costume that says 651 00:31:49,110 --> 00:31:54,630 "shark sick," and now, let's just add a wait to 652 00:31:54,630 --> 00:31:56,280 appreciate the green. 653 00:31:56,280 --> 00:31:59,560 And then we're going to be hungry again, so we can just 654 00:31:59,560 --> 00:32:04,140 switch back to the shark being hungry. 655 00:32:04,140 --> 00:32:04,460 All right. 656 00:32:04,460 --> 00:32:06,390 So let's eat this purple fish. 657 00:32:06,390 --> 00:32:07,640 That's fine. 658 00:32:10,700 --> 00:32:11,230 Good question. 659 00:32:11,230 --> 00:32:13,070 What happened to the counter? 660 00:32:13,070 --> 00:32:13,660 OK. 661 00:32:13,660 --> 00:32:23,090 So we have set score to 0 here, but this score-- what 662 00:32:23,090 --> 00:32:28,700 this check mark does is it hides or unhides the variable 663 00:32:28,700 --> 00:32:29,775 from the screen. 664 00:32:29,775 --> 00:32:34,320 But what we can do instead of unchecking or checking it-- 665 00:32:34,320 --> 00:32:37,330 we can actually have this block here says "show or hide 666 00:32:37,330 --> 00:32:40,160 the variable." So let's make sure that every time we start 667 00:32:40,160 --> 00:32:41,945 the game that the variable is shown. 668 00:32:44,840 --> 00:32:45,100 >> OK. 669 00:32:45,100 --> 00:32:46,540 So now the variable is shown. 670 00:32:46,540 --> 00:32:52,160 We eat a poison fish, and we get sick. 671 00:32:52,160 --> 00:32:53,440 Cool. 672 00:32:53,440 --> 00:32:53,680 All right. 673 00:32:53,680 --> 00:32:56,910 So now, it's odd for a game for us to have negative 674 00:32:56,910 --> 00:32:57,420 points, right? 675 00:32:57,420 --> 00:33:01,830 So it keeps on eating these and it's like-- 676 00:33:01,830 --> 00:33:05,190 so how about whenever we get negative, if we've eaten too 677 00:33:05,190 --> 00:33:10,770 many poisonous fish, game over-- shark's too sick. 678 00:33:10,770 --> 00:33:11,110 All right. 679 00:33:11,110 --> 00:33:12,680 So what we'll need to do is we'll need to 680 00:33:12,680 --> 00:33:14,950 broadcast some event-- 681 00:33:14,950 --> 00:33:15,960 game over. 682 00:33:15,960 --> 00:33:17,710 So we could do this several ways, actually. 683 00:33:17,710 --> 00:33:20,810 We could have somewhere in the stage a script that 684 00:33:20,810 --> 00:33:22,920 continuously checks is the score negative? 685 00:33:22,920 --> 00:33:24,030 Is the score negative? 686 00:33:24,030 --> 00:33:26,910 If yes, then we broadcast this event. 687 00:33:26,910 --> 00:33:29,120 >> So that's one way of doing it. 688 00:33:29,120 --> 00:33:31,640 Or we could take advantage of the fact that we know that the 689 00:33:31,640 --> 00:33:36,990 only way that your score could be negative is when you eat a 690 00:33:36,990 --> 00:33:38,360 poisonous fish, right? 691 00:33:38,360 --> 00:33:39,930 Because when you eat another fish, your 692 00:33:39,930 --> 00:33:41,240 score is going to increase. 693 00:33:41,240 --> 00:33:44,440 So there's no use in checking whether it should be 694 00:33:44,440 --> 00:33:46,390 game over or not. 695 00:33:46,390 --> 00:33:50,270 So this is a similar process here. 696 00:33:50,270 --> 00:33:53,230 So we can actually just add to this "when I receive shark 697 00:33:53,230 --> 00:33:54,700 sick." 698 00:33:54,700 --> 00:33:59,575 So say we add this condition. 699 00:34:02,080 --> 00:34:04,820 We want to say, if the score is less than 0. 700 00:34:04,820 --> 00:34:07,480 So we're going to go to Operators, we're going to use 701 00:34:07,480 --> 00:34:09,650 this less than one, we're going to drag our 702 00:34:09,650 --> 00:34:12,800 score here, say 0. 703 00:34:12,800 --> 00:34:16,920 And so, if the score is 0, then we want to broadcast 704 00:34:16,920 --> 00:34:20,790 something called game over. 705 00:34:23,310 --> 00:34:24,560 >> OK. 706 00:34:26,199 --> 00:34:29,650 So say we have game over. 707 00:34:29,650 --> 00:34:33,199 Let's move it here or something. 708 00:34:33,199 --> 00:34:38,739 Well, we want the shark only to go back to being hungry if 709 00:34:38,739 --> 00:34:40,980 the game can still be played. 710 00:34:40,980 --> 00:34:43,909 So instead of using an "if," we'll use 711 00:34:43,909 --> 00:34:45,380 an "if else" construct. 712 00:34:45,380 --> 00:34:48,060 So what this does-- it says, OK, so if this condition is 713 00:34:48,060 --> 00:34:51,630 true, then do this, but if it's false then do this. 714 00:34:51,630 --> 00:34:54,929 So let's add if the score is less than 0, then you 715 00:34:54,929 --> 00:34:57,730 broadcast game over, but if not-- if your 716 00:34:57,730 --> 00:34:59,210 score is still positive-- 717 00:34:59,210 --> 00:35:00,720 then go back to being hungry. 718 00:35:03,530 --> 00:35:03,790 OK. 719 00:35:03,790 --> 00:35:04,290 Cool. 720 00:35:04,290 --> 00:35:09,390 So now that we have this game over event, we'll have to have 721 00:35:09,390 --> 00:35:11,040 some way of responding to it. 722 00:35:11,040 --> 00:35:16,460 >> So let's make a new script that says "when I receive game 723 00:35:16,460 --> 00:35:21,470 over." And what we have here under Control is actually this 724 00:35:21,470 --> 00:35:25,410 stop all button, and so it basically mimics you clicking 725 00:35:25,410 --> 00:35:26,720 the red stop sign here. 726 00:35:26,720 --> 00:35:30,210 So let's have the shark stop. 727 00:35:30,210 --> 00:35:33,020 And so we also want the fish to stop, so let's drag and 728 00:35:33,020 --> 00:35:33,910 copy it in. 729 00:35:33,910 --> 00:35:36,830 We want all the fish to stop. 730 00:35:36,830 --> 00:35:39,530 And then let's have the stage stop as well. 731 00:35:39,530 --> 00:35:39,910 All right. 732 00:35:39,910 --> 00:35:43,730 So swimming around, we eat a fish, and 733 00:35:43,730 --> 00:35:46,580 then the program freezes. 734 00:35:46,580 --> 00:35:49,670 I'm clicking down but I can't actually do anything. 735 00:35:49,670 --> 00:35:56,500 OK, but let's say we don't want to remind the user that 736 00:35:56,500 --> 00:36:00,410 they've got a negative value, for instance, then we can, for 737 00:36:00,410 --> 00:36:02,820 instance, hide the variable from the screen. 738 00:36:02,820 --> 00:36:06,340 So when the stage receives game over, then it will hide 739 00:36:06,340 --> 00:36:07,590 the variable score. 740 00:36:10,714 --> 00:36:12,190 OK. 741 00:36:12,190 --> 00:36:15,025 So let's eat one more fish. 742 00:36:19,900 --> 00:36:23,420 And then the score disappears, and you just have this screen. 743 00:36:23,420 --> 00:36:23,660 >> All right. 744 00:36:23,660 --> 00:36:26,530 So that's a pretty decent game, and if you had more 745 00:36:26,530 --> 00:36:30,010 time, then you could eventually add 746 00:36:30,010 --> 00:36:31,590 more and more scripts. 747 00:36:31,590 --> 00:36:34,630 And so then, I added a few more fish, made them progress 748 00:36:34,630 --> 00:36:38,830 at different speeds, and then whenever the shark eats a 749 00:36:38,830 --> 00:36:42,140 poisonous fish, it actually says, "Blech!" 750 00:36:42,140 --> 00:36:45,010 And then what I did is I added a new background to the 751 00:36:45,010 --> 00:36:47,210 stage-- a game over background. 752 00:36:47,210 --> 00:36:53,610 And so what the stage does during the game over event 753 00:36:53,610 --> 00:36:58,100 handling is it switches to the background of game over 754 00:36:58,100 --> 00:36:58,880 background. 755 00:36:58,880 --> 00:37:03,930 And as well, I hid all of the sprites from the stage so that 756 00:37:03,930 --> 00:37:07,330 only the game over background was shown. 757 00:37:07,330 --> 00:37:10,620 There are a couple of other little additions that I added, 758 00:37:10,620 --> 00:37:14,810 for instance, before when we ended our program, then our 759 00:37:14,810 --> 00:37:18,370 shark, the next time that we started, would start up in 760 00:37:18,370 --> 00:37:19,620 that position as well. 761 00:37:19,620 --> 00:37:23,970 What I added is whenever the green flag is clicked, then 762 00:37:23,970 --> 00:37:26,920 the shark goes back to the origin and then faces towards 763 00:37:26,920 --> 00:37:28,490 the right, so that every time, you have a 764 00:37:28,490 --> 00:37:30,270 shark starting there. 765 00:37:30,270 --> 00:37:32,910 >> So you can experiment in Motion and things like, that 766 00:37:32,910 --> 00:37:37,410 just to add little touches that make your 767 00:37:37,410 --> 00:37:39,820 game a bit more polished. 768 00:37:39,820 --> 00:37:41,190 Does anyone have any questions about HungryShark? 769 00:37:45,610 --> 00:37:46,050 Cool. 770 00:37:46,050 --> 00:37:46,400 All right. 771 00:37:46,400 --> 00:37:49,730 So that's an example of something that you could make 772 00:37:49,730 --> 00:37:53,230 in Scratch using all the tools that we discussed earlier. 773 00:37:53,230 --> 00:37:57,530 So I also included in the walkthrough slides. 774 00:37:57,530 --> 00:37:58,460 You'll see them later. 775 00:37:58,460 --> 00:38:01,770 It's just an overview of the processes that we did-- 776 00:38:01,770 --> 00:38:05,130 progressing from HungryShark0 all the way to our final. 777 00:38:05,130 --> 00:38:08,466 One 778 00:38:08,466 --> 00:38:08,960 Yeah. 779 00:38:08,960 --> 00:38:10,310 But that's about it. 780 00:38:10,310 --> 00:38:11,690 I'll stay behind if you guys want to 781 00:38:11,690 --> 00:38:12,990 ask any more questions. 782 00:38:12,990 --> 00:38:14,060 This was Walkthrough 0. 783 00:38:14,060 --> 00:38:16,250 Thank you all for coming, and I'll see you at Walkthrough 1.