Simple Movement Script In Unity (Javascript)

Movement is a key feature in many video games, without this we would have no way to explore the world that the developers have taken the time and effort to craft for us to enjoy. This tutorial will show you how to create a simple movement script for use in a 3D platformer, this script will show you how to move your character forward and backwards, left and right, make them jump and rotate around to look at the environment . The tutorial will feature the script written in  Javascript and will all be done using Unity. 

To start off with make sure that your player model has a rigidbody attached to it, this will ensure that when your character jumps they will drop back down to the ground and not float up in the air. Make sure that your character is selected in the project and then click on the "Component" option at the top of the screen. From the menu that pops up click on the "physics" option and then select "rigidbody" from the top of the next list that pops up. It will also be a good idea to put a tick in the "x" box next to the Freeze Rotation property to make sure that your character doesn't fall forward when jumping which could in turn cause problems with the script. 

 Now this is set up you can move on to actually writing the code. 

To start off with lets deal with the forward and backwards movements for your character. Right click in your assets folder and create a new Javascript. After that double click on it to open it up. 

At the top of the script there will be a small piece of text and symbols as shown in the example below.

All of the code in this tutorial needs to be kept inside of the brackets that look like this { , } .
The first thing you need to do is set a speed for the movement of your character. Click on the empty space underneath where it says "#pragma strict" at the top of your script and write in the following piece of code:

var Speed : float = 0.3f;

Now this is all set up you can write the first piece of code to actually make your player do something. Click on the empty space in between the two strange shaped brackets and add in this next line of code:

if (Input.GetKey ("w"))
transform.Translate(Vector3.forward * Speed);

your code should now look something like this.

This piece of code will make your player move forward whenever the "w" key is pressed. If the speed is too fast for your liking feel free to change the value of the "Speed" variable that you added at the beginning of the tutorial. Now you have the forward control set up its time to add in the control to make your player move backwards, most of the code for this is the same as the previous code and there are only two pieces of the code that need to be changed. Click on the empty space next to the number 10 in your script and press enter. This creates a little bit of extra space on your script and at the same time makes it easier to read each new piece that you add. Click on the space next to the number 11 on your script and type out the same piece of code again but this time instead of writing "w" inside of the brackets change the w to an s and change the word "forward" to "back". Your script should now look like this:

Drag and drop this script onto your player and then press play to test out your script, press the "w" key on your keyboard to move forward and the "s" key on your keyboard to move backwards.Once you've tested your script re-open it to add the next piece of code. The next thing you need to add is some way to look around with your character. The easiest way to achieve this is to create a control that makes your character rotate when a button is held down. Underneath the Speed variable at the top add a new variable with the name Rotate and give it a value like the previous variable. This variable will control how fast your player rotates around. Make an extra bit of space underneath the previous piece of code and add in the piece of code below: 

if (Input.GetKey ("a"))

transform.Rotate(0,0,Rotate);

You will probably notice that this piece of code is very similar to the previous pieces, there only a few small changes in this new piece of code. The most important one is the fact that the "Translate" has changed to "Rotate", this ensures that your player rotates when the button is held down. Once you've added the previous piece of code to your script your script should now look like this:

Next up you need to add in a piece of code which will make your character rotate in the opposite direction. Again much like the code for the movement controls the next piece is much the same as the previous one with a couple of changes, take the previous piece of code but this time replace the "a" with "d" and instead of writing just Rotate put a - symbol in front of the word Rotate. Now when you hit play and hold down the "d" button your character will rotate clockwise instead of anti-clockwise. 

You're now pretty much done with this script and there is only one more thing to take care of which is your characters jump function. If we just add in a normal "transform.Translate" command the your character will still jump but if the button is pressed again whilst in the air your character will jump again and the jump will be unlimited, to stop this from happening you need to add in a boolean statement. This statement will work with another function in the script to make sure that the player can only jump when they are touching the ground. Scroll back to the top of the script where you added the previous variables and add the variable shown below: 

var JumpBool : boolean = true;

Now that the variable is set up you need to add a new function, this function will decide whether or not the player is touching the ground. Underneath the previous if statement make some space extra space and add in the function shown below:

function OnCollisionStay (collisionInfo : Collision)
{
JumpBool = true;
}

This function will decide whether or not the player is touching the ground when the jump button is pressed and set the boolean value to true. As well as this function you will also need to add another function which will set the boolean value to false when the player is off of the ground which will then disable the jump control and stop the player from being able to jump an unlimited amount of times. Make some extra space underneath the function that you just added and then add in the function below:

function OnCollisionExit (collisionInfo : Collision)
{
JumpBool = false;
}

Now these two pieces of code have been added your code should now look like this:

Now you have these two functions set up you can set up your characters jump control. The code for this control are written in much the same way as the rest of the keyboard controls shown in this tutorial. Start a new line underneath the previous "transform.Rotate" code and then type in this next piece of code: 

if (Input.GetKeyDown("j")

Notice that unlike that previous pieces of code that had the "GetKey" function in them this one doesn't have a second bracket at the end of it, this is because we need to add a little bit of extra code to this before it will work properly. After the bracket press the spacebar and add two "&" symbols in afterwards then hit the spacebar again and add in the piece of code below:

JumpBool == true)

Adding in this extra piece of code will complete this line of code and now means that whenever the "j" key is pressed the code will also check to make sure that the "JumpBool" variable you defined earlier is true. Now to add in the final piece of code, press enter to create a new line after you have added in the previous piece of code and copy the code shown below: 

transform.Translate(Vector3.up * 1);

Now that you've added in this code your player will jump when you press the "j" key as long as the player is touching the ground and the "JumpBool" variable is true. Now you've finished the script it should look like this:

One important thing to note in this tutorial is to make sure that when you export your model from whatever 3D programme you are using is to check the axis of your model and make sure that the "Z" axis is the front of your model and the "Y" axis is the top of your model, this will make the forward, backwards and rotation controls work properly for your character. 

 

Super Simple And Basic Mini-Map Tutorial

These days most games have a mini-map in the bottom corner of the screen which gives the player a rough idea of what is going on in the area around them, this tutorial will show you how to create a very basic mini-map in Unity.

To start off this tutorial you need to add a new camera to the scene. To do this select the "GameObject" option from the top of the screen, scroll down to "create other" and then select camera from the list. 

This will add a new camera to the scene. This camera will work as your mini-map. Now you have the second camera in the scene you need to position it so that it creates the same view as a normal mini-map. Use the three different coloured arrows around the camera to move the camera into position. Position the camera above the player at a distance you are happy with and then rotate the camera along the X axis so that the camera is facing the player. 

These are the arrows you will need to use to position the camera in the scene.

The easiest way to change the rotation of the camera is to highlight the value of the axis that you want to change and then type in your own value. 

The preview on your second camera should now look something like this:

If you already have a camera set up for your player Unity will only render that camera. To make it so that your mini-map camera is rendered you will need to change the depth setting of the camera. Left click on your mini-map camera in the hierarchy panel, doing this should bring up a "Inspector" panel on the right side of the screen. 

Near the bottom of the inspector panel there is an option which says "depth". 

Delete the value shown in this box and replace it with a "1". This now means that Unity will render your mini-map camera instead of the player camera. Now you need to change the size of the mini-map viewport to make it a bit more of a mini-map. Directly above the "Depth" property is a "Viewport Rect" property. To make the mini-map smaller you will need to change the W and H values of the Viewport Rect property. The "W" value will change the width of the mini-map and the "H" value will change the height of the mini-map. Hover your cursor over each of the letters and then click and drag left or right to change the value. To get a better view of what is happening to your mini-map click on the "game" tab at the top of the screen, this will show you what your view will look like during gameplay and will allow you to see the size of your mini-map. 

Once the mini-map is set to a size that your are happy with you can move onto the final few steps for the tutorial. Next up you will need to change the projection of your camera to orthographic. Scroll down the inspector menu located on the right side of the screen until you find the "Projection" property. 

Click on where it says Perspective and select orthographic from the drop down menu that pops up. Now the camera is set up you may want to adjust the size value which has replaced the field of view slider. Changing the size value will have the same effect as changing the field of view slide. Now for the final step. The last thing you need to do is make the mini-map camera a child of your player object. In the hierarchy drag and drop the camera onto your player object, this will make it a child of your player. Having the mini-map camera as a child of the player means that every time the player moves around, the camera will follow them. If your game has any pop-up text elements that you want the player to see at all times make sure you set the "layer" that each of these are on to "UI", once that is set click on the culling mask of the mini-map camera and then click on the "UI" option from the drop down menu. This will make it so that the text elements will only be visible on the main camera and will not obstruct the view on the mini-map. 

Switch the layer that your pop-up text is on using this option and then click on the box shown below to change it so that the mini-map camera won't render that text.

Please keep in mind that this tutorial is only to create an extremely simple mini-map without using any scripts. If you have any trouble with the tutorial be sure to leave a comment or contact me on twitter. 

My 2nd Full Animation

So after a little bit of trouble rendering my animation it's finally completed. Really happy with the final product of this one. 

How To Create A Simple Sketch Effect In Blender

In this tutorial we will look at how we can use Blender's compositor nodes to create a simple sketch/drawing effect. 

To start off we need to set up our scene. For the purpose of this tutorial I've created a simple scene with 3 spheres. 

Once the scene is all set up go to the drop-down menu at the top of the screen and switch it from default mode to compositor. 

Once you click on this option your screen should look something like this:

Next you need to go to the toolbar and click the box next to where it says "use nodes". This should make these two nodes appear. 

If there is an empty box in the render node press "f12" and your scene should appear in the box as long as you have set the camera up correctly in the scene. Now that we've got the basics of the compositor set up we now need to add in the rest of the nodes to create the sketch effect.

First we need to add a filter node to the scene. Click one the "add" button on the toolbar and scroll down to the "filter" option. Another menu should appear with another series of options. Scroll down this new set of options and click on the "filter" option. 

This should add a new node to the scene. Drag and drop this onto the with line which is already connecting the two nodes, the node should click into place and be connected to the others. If this doesn't work click on the yellow dot on the right hand side of the first node and connect it to the yellow dot on the second node. Once this is all set up click on the box which says "soften" and select the "sharpen" option from the menu which should appear. 

Repeat the last step to get another sharpen node. At the bottom of the sharpen node there is a factor value. Leave the value on the first sharpen node as it is and then change the factor value to 0.5 on the second sharpen node. 

Your node setup should now look like this. Next up we nee to add a "greater than" node. Scroll down to the "add node" button and click on the converter option and then click on math. 

When the new node is added click on the add menu on the node and select "greater than" from the menu. After that change the value setting from 0.5 to 0. Now connect the image dot from the 2nd sharpen node to the first value dot on the greater than node. Your setup should now look like this.

Next up we need to add a blur node and set it to "Fast Gaussian". Click on the add node button and and scroll down to the filter option and add a blur node.

Now change the setting of this node to fast gaussian and connect it to the previous node. Now to add the final node to finish up the effect. The last node you need to add is a another mix node. Click on the add button, scroll down to the color option and click on mix. Change the gaussian option to screen and connect it to the composite node which should be on the right hand side of your setup. You may have to change the color in the little white box at the bottom of the screen node to whichever color you want to make your scene should show up in the render box. 

Here is what your final setup should look like. 

You should now have a very simple sketch/drawing effect in your render. If you have any problems following this tutorial please leave a comment and i'll be sure to help you out. Also I'm looking to start making video tutorials for all of these so keep an eye out for those :)

Practicing My Animation To Move On To Better Things

Been messing around lately trying to improve my animation techniques. Heres a new one that I made trying out some camera movement mixed in with object movement.