Programming for kids: The Making of a Walking Sprite

in Steem Kids & Parents2 years ago

photostudio_1661979324953.jpg let's create a Sprite that really walks

Coding With Scratch

Creating a walking Sprite

In our jumping game we had scratchy the cat as our main character who simply had to jump. We also had the red crab character which was not named in the game. The crab had to move across the screen towards the cat, and the movement was more of gliding instead of walking.
In today's lesson, we want the sprite to walk. Which means the legs of the character should move.

Two possibilities
To have a moving sprite, we may create a stationary sprite who's legs are simulating motion and then create a backdrop that moves and changes. This will create the sensation that the character is moving relative to the backdrop.
Alternatively, the figure may have leges that simulates motion and actually move while the backdrop remains fixed.
Both method would be very effective depending on what you are trying to accomplish. But in this case, I think we should try the fix backdrop method.

Expectations

  • To better simulate walking, we would have this foot positions that will alternate each other during the walk.
  • We also expect the moving character to get displaced during the process.
  • We will love the character to be controlled so it does not walk aimlessly to infinity.

Lesson Outcome

At the end of this lesson we are expected to create this walking character using Scratch.
This is a sample of what today's learning outcome should be.

Loading our Scratch Environment

We really don't have a pre existing job to build upon so we will be starting all from the scratch.
• load the Scratch application
• Start creating
• Switch orientation to landscape
• Select the desktop view

Let's start with the sprite selection

We want to select a sprite that has enough walking positions we can switch into. Scratch calls this different positions costumes.

• So we will go to the sprite button
• Chose sprite
• We shall be using the Every Walking sprite
photostudio_1662030474295.png

You can now work on the sprite by selecting the costume tab. This reveals that the sprite has 4 variations known as costumes and each costume differs from the other in the position of it's legs and hands as shown below.
photostudio_1662036440959.png
Still under costume, set the size of the sprite to 70.

photostudio_1662043146583.png

We need a fifth sprite, one that will not be moving. To create our standing sprite we will have to long press costume 4 to get a duplicate command.
photostudio_1662056721842.png

Once we have a duplicate of number 4, we can now edit it using the erase tool. Remember to convert to bitmap after erasing.

Scripting life into our Character

We will need a set of code for the displacement of our character and another set of code taking care or the foot switch

Displacement block
We start with the event green flag. This will enable this block of code to get activated once the game starts.

Go over to motion and set y to the position it is currently holding which is - 46. This will help define the starting point of our character

Bring up the set rotation style block and set it to left/right just to make sure the character can't turn upside down.

We now need a forever block housing an if then else blocks from the control category.

photostudio_1662064258378.png

We now need an argument for the if condition. It states that, if the mouse is pressed down which in this case it is the touching of the screen.
Then
The sprite should turn to the direction of the touched screen and move ten steps.

photostudio_1662065094891.png

This alone will make the sprite move on the screen but that in itself is not walking. Our plan is to animate a sprite the simulates the processes involved in walking. And we have not used the costumes we created.

Making the gliding sprite walk.

For this we need a when clicked flag attached to a forever loop. This will make sure any construct inside it will constantly get checked and replayed in a endless loop.

Inside it, we place an if-then-else condition.

photostudio_1662068837483.png

The if statement statesconvays the idea that if the screen is touched, when that happens, the sprite should switch between the costumes.
The time spent on each costume should be 0.1 seconds and the else part of it is saying, but if the screen is not touched, switch to sprite costume number 5 which is the standing sprite we created.

Below are all the blocks which when activated together, it makes this sprite walk about.

photostudio_1662055013481.png

Lesson 1Introduction
AnimationCreating a walking sprite

Evaluation

[1.] Is there any code segment you could have done differently?.
[2.] What is the purpose of the fifth costume in this lesson
[3.] What could be done to make the animation a lot smoother
[4.] Is there a simpler and yet more efficient way of getting this done?

Rules

- To Participate, you must be a verified Steemit user
- Any Parental assistance should be very minimal
- This homework post must be > or = 300.
- Make your Post within steemkids Community.
- Make @steemkidss a 10% beneficiary .
- Your club status should reflect on your tags.
- place your entry links at the comment section.
- Any Exemplary performance will attract a reward.
- Use the Fintech, technology and steemexclusive tag. Remember to add your country.

Source manuelhooks


Cc
@steemkidss
@ngoenyi
@benton3
@patjewell

Written by @manuelhooks for steemkids

fintech steemexclusive nigeria club100 scratch learnwithsteem

Sort:  

It doesn’t have to e perfect to be amazing. 🎓🔬🧲✏😎💚

 2 years ago 

Your encouraging comment is highly appreciated.

I love your creativity Sir. It really a nice game

 2 years ago 

Thank you for expressing your appreciation. Hope you follow along as the game gradually gets developed.

Loading...

Coin Marketplace

STEEM 0.27
TRX 0.13
JST 0.032
BTC 61451.22
ETH 2929.56
USDT 1.00
SBD 3.65