[MUSIC PLAYING]
BRIAN YU: Welcome back, everyone, to an introduction
to programming with Scratch.
And last time we took a look at Events, things that can happen--
like us pressing the green flag, or clicking a button,
or pressing a key on the keyboard-- and letting
our Scratch project respond to those events.
And how do they respond?
Well, they respond with Functions, those blocks
that we stacked on top of each other to let our sprites or the stage
respond in some way.
And so let's take a closer look today at those Functions--
we've seen already that we can have the cat move, for example,
just by using a block like this--
Move 10 Steps-- such that when I click on this block,
the cat moves by 10 steps.
And we discussed before that these Functions, these blocks,
can accept input.
Input in the form of whatever goes in this oval
here, which is 10 by default-- but we were able to change that.
If we wanted the cat to move more steps or fewer steps,
we were able to change the number here to control how many steps the cat was
ultimately going to move.
That, again, was called an input, and the actual information that goes inside
of that input we might call a value.
A value is just some piece of information-- in this case,
it could be something like a number, like the number
of steps to move-- like the number 10.
But a value could also be words, for example--
you might recall that we were able to make our sprite speak up
if we go into the Look section and choose
a block like Say Hello For 2 Seconds.
Here, the word "Hello" is a value as well-- values are just
pieces of information that our program might be able to use.
And it turns out, in addition to us just being able to type values
into these oval-shaped spaces inside of our Scratch functions,
there are some blocks in Scratch that are themselves values,
and today we're going to be exploring those.
So if you notice here in the Motion section of blocks, most of these blocks
are all a very similar shape.
Some might be longer or shorter, but they're all kind of rectangular,
and they have these indentations so that they can
stack on top of each other visually.
But you'll notice that down here, at the bottom of the Motion section,
we have a few blocks that are a different shape.
This one's called X Position, this one's called Y Position,
this one's called Direction-- they're not rectangular,
they don't stack on top of each other.
And in fact, we wouldn't be able to just drag
this underneath the existing blocks and expect them to snap together.
Scratch is a little bit smart, and it's only
going to allow blocks to connect to each other
if it makes logical sense for those blocks to connect to each other.
Instead, these three blocks are oval shaped--
they're not functions anymore, they're values.
They're pieces of information that represent something about the Scratch
project that we're currently running.
This block is a value that represents what
is the x position of a current sprite-- how far to the left or to the right
is that sprite.
This block represents the y position, how far
up or down that sprite happens to be.
And this block represents the direction-- what direction that sprite
happens to be facing.
And because they're oval-shaped, we can't just
add them above or below the script, but we can put them inside
of these oval-shaped inputs.
Notice the inputs to all of the functions are oval-shaped--
and therefore, because these values are also oval-shaped,
they can snap together that way instead.
We're going to be putting a block inside of the input to another block,
so let's see what that looks like.
I'll go ahead and get rid of the Move 10 Steps-- we'll just keep the Say Hello.
But instead of saying hello for two seconds,
let's have the sprite say it's x position for two seconds--
meaning how far to the left or to the right is the cat right now.
And I'll have this happen when the flag is clicked, so add an Event--
when the flag is clicked, go ahead and say your x position for two seconds,
and now when I click the flag to start the program--
let's see what happens.
The cat says 10--
it's saying its current x position, which we can
see down here it's exposition is 10.
And if we drag the cat far to the right, for example, now click the green flag,
and you'll see it's going to say a bigger number--
175.
And if we drag the cat far to the left, now it's
going to say a smaller number--
negative 161.
And if we want, we can have it say both its x position and its y position.
I'll add another Say block, and instead of saying the x position,
let's go back into Motion, and let's choose y position.
Now it's going to say it's x value for two seconds,
and then it's y value for two seconds.
I'll click the green flag--
it says negative 161, negative 13.
And so these values, these oval-shaped x position and y position blocks,
they're no longer functions-- these are just
values that we can put in any spot inside of our functions
where they have an oval-shaped input.
Where we could add something into that oval to describe how what
we want the cat, in this case, to say.
And right now, it's saying the x position for two seconds
and then it's y value for two seconds, which is fine,
but maybe I'd like the cat to say them together.
To say, like, here's where I am right now.
And to do that, I need some way of combining these values--
I need to combine the x location and the y location of this cat.
And here's where we're going to introduce
another new concept within Scratch, and within programming more generally--
and those are Operators.
An Operator is going to accept values as its own input,
and the Operator is going to produce a new value for us.
And so one Operator, for example, this very first one is +.
It will take two values, maybe like 1 and 2 and we add them together
and it's going to give us 3.
So, what would that look like?
I'll disconnect these for now just so we can try something a little different.
I'll go into Looks, have it say something for 2 seconds,
but instead of saying hello for two seconds, let's have it say 1 plus 2
for two seconds.
Now I press the green flag to start the program and the cat says 3--
this operator, this green block here, is performing the task of addition.
It accepts two inputs, two values of its own as inputs, the 1 and the 2--
and then this entire oval block is going to calculate what is 1 plus 2,
it's going to be 3.
And because that's inside of the Say block,
now the cat is going to say the number 3 for two seconds.
And so we have blocks to perform math like addition, subtraction,
multiplication, and division.
We have other blocks, as well, and the one I'm interested in right
now is this one down here called Join.
Right now, it says Join Apple and Banana--
you could use this for any characters we might want to join together.
And what it's going to do is it's going to take two different values,
and it's just going to combine them together into one.
And so I would like to combine together the x location of the cat in addition
to the y location of the cat--
and so let's use the Join operator to do just that.
I'll get rid of this block that was just doing some math
and instead take this Join block, and I want to join together
the X Position and the Y Position.
Notice that these ovals snap into place because the two inputs in the join
block are also oval-shaped--
now I don't need two Says, I only need one.
And let's take this Join block and put it inside of the Say block--
and notice the Say block too will grow in order to make room
for the block that's inside of it now.
And now I have a block inside of a block inside of another block--
the same block has this Join block in it,
and inside the Join block are the x and y values as well.
And so now when I press the green flag, notice what happens--
it says negative 161 negative 13, and it was all kind of mashed together,
and I might not even know exactly where that coordinate is.
So if I wanted to, I could change the backdrop-- let's give myself a grid,
I think there's a grid backdrop if I do a search for grid.
Yeah, here's an xy grid--
so I can see on an xy grid kind of where the cat is on this plane.
I'll press it again--
minus 161 minus 13.
That's fine, but maybe if you've used math
before, you're more used to x comma y, you see one value comma
another value instead of them just being right next to each other
without even a space in between them.
So how could we do that?
How could we add a comma just to separate the x value from the y value
a little bit more?
Well, I can use another Join--
this is going to look a little bit complicated,
but here's what I'm going to do.
Instead of joining together the X Position and the Y Position,
let me first take a comma and a space, and join that with the Y Position.
And then put that Join inside of the input to the other Join--
so this is starting to get a little bit more complicated,
but let's try and break down exactly what's happening here.
I've got a lot of blocks nested inside of other blocks,
but here I'm saying something-- what am I saying?
Well, I'm joining together these two things--
I'm joining the x value of the cat and this block here.
And what is this block?
Well, that block is joining together a comma and the y value
of wherever the cat happens to be.
So taken all together, what does this big oval now do?
Well, it's going to take the X Position, and then take a comma, and then
the Y Position, and that all together is going to be
what goes inside of the Say block.
So we're starting to nest a lot of blocks inside of each other,
but the net result is that, if I take the cat
and move it to near the middle of the stage, for example--
press the green flag--
it's going to say 4 comma 3, that's where in the world it happens to be.
If I move its location somewhere else and press the flag again,
it's going to give me some different numbers.
But now it's saying it all at once, one value comma another value.
And if I wanted to make this a complete sentence,
I can even add one more Join n-- let me say, I am at--
and then take this whole big Join block that Says position, and put that
on the other side of the Join, and now have the cat say all of this.
"I am at x comma y," and so now if I drag it down here, it says,
"I am at negative 30 comma negative 96. " If I drag it here, the cat says,
"I am at 49 comma 61," and so using these values and operators we can start
to combine values together and start to make some more interesting projects
as well.
And we did this just now with the X Position and the Y Position,
but there's also this Direction block that we could do this with too.
If we wanted the cat to, not only say where it is,
but also what direction it's facing, you could imagine using that Direction
block-- so the cat could say, "I am pointing at 90 degree angle,"
or "I'm pointing at a 45 degree angle" for example--
and we could have it use that value inside of its blocks as well.
So let's try something a little different now,
we've taken a look at these motion values--
let's look at what other values we might have.
I'll keep scrolling down inside of Scratch's interface,
and under the Look section we have a whole bunch of other functions
that we've used before-- we've used the Say block,
we've used the Switch Costume, and Switch Backdrop blocks,
we've used Change Size.
Notice down below though--
we also have a couple of blocks that are not the shape of the normal Functions,
they're instead oval-shaped meaning they are values.
We have one for the Costume number, we have one for the Backdrop number,
and we have one just called Size--
and Size in this case is going to represent how big or small
our sprite is.
Remember that our sprites start out at 100% size,
but we have already seen how we can make them smaller
or we can make them bigger.
So, when might we want to use something like the Size block
to know how big or small a particular sprite is?
Well, let's take an example--
let's imagine we're not using the cat anymore,
I'll go ahead and delete the cat, and I'll change the backdrop back
to our plain white backdrop.
Let's pick out a new sprite, go into Animals, and let's grab the hedgehog.
And if I wanted the hedgehog to move, I want
the hedgehog to move every time I press the right arrow, for example--
we saw last time how we could do that.
I add an Event saying, not when the Space key is pressed,
but when the Right arrow is pressed.
Now I want the hedgehog to move 10 steps, so drag it over to the left,
I press the right arrow, and it's moving.
And that seems like a reasonable pace for a hedgehog of about that size,
but if I made the hedgehog much smaller and sprite 50%.
And now have it move--
notice that it's moving-- because it's smaller,
it's still moving 10 steps every time.
It's moving maybe a little bit fast for how big it is--
I might like to change this so that my program's
a little bit more responsive to how big or small a sprite happens to be.
If a sprite is bigger, then it's probably taking bigger steps,
so I want it to move more every time.
And if a sprite a smaller, well, then it's
probably taking smaller steps, so I want it to move less every time.
And so instead of moving 10 steps--
I'll change the size back to 100, but instead of moving 10 steps,
let's have it move Size steps.
Size is a value representing how big or small the hedgehog is,
and I'll drag it inside this oval shape input-- it snaps right into place
because it is oval-sized.
And now, instead of moving 10 steps every time,
it's going to move a number of steps dependent upon the size
of the hedgehog.
And so because this hedgehog is 100% size, now when I press the Right arrow,
it's moving 100 steps every time.
That's probably too fast, I want to cut down on this a little bit--
and here is where we can start to do maybe a little bit of math.
Let's go into Operators and let's use Division--
Division I can use to cut down on the size of something
make the numbers smaller.
Let's do Size divided by 10, you could play around with this
and decide what you want it to be.
And so, now what's going to happen?
Let's try and analyze the math of this a little bit--
if the size of the hedgehog is 100, meaning it's full size to begin with,
then every time I press the Right arrow key--
we're going to move Size divided by 10 steps.
The size is 100 divided by 10 is just 10,
and so the hedgehog is going to move 10 steps.
What if the hedgehog were smaller?
What if the size was 50?
Well, then the hedgehog is going to move 50 divided by 10 steps,
meaning it's only going to move five steps--
smaller steps for a smaller hedgehog.
What if the hedgehog were bigger?
What if it was size of 200?
Well, then it's going to move at 200 divided by 10 steps--
in other words, it's going to move 20 steps every time
we hit the Right arrow.
It's moving more steps because it's a bigger animal.
And so now when I press Right arrow, it's moving 10 steps every time.
If I change the size of the hedgehog and make it a little bit smaller, size 15,
now it's moving only five steps every time I press the Right arrow.
And if I make it bigger, make it size 200,
now it's going to be moving 20 steps every time I press the arrow as well.
And so we can start to use these values to get information about our sprite--
where it is in the world, how big or small
it is, and use that to affect the way that our program behaves.
By using, not just values that we type in,
but by using values that are given to us as part of Scratch to make it work too.
And so, I'll go ahead and change the size back to 100.
I'll go ahead and center the hedgehog again so it's back in the middle,
and let's try something else fun in these Operators.
One thing I'm noticing in these Operators
is that we can do math-- we've seen like addition, and division,
and there's also subtraction, and multiplication.
We've seen how we can join two words together
with this Join Apple and Banana block.
There's another block that looks interesting--
Pick Random 1 To 10.
Pick Random 1 To 10 is a type of block that's
going to let us add a little bit of randomness into our project.
Right now, most of our projects are just doing the same thing every time--
unless we use the Random Position movement,
which we used a couple of times.
But Pick Random will just pick a random number for us
so that we can let the project do something
different each time we run the project.
And so just for fun I might say, when the flag is clicked--
let's go ahead and go to Motion--
and have the hedgehog point in a particular direction.
And instead of always pointing in direction 90,
let's have the hedgehog pick a random number between 0 and 90.
And we've put that value inside of this Point In Direction block--
and so, now every time I press the green flag, what's going to happen?
We're going to pick a random number between 0 and 90,
and the hedgehog is then going to point in that direction.
So I can try it--
I'll press the green flag, and the hedgehog tilts slightly.
I'll press it again, now it's facing a totally different direction--
I'll press it again, now it's facing a different direction.
And every time I press the flag, it's going
to calculate a random number between 0 and 90,
and the hedgehog is then going to point in that direction.
And so randomness can add a little bit of fun to your projects
as well so that there's something surprising
every time you run the project-- where it's not always going
to be the same thing every single time.
All right, so we've seen some values that we can use inside of Motion,
and inside of Looks, and we've seen some Operators
we can use to do some math to join things together,
to pick some random numbers.
If we keep looking around for other values--
I'll go ahead and scroll, and I'm looking
for anything that might be shaped like an oval,
potentially, that I might want to use.
One thing that catches my attention is this value here--
it's called Timer.
And you might recall from last time that we have used the Timer already--
every Scratch project has a built-in timer that's
counting how many seconds have passed since we started running the project.
And we used that before to control the timing of our different sprites
that existed in this project as well.
But we can also use this if we just want to know how long it's
been since we started the project.
I'll go ahead and get rid of these blocks here,
let's use the Timer value for something, let's say-- let's go to Events--
when the sprite is clicked, when I click on the hedgehog-- let's go ahead
and have the hedgehog say whatever the value of the Timer is.
I'll go ahead and change the hedgehog's direction back to 90
so it's still facing the right again, and now I'll
press the green flag to start the project-- the project's now started.
And now when I click on the hedgehog, it says,
"it's been 4.45 seconds since we started the project. "
And I'll press it again, "it's been 9.90 seconds since we started the project, "
and honestly now I don't really need to know that number in all that much
detail.
I don't care if it's 9.90 versus 9.91 for example I just want to know has it
been nine seconds or 10 seconds or 11 seconds, for example.
And so what I could do in this case is go back to Operators,
and there's an Operator here called Round.
And Round, If you're familiar with it for math, just takes a number
and rounds it to a whole number.
So if I have 9.9, it's just going to say,
you know what, let's call that 10-- it rounds up to 10 seconds.
So we'll take the Timer, put it inside of the Round Operator,
and we'll take the Round Operator and put it inside of the Say block.
Now we're saying the rounded version of the timer for two seconds.
Now I click on it and it's been 58 seconds now, not 58 point something,
for example.
I wait a few more seconds, now it's been 63 seconds
since the start of the project.
And so these values give you a lot ability
to know something about what's going on inside of the project.
And Scratch just figures out what each of these values
should be-- it knows what the x position and y position
and size is for any given sprite.
It knows how long it's been since we started running the project,
so it knows what the value of the timer should be.
But there are some other values that the user can have a little bit more control
over as well, and that's where our projects can get even more
interactive and even more interesting.
Let's take a look now--
I'll go ahead and get rid of the hedgehog and we'll bring back the cat.
Let's take a look now at the Sensing section of blocks, which
we haven't really looked at just yet.
But notice this block here--
Ask What's Your Name And Wait--
this is an interesting block.
It is a function, it's shaped like all of those other function blocks,
and it seems to be asking the user a question.
It's asking something like, what's your name?
And What's Your Name here, this, if you'll recall,
is the input to the function.
Anything in this oval shape in a function
block-- that's an input to the function.
It's telling this function what question should you ask--
by default, the question is, what's your name?
But the question might be different, we could ask whatever question we want,
but the user is going to type in an answer.
And that answer is going to then be the output of this function,
and we haven't really seen outputs too much just yet.
These outputs, also called return values,
are values that come back after we run a function.
And it turns out this Ask What's Your Name and Wait
block has a return value--
and the return value is this value here, which is called answer.
This block here, answer, is going to be a value that
stores whatever it is the user typed in in response to that question.
So we can ask the user a question, and based on what the user answers,
we can use that answer later on in our program somewhere.
So let's give that a try, let's try that out and see what we can do.
I want to say that, when the green flag is clicked when I first
start this project, let's go to something
and choose the Ask What's Your Name and Wait block.
And when you do that, let's go ahead and just say it back to them.
I'll go to Say, Say Hello for 2 Seconds.
I don't want you to say "hello" for two seconds though--
I want you to say the answer for two seconds.
Whatever it is the user typed in when they were asked that question,
that's going to be this return value called Answer.
And we're now using Answer later in the project
to say the answer for two seconds-- so now when I run this program,
the cat asks the question "what's your name?"
And we haven't moved on in the program yet-- the program is waiting,
and it's waiting for me to answer the question.
It's waiting for me to type in my name, I'll type in Brian, I'll press Return,
and the cat now says my name back to me.
And if I wanted to, I could make it a little bit more friendly--
I can go into Operators and let's use that Join again.
Instead of saying answer, let's have it say Hello comma and then the answer.
So I'm using that Join Operator to combine two values together
and I'm using that inside of the Say block.
Now, when I press the green flag, "what's your name? " I say, Brian,
and the cat says, "hello, Brian," for example.
And so we can ask the user questions and use their answer inside of the program,
and that opens up a lot of interesting doors
for what it is that we can do with our Scratch project.
Remember, before, we'd been using Move to move a certain number of steps,
and we can say move 10 steps, or move 20 steps for example.
Let's ask the user how far we want to move, let's ask, how many steps?
And then instead of moving 10 steps, we'll go into Sensing,
we'll grab the answer--
that return value, and let's Move Answer Steps.
Whatever the user typed in, that's how many steps I want to move.
So I'll drag the cat back to the left hand side, I'll press the flag--
"how many steps? " Or if I type in 10, we move 10 steps.
Let's try it again--
"how many steps? " I'll type in 50, something bigger.
Now we move 50 steps.
Press it again-- "how many steps? " Let's try 200,
and the cat moves 200 steps when I type in that number.
So whatever number I type in, that's the Return value of the Function
that becomes the Answer.
And because I'm using the Answer inside of this Move some number of steps
block, that's going to result in me-- the user--
being able to control as by typing it into my keyboard
how far I actually want the cat to move.
And I can use this for other blocks too--
we've seen before that we have the ability
to set the x value to something, to make it go somewhere,
and we've also seen that we can set the y value to something
to have it go somewhere else.
So I can ask Pick x, and then let's set x to that answer.
Then ask Pick y and set y to the new answer--
so now I press the green flag, Pick x.
Let's pick 50, Pick y--
let's pick negative 100--
and the cat goes to 50 and negative 100.
If I wanted to go back to the center, Pick x or Pick 0, Pick Y or Pick 0,
and the cat goes back to the center.
And so you can ask multiple questions too-- each time
Answer is whatever the answer was to the most recent question.
And using the answers to those questions,
we can start to do some interesting things.
We can have the cat move around to various different places,
and we can even use this in other blocks to control our project as well.
Let's get rid of the cat for now and bring back
another animal we've used before-- we'll bring back the bear.
And the bear has a few costumes you might remember--
if we go into costumes for the bear, we see that there's this one costume
called Bear A-- where the bear looks like this--
and there's another costume called Bear B where the bear looks like that.
I'm going to go ahead and rename these costumes-- it turns out
you can name costumes whatever you want to call them,
but I'm going to call this costume 4.
Just the number 4 because the bear is on four legs--
and I'll give this costume a name too, I'll
give it the name 2 because the bear is on two legs.
Now, why am I doing this?
Well, it's because of what I'm about to show you, which is let's add an event--
when the flag is clicked, I want to ask a question,
and the question I'm going to ask is, "how many legs? "
And now what I'll do is I'll go into Looks and I'll say Switch Costume To.
And notice that Switch Costume To also has an oval-shaped input next to it.
This oval-shaped input is a dropdown where I could choose which costume I
want the bear to use--
but because it's oval-shaped, I can just put my own value inside of that oval
if I want to.
And let's, instead of using the dropdown,
let's just have it go to the answer.
And so now I press the green flag--
the bear asks "how many legs? " Let's say four legs for the bear--
and now the bear's on four legs.
If I want the bear to stand up, I'll press the green flag again,
it says "how many legs? " I press 2, and the bear stands up.
And, again, the reason that's happening is because when it asks how many legs,
I type in something like 2 as my answer.
And so this block runs, we're going to Switch Costume To--
in this case, 2--
and because I named my costumes after those answers--
you'll remember that if I go back to the Costumes tab,
I had given those costumes particular names.
I called one of the costumes 4, for the four leg version,
and one of the costumes 2 for the two leg version.
Well then I can use those blocks to control how many legs the bear is
ultimately going to be standing on.
And that works for costumes, and it works
for other parts of Scratch's interface, like backdrops, for example.
So we could try that out too--
I'll go ahead and get rid of the--
we'll keep the bear for now, but I'll get rid of the question.
Let's add some backdrops, let's add Colorful City.
I like the look of that, the colorful city during the day,
and let's add one more backdrop.
Let's add the Night City, so we have a couple different backdrops
and I'm going to change their names.
This Colorful city, I'm going to call it Day--
and again, just up at the top here, I can change the name of this backdrop.
And for the Night City, I'm going to call it Night.
So I have one backdrop called Day and one backdrop that I've called Night--
and let's go back into the code.
And now for the bear--
when the flag is clicked, I want the bear to ask a question.
"What time? " Like, what time of day is it?
And let's go ahead and switch the backdrop to whatever the answer is.
So the bear is going to ask me what time of day
do I want-- if I say day, that's one possible answer, if I say night, that's
another possible answer.
So we'll try it--
I'll press the flag, "what time? " I'll say night--
I'll press Return, and now it's nighttime.
I'll try it again--
"what time of day? " I'll say day, and now it's daytime.
And so using this ability now to have Return values,
we can create much more interactive and much more exciting
programs by letting the user tell us something
and using that answer in the project.
Letting them type in their name and responding to them by name,
or letting them type in what backdrop or costume they want,
or letting them type in how they want to control--
how sprite moves, or where it's pointing, or in what direction
it's going for example.
And so you give the user a lot more control
over what's happening just by taking advantage of these values.
That's it for an Introduction to Programming with Scratch for today.
Next time, we'll continue this discussion
and to take a look at some other features
that we get in this world of programming with Scratch.