Beginner’s Scratch Challenge13 Easter Egg Painting Fun

This week I decided to make a game that gives the user choices. In order to decorate the egg, we give the user a few choices of colours and stickers to put on the Easter Egg and the user must click on the colour and sticker they like. We had to import sprite images from the internet, draw some of our own sprites from scratch and get sprites from the library. In the beginning after the green flag is clicked, I used the SAY block to give instructions that disappeared after 10 seconds.cda-s5-challenge_13-decorate_an_egg-stage_with_say

We found an EGG, CHICK and BUNNY cartoon image on the internet and saved them to an image file on our desktop. I clicked the Add Sprite From File and found these images on my desktop and added them as new SPRITES. I then cleaned up the background of these sprites and made it transparent.

I drew a Spot SPRITE that I moved over on top of my egg to make it look good and I drew a Stripe SPRITE that roughly fell on top of the egg. You can move, shrink and grow each of these sprites so that they look OK on the egg. Now we have to get the BUTTON SPRITES on the side and the PAINT BALL SPRITES on the bottom. I started with one button that I found in the library and imported it. I changed it’s colour and wrote the word SPOTS on it in it’s costume editor using the T button. Here are what my sprites looked like:cda-s5-challenge_13-decorate_an_egg-sprites

The basic idea is that the BUTTON SPRITES (on the side) and the PAINT SPRITES (on the bottom) send a BROADCAST when CLICKED.Here is the script for the SPOTS BUTTON. That’s all there is. 
cda-s5-challenge_13-decorate_an_egg-SPOTS_button

And the STICKER SPRITES (the chick, bunny, spots and stripes) respond to each BUTTON broadcast by SHOWing or HIDEing. As each sticker called that one SHOWS and the others all HIDE. Here, this is the script for the SPOTS SPRITE. See how there is only one SHOW block under the WHEN I RECEIVE SPOTS sprite. This SPOTS SPRITE will only SHOW when the SPOTS BUTTON is clicked and sends out the broadcast SPOTS. When any other sticker button is pressed, it will hide.cda-s5-challenge_13-decorate_an_egg-dots_script

The CHICK SPRITE will look exactly like this, except that the SHOW block will be under the WHEN I RECEIVE CHICK block! The PAINT BALL SPRITES do the exact same thing. They send out a broadcast, when clicked, that tells what colour the user picked. The SAY block helps let people know what to do.cda-s5-challenge_13-decorate_an_egg-orange_paint_ball

The EGG must now react to the broadcast. We need to add a new the EGG SPRITE costume that matches the colour of the paint ball and rename the costume to orange. After I added the new costume, I put the WHEN I RECEIVE orange, CHANGE COSTUME TO ORANGE. The same happens for each other coloured PAINT BALL SPRITE.cda-s5-challenge_13-decorate_an_egg-egg_scriptAs you add buttons for other decorations on the egg, create or import the decoration and then script them as we have done above for the SPOTS. My final project is on the SCRATCH.MIT.EDU website. Search for projects for the username:cdathenry1516. I will share it so you can play, change the scripts or downlod it to your own computer. Have fun!

Julie

Unity – Tanks Tutorial Part 2

Introduction

This week we looked at getting our tank to move.

Tanks, and all tracked vehicles, have a very particular way of moving. By turning their tracks on both sides in the same direction, they can move forwards or backwards. By turning their tracks in opposite directions, they can turn around. In our game, we don’t model the tracks explicitly, but we do want our tank to behave in this same way.

Input Manager

In our previous two projects, we didn’t concern ourselves too much with how the keys we pressed caused actions to occur in the game. It mostly “just worked”.

In Roll-A-Ball we used the method Input.GetAxis() with axes called “Horizontal” and “Vertical” and these allowed us to control our player object.

The Input Manager allows control axes to be defined. It can be found under the Edit|Project Settings|Input menu. We can add as many control schemes as we need for our game here.

Screen Shot 2016-03-06 at 21.16.37

In the case of Tanks, we need controls for two players so we have Horizontal1, Vertical1 and Fire1 and also then Horizontal2, Vertical2, and Fire2.

When we retrieve the axis values in our code, it will have a value between -1 (full negative) and 1 (full positive). A value of zero indicates no input on this axis. When we’re dealing with keys, the only possible values are (-1, 0, 1) but if we had an alternative controller such as a gamepad, we would have values in-between too.

Calculating How Much to Move

The tank’s vertical axis controls how much to move forwards and backwards. To calculate how much the tank should move in one physics frame and in what direction we use the following code:

 Vector3 movement = transform.forward * m_MovementInputValue * m_Speed * Time.deltaTime;

It’s a vector, so it it has direction as well as magnitude. The direction comes from transform.forward – this vector always points in the tank’s forward direction, regardless of how the tank has been turned, and is always 1 unit long. It’s worth noting that there are companion vectors called right and up.

The m_MovementInputValue part is how much the user is currently pressing the keys in the vertical axis. As already discussed, it will be either -1 (full speed backwards), 0 (no movement) or 1 (full speed forwards).

The m_Speed property is a value we’ve set which sets the tanks maximum forwards/backwards speed. We have it set to 12 (distance units per second).

If we multiply all of these three things above together, we get a vector that points from the tank’s current position to the location the tank will be at in one second, if nothing else changes.

This is good, but it isn’t taking into account how often we’re doing our physics calculations (i.e several times a second). Time.deltaTime is the time since the last physics calculation. It will be some fraction of a second. Multiplying by this, we get a vector that points from the tank’s current position to the location the tank will be at after one physics calculation. That is what we want.

Calculating How Much to Turn

Calculating how much to turn is easier. This is the code:

 float turn = m_TurnInputValue * m_TurnSpeed * Time.deltaTime;

It’s a float describing how many degrees we’re turning.

As before, m_TurnInputValue represents the user input. The value is either -1 (turn anticlockwise), 0 (don’t turn) or 1 (turn clockwise).

The m_TurnSpeed property is a value we’ve set which sets the tanks maximum turning rate. We have it set to 180 (degrees per second).

Finally, for the same reason as before, we multiply by Time.deltaTime to get the number of degrees we’re turning in this physics calculation.

Applying the Movement

The movement was hard to calculate, but it’s easy to apply:

 m_Rigidbody.MovePosition (m_Rigidbody.position + movement);

We just tell the Rigidbody to move to a new position. That new position is simply the old position with the movement vector we calculated added on.

Applying the Turn

The turn was easy to calculate, but applying it is a little more complex. It’s not important to understand why it work the way it does, just know that if you’re applying an additional rotation to something that you can’t just “add it on” as we did with the positioning. Here is the code:

Quaternion turnRotation = Quaternion.Euler (0.0f, turn, 0.0f);
m_Rigidbody.MoveRotation (m_Rigidbody.rotation * turnRotation);

To turn the rotation into something we can use, we need to construct a Quaternion. A Quaternion is a special way of storing a rotation. The Quaternion.Euler() method allows us to create a Quaternion from X,Y,Z axis rotations. Here our turn was about the Y axis and the values for the X and Z rotations are simply zero.

Once we have our Quaternion, you might imagine that we add it to the Rigidbody’s existing rotation, but that wouldn’t work. We actually have to multiply it to get the correct new rotation for our Rigidbody.

Changing the Engine Sound

Another thing we spent a good bit of time on was checking to see if the tank was moving and changing the engine sound between an idle and driving sound.

We used the Mathf.Abs() function to get the absolute value of m_MovementInputValue and m_TurnInputValue. The absolute value of something is the value with the negative sign ignored. We compared these to a very small value to determine if the tank was currently stationary, or not.

Once we determined if the tank was stationary or not, we checked the engine sound that was playing. If it wasn’t the one it should be, we swapped in the correct one, taking time to randomly alter the pitch a little so that the two tanks won’t sound identical.

Project Download

The up-to-date files for the project are here. Please download these and we will all start from this point next week!

Information About Coolest Projects 2016

AboutCoolestProjects.jpg

At the start of the session on Saturday 27 Feb, we had an information session about the CoderDojo Coolest Projects contest.

I think it is well worthwhile to consider entering. There are multiple categories and the event is very impressive and interesting.

Special thanks to Aliadh who spoke very well about her experience at Coolest Projects last year.

The notes are here: AboutCoolestProjects.pdf

ModderDojo 2016: Planning a Large Collaborative Mod

DSC_0132

On Saturday, following on from the general information session about Coolest Projects, we started planning a large collaborative mod in the JavaScript/Scriptcraft ModderDojo stream.

We used my favourite planning and design tool – a big whiteboard and a couple of markers.

As the image above shows, we first identified what kinds of things we are already able to make, and we used these as a startpoint for brainstorming some ideas that could build on our capabilities. Finally, we reviewed some of our brainstormed ideas to identify some common threads and in particular some kinds of capabilities we don’t have – things that we will have to learn how to do in future weeks.

For example, we now know that we need to learn about event-driven programming, creating recipes, creating NPCs, creating new block types, and maybe generating biomes. Alex and I will help you to figure out some of these ideas in future weeks.

Since attendance was low, we did not finish the planning and make a final decision about what the theme of our mod is, since we would like more people’s input. But we have made a great start!

Reminder: on Saturday 5 March, there will be no ModderDojo stream as both Alex and I happen to be travelling.

 

Beginner’s Scratch Challenge 12 – Scrolling backgrounds

This week we are exploring a new concept of moving across a landscape like some of the treasure hunting type games such as Super Mario Brothers(SMB). Mario moves through a landscape of dangers and treasures looking for Princess Peach. He must avoid turtles and capture coins in order to keep going and not lose lives and start all over! Here are the notes in PDF:CDA-S5-Challenge_12-Scrolling backgrounds.cda-s5-challenge-12-scrolling-intro

To understand the concept, you must understand that the STAGE is only 480 pixels wide (x goes from -240 to +240). No one SPRITE can be larger than the STAGE and we won’t be able to see a SPRITE that isn’t on the STAGE (ie. it’s x position is less than -240 or greater than +240). So we have to set up a series of SPRITES that extend past the stage and move them across the stage from left to right and under Mario’s feet to make it look like he is moving over the ground from right to left! Get it? It’s tough, but by the end of next week we will have a cool game!cda-s5-challenge-12-scrolling-stage_size


1. We started by downloading an SMB cartoon character from the internet and saving it as an image file (either .png or .jpg) on our desktop or in our personal folder. We used this file to import a new sprite from FILE from the NEW SPRITE area. We then had to make any white background transparent and shrink Mario down to a reasonable size.

2. Next, we drew our own Ground SPRITE using the PAINT NEW SPRITE button. Important!! The sprite must be the full length of the stage!! See the 1st picture above for an example of what the ground sprite could look like. Mine looked like a brick wall, but yours can look like a stone wall or concrete one or some kind of footpath or road.

3. Now we must code our Ground SPRITE! We need to set it’s inital x position to zero and continuously move it in a direction for as long as we are pushing the right or left arrow buttons. To do this we need a new VARIABLE called XPOS. Go to DATA and create this new VARIABLE. See the image below on the bottom the instructions for setting up the initial position of the first ground SPRITE. After you create and code the first one, we can duplicate Ground SPRITE 1 and create Ground SPRITE 2. Be sure that Ground SPRITE 2 has an xpos set to 480 pixels more than Ground SPRITE 1.  cda-s5-challenge-12-scrolling-ground_sprites_1

4. Lastly, for this week, we need to get the Ground SPRITES to move!!

!!IMPORTANT! !Click the little i button on your Ground  SPRITE and see all the information about the SPRITE. Change the rotational direction of the Ground SPRITE to non-rotational. It is a button that looks like a dot.

We will code the Ground SPRITES to move to the left when we press the left arrow key and to the right when we press the right arrow key on our keyboards.  See below: Be careful to program the left arrow key to Point In Direction 90 and the right arrow key to Point In Direction -90. Notice both the Change xpos By commands have different numbers! (-5 and +5) Get these wrong and the SPRITE will not move in the correct direction. Once you have the 1st ground SPRITE working the way you like, duplicate it and all it’s coding. All you have to change in Ground SPRITE 2 is the xpos. It must be set to XPOS +480. If you duplicate that sprite, you must set it’s xpos to XPOS + 960 and so on and so on…cda-s5-challenge-12-scrolling-ground_sprites_2

My original project is on the Scratch.MIT.edu website. You can log on with your own login name or use our one – CDATHENRY1516 and our password is CDATHENRY and play the game or download it to your computer for next week’s class. Next week will will be coding Mario to jump and to always return to the ground and giving our program a bit of perspective with a mountain in the background. I’ll try adding a coin or two for Mario to jump up and grab! See ye all next week!

Julie

Unity – Tanks Tutorial Part 1

Update: This post has been updated with a link to download the project. See the bottom of the post.

Screen Shot 2016-02-29 at 00.17.14

This week we started work on the Unity Tanks tutorial. This is a single-keyboard, two-player, tank game where users can complete in a number rounds against each other.

We began with downloading the tutorial assets from the Unity Assets Store. This tutorial comes with many lovely assets including 3d models and audio clips.

The assets, as downloaded, contained a “Completed” folder. We deleted this first, as it has a second copy of many of the scripts and assets in the project and had the potential to create confusion.

We created a new scene and deleted the default directional light as we wouldn’t be needing it. Then we added the provide “LevelArt” prefab. This prefab contains the entire playing area and also contains a directional light. We discussed the different types of lighting that we can have in a game: ambient, directional, point, and spotlight. The image below shows the same scene lit in each of these four ways, respectively.

lighting

We then set our camera to be orthographic. We described the difference between orthographic and perspective cameras. With perspective cameras, the space the camera sees in front of it is shaped like a pyramid and things that are further away look smaller (as in real life). With an orthographic camera, the space the camera sees in front of it is box-shaped and things do not get smaller the further away they get. For some game types, the less realistic orthographic camera is a good stylistic choice. We also removed the standard skybox and just changed the background to a solid colour, again a good stylistic choice for this game.

We then started to build our tank. The 3d model was pre-supplied, so we added it to the hierarchy. We then added a rigidbody, a box collider and two audio sources for the playback of sounds. We were able to add constraints on the rigidbody to prevent the tank from ever moving vertically, or from rolling or pitching. Applying these constraints both prevents unwanted movements and makes the physics engine’s job much easier.

Screen Shot 2016-02-29 at 01.02.07

Finally, we added two dust trail particle effects to the tracks of the tank. These were also pre-supplied as assets for the project.

We had just started to look at tank movement and that’s where we’ll pick it up again next week. The project can be downloaded here.

Remember that you should now be starting to plan and work on your own projects for the end of the year. Best of luck and we’re here to help in any way we can!

Beginners Scratch – Guessing Game

This week we decided to give everyone a little breather after the marathon that was last week!! The Guessing Game covers a lot of the same ideas as the Maths Game and reinforces the use of decisions and variables.

For this game we need: 1 sprite (to tell the player what to do and if their guess is correct or not), 2 backdrops and 2 variables (THE NUMBER and GUESS). The SPRITE holds most of our scripting.

FIRST: Scripting in the SPRITE, pick a random number and store it in the variable: THE NUMBER. Tell the player (use SAY block) that you are thinking of a number between 1 and 30….

CDA-S5-Challenge_11-Guessing Game-set random number

SECOND: ASK (yes, use the ASK block!) what the player’s GUESS is and store their guess in the Variable GUESS. !!!!NOTE: when you use the ASK command, the user input (their guess) is always stored in the variable ANSWER, until you reassign it to your own variable GUESS with the SET command in DATA)!!!

CDA-S5-Challenge_11-Guessing Game-ask for guess

THIRD: TEST whether the GUESS is TOO HIGH, TOO LOW or CORRECT using the IF decision block and OPERATORS: >(greater than), <(less than) or =(equal to).Also, TELL the player (use the SAY command) if they are TOO HIGH, TOO LOW or CORRECT.

CDA-S5-Challenge_11-Guessing Game-test guess

FOURTH: LOOP IT!! Use a REPEAT 5 times to give your player 5 chances to get the guess right. Check your work!! Go through each of the possibilities one time to be sure you get the correct response. What if they get it WRONG 5 times?? Tell them what the number was!

CDA-S5-Challenge_11-final script with loop

Use your own imagination to add new sprites that react to a broadcast you could send out after they guess the right answer or wrong answer. Get your backdrop to change after they guess correctly. (Hint: BROADCAST correct before STOP ALL and have the backdrop SWITCH costume when it RECEIVES the BROADCAST)CDA-S5-Challenge_11-Guessing Game-more to do

My copy of this game is up on http://scratch.mit.edu. Search for the cdathenry1516 coder name and check it out! Here is a copy of the notes: CDA-S5-Challenge_11-GuessNumbers.

We are taking a break for the next few weeks for mid-winter break! We will be back on February 27th! Happy Coding!

Julie

 

Unity – Creating Objects at Run-Time

This week, once we made the final finishing touches to Amazing Racer, we took at look at a small project which introduced a number of new concepts, which are very useful when building games:

  • Creating objects at run-time
  • Creating a coroutine
  • Using random values
  • Using array parameters to specify multiple values

To create object at run-time, we saw the Instantiate method. This method is provided with a reference to an existing game object or prefab and it will create a new copy of it in the scene. Optionally, a new position and a new rotation can be specified for the duplicated object. The Unity documentation has more information on Instantiate.

A coroutine is a special kind of method. It is a method that can do some work, relinquish control temporarily to the game engine for a period, and then continue from where it left off. It has the special return type of IEnumerator. By calling yield return it can relinquish control. By calling yield return new WaitForSeconds(n) it can relinquish control for a specific period of time. To start a coroutine, we use the StartCoroutine method. You can read the Unity documentation for more information on coroutines.

We saw how Random.Range(min, max) can be used to give a random value between a maximum and minimum. This randomness can add interest and naturalism to our scene. The Unity manual reference for the Random class is here. You will see that there are many other ways to get random values, apart from the Range method.

Finally, we saw how a parameter can be an array. We used an array to specify multiple game objects which could be created by our source object. In the source our property objectsToSpawn is an array, as indicated by the square brackets [].

SourceControlProperties

In the inspector panel, we can see Objects To Spawn which offers a size that can be set, in this case we’ve entered 3, and as many boxes as the array is large.

SourceControlInspectorPanel

The Coroutine Test project is available here.

Our completed Amazing Racer project is available here.

Finally, I was asked to provide the completed Roll-A-Ball project too. That’s here.

All these projects are compatible with Unity V5.3.2f1.

We look forward to seeing you in two weeks! Remember to work on your game ideas over the break!

 

PiDojo- Making Our Own Robot Functions

Last week we used GPIO Zero’s inbuilt functions to control our robots. These functions allowed us to move or turn our robot using time to control the amount of movement, this week we made our own functions which allow us to control our robot using distance and degrees. A version of the code we used is available here and check out my slides here Robot Functions.

ModderDojo – Updated Scriptcraft Server

5 Feb 2016: I have compiled the latest version of Spigot (Version 1.8.8, 22 Jan 2016), which is a high-performancse server based on CraftBukkit, and added in the latest version of Scriptcraft (Version 3.1.12, 30 Dec 2015).

You can download it here: https://www.dropbox.com/s/9eg5e5j8j1ubr6w/2016-02-Spigot.zip?dl=0

The version of CanaryMod+Scriptcraft that we were running for the past couple of months was very unreliable, so hopefully this will be better!