Gamebridge/Trigger Tutorial: Difference between revisions

From Noisebridge
Jump to navigation Jump to search
No edit summary
(No difference)

Revision as of 08:47, 14 November 2015

Learning to make games with Unity is easy with the right tutorials and resources.


  • Coding Jar Tutorials
    • Self-paced tutorials with guided voice and automatically advancing steps.
    • Download them and give them a go.
  • Unity 101 Tutorials
    • Fall triggers
    • Coins
  • Unity/Learn has loads of great tutorials.
    • Scripting

Unity 101: Fall Triggers

This is Unity 101 in 30 minutes and you are about to create your first video game!


  1. Create your first playable game scene
    1. Download, install and open Unity. (Download and install time doesn't count against the 10 minutes!)
    2. Create a new project by clicking File Menu / New Project (You can play with Angry Bots later!)
    3. Choose to import just Character Controller to save time, you can import more later from Assets Menu / Import.
    4. (Or choose everything to give yourself more to play with, but this blows the 10 minute thing!)
    5. In Hierarchy's top left corner click Create and click Cube.
    6. Click the fourth tool in the top right or hit 'R'.
    7. Resize the cube wide and flat ( scale 50,1,50 ) as a ground by dragging the colored boxes on its sides.
    8. Click its name in the top right Inspfector. Name it "ground".
    9. Drag a character controller from the Project view to the Scene view or Hierarchy.
    10. Position it above your ground cube.
  2. Test It!
    1. Click PLAY button top center.
    2. Your game is now running! Walk around with WASD and look around with the mouse.
    3. Click PLAY button again to stop.
    4. Remember: NEVER edit the game while it is playing or you'll lose changes, always stop it first.
    5. Save your Scene which is like your first level of your game and name it "level1".
    6. You can make it awesome in the next steps!
  3. Decorate your scene!
    1. Add point lights to make it look cool and more cubes to jump around on.
    2. Next we'll learn how to add a script to stop yourself from falling infinitely off the edge.

How could we use a script to stop ourselves from falling off the edge?

There are at least 2 logical ways to do it:

  1. Check to see if the height of the player (their transform.position.y value) is less than the height of the lava (a y value below 0 which is where the ground is).
  2. Make an actual cube to represent the lava below the ground and make it a trigger with a script that handles the OnTriggerEnter event when you touch it.

However we decide to detect that the player has fallen, we need to decide what to do about it.

What should happen in the game when you fall off an edge?

There are a few options:

  1. In most games, you start over when you die or get stuck by returning to the start of the whole level.
  2. In other games, you return to the most recent checkpoint that you've reached. (Unless you get stuck on some strange buggy corner of the game the developers forgot to test adequately).
  3. In a few games like Prince of Persia, you can rewind time to go back to before you did that one thing that would have gotten you killed. THere's a Unity plugin called Chronos that lets you rewind time and change time in different regions at the same time.
  4. Create a lava cube to avoid falling infinitely
    1. Select the "ground" cube.
    2. Edit Menu / Duplicate it.
    3. Move the duplicate down.
    4. Rename the duplicate "lava".
    5. Resize it to make it wider (100,1,100 scale) so it will catch you if you fall.
    6. Hit PLAY and try falling off the edge. Notice it catches you but you can walk further and fall off the edge still.
    7. Hit PLAY again to stop it.
    8. Click the "lava" cube to select it.
    9. In the Inspector, look for the Collider component.
    10. Check the "Is Trigger" checkbox.
    11. Hit PLAY and try falling off the edge. Notice it you now fall right through the lava cube without stopping.
    12. Hit PLAY again to stop the game.
  5. Create your first script code to avoid falling infinitely
    1. In the Project pane, click Create / Javascript.
    2. Rename the javascript "Fall". Click it once to make the name changeable.
    3. Drag the Fall script to the "lava" cube in the Scene, the Hierarchy or the bottom of its Inspector to attach it.
    4. Look in the inspector to confirm it is attached to the "lava" cube.
  6. Edit the script to handle an OnTriggerEnter event:
    1. Double-click the "Fall" javascript to edit it.
    2. Wait for MonoDevelop to load up.
    3. Double-click the "Fall" javascript again if it is not already open to edit it.
    4. Select all the "function Update" text and erase everything.
    5. Type just "trigger". We are going to find out how triggers work by searching the API Reference.
    6. Make sure the cursor is on "trigger" or select the whole word.
    7. Click the Help Menu and choose Unity API Reference to look it up.
    8. You can do this faster by pressing Command-' (Mac) or Control-' (Windows).
    9. Look at the results that come up for something that looks related to triggering an event when a collider is touched.
    10. Click Result 2: OnTriggerEnter.
    11. Select and copy the example code.
    12. Switch back to MonoDevelop.
    13. Erase the word trigger.
    14. Paste the example code into Fall.js.
    15. Delete the whole "Destroy" line.
    16. Your code should look like this now:

function OnTriggerEnter( other : Collider ) {

}

  1. Change the Destroy line to reload the current level instead.
    1. Select and delete the GameObject.Destroy line.
    2. Since we want to reload the same level, type "loadlevel" Your code should look like this:

function OnTriggerEnter( other : Collider ) {
loadlevel
}

    1. Click "loadlevel" and click Help Menu / Unity API Reference to look it up.
    2. The first result is the one we want! Click Application.LoadLevel
    3. Copy the example code.
    4. Switch to MonoDevelop.
    5. Paste the example code on a blank line between the "function OnTriggerEnter {" and "}".

Your code should look like this:
function OnTriggerEnter( other : Collider ) {
Application.LoadLevel("Highscore");
}

    1. Change Application.LoadLevel("Highscore"); to "Application.LoadLevel("level1");"

Your code should look like this:
function OnTriggerEnter( other : Collider ) {
Application.LoadLevel("level1");
}

    1. Save your code.
    2. Switch to Unity.
    3. Save your scene and name the scene file "level1".
    4. If you get an error about Build Settings, make sure to add it by going to File/Build Settings/Add Current.
    5. Hit PLAY to test it.
    6. When you jump off the edge and hit the lava, do you get teleported back to the top?
    7. If so, you are now a game developer, congratulations!
  1. Expand your game level
    1. Make 10 cube platforms and position them with gaps so that you have to jump between the cubes.
    2. Arrange the cube gaps at increasing distances and difficulties until the last couple jumps are quite difficult but not impossible for you.
    3. Make sure that you always get teleported back to the start if you fall from anywhere in the level.
  2. Make a portal that teleports between two levels.
    1. Make a vertical wide narrow cube that looks like a door. (2.0, 3.0, 0.5 scale)
    2. Set it to IsTrigger = true (checked).
    3. Duplicate the Fall.js script.
    4. Rename the duplicate script Portal.js.
    5. Attach Portal.js to the door by dragging it onto the object or its name in the Hierarchy list part of the window.
    6. Double click Portal.js.
    7. Add a new line at the top that reads "var levelToLoad : String = "level2";
    8. Replace "level1" with levelToLoad.

Your code should look like this:
var levelToLoad : String = "level2";
function OnTriggerEnter( other : Collider ) {
Application.LoadLevel( levelToLoad );
}

    1. Make level2 so your portal has somewhere to go:
      1. File Menu / New Scene.
      2. Save the scene as "level2".
      3. Repeat steps 1-9 to make yourself a new level with a new or duplicate level1 as a starting template and rename the duplicate "level2"
      4. Make sure the name of the second level matches the name referred to in the portal.js script
      5. Load the first level again
      6. Play the first door
      7. If it takes you to the first level again, congrats!

Code Hero 102: Coins

Once you've made your first level have obstacles to avoid falling forever, it's time to add some objectives for your players to seek out.


  • Create a Coin.js script
  • Create a World.js script
  • Make Coin.js a trigger that sends an AddCoin message to World.js
  • Make World.js increment a coin integer variable and display it OnGUI.

This is Unity 101 in 10 minutes and you are about to create your first video game!


  1. Download, install and open Unity.
  2. Create your first project and your first playable game scene.
    1. Create a new project by clicking File Menu / New Project (You can play with Angry Bots later!)
    2. Click the Character Controller checkbox to import it. (You can import more stuff later from Assets Menu / Import.)
    3. In Hierarchy's top left corner click Create and click Cube. (You can also click Game Object menu/Create Other/Cube.)
    4. Click the fourth tool in the top right or hit 'R'.
    5. Resize the cube wide and flat ( scale 50,1,50 ) as a ground by dragging the colored boxes on its sides.
    6. Click its name in the top right Inspfector. Name it "ground".
    7. Drag a character controller from the Project view to the Scene view or Hierarchy.
    8. Position it above your ground cube.
  3. Test It!
    1. Click PLAY button top center.
    2. Your game is now running! Walk around with WASD and look around with the mouse.
    3. Click PLAY button again to stop.
    4. Remember: NEVER edit the game while it is playing or you'll lose changes, always stop it first.
    5. Save your Scene which is like your first level of your game and name it "level1".
    6. You can make it awesome in the next steps!
  4. Decorate your scene!
    1. Add point lights to make it look cool and more cubes to jump around on.
    2. Next we'll learn how to add a script to stop yourself from falling infinitely off the edge.
  5. Create a lava cube to avoid falling infinitely
    1. Select the "ground" cube.
    2. Edit Menu / Duplicate it.
    3. Move the duplicate down.
    4. Rename the duplicate "lava".
    5. Resize it to make it wider (100,1,100 scale) so it will catch you if you fall.
    6. Hit PLAY and try falling off the edge. Notice it catches you but you can walk further and fall off the edge still.
    7. Hit PLAY again to stop it.
    8. Click the "lava" cube to select it.
    9. In the Inspector, look for the Collider component.
    10. Check the "Is Trigger" checkbox.
    11. Hit PLAY and try falling off the edge. Notice it you now fall right through the lava cube without stopping.
    12. Hit PLAY again to stop the game.
  6. Create your first script code to avoid falling infinitely
    1. In the Project pane, click Create / Javascript.
    2. Rename the javascript "Teleport". Click it once to make the name changeable.
    3. Drag the Teleport script to the "lava" cube in the Scene, the Hierarchy or the bottom of its Inspector to attach it.
    4. Look in the inspector to confirm it is attached to the "lava" cube.
  7. Edit the script to handle an OnTriggerEnter event:
    1. Double-click the "Teleport" javascript to edit it.
    2. Wait for MonoDevelop to load up.
    3. Double-click the "Teleport" javascript again if it is not already open to edit it.
    4. Select all the "function Update" text and erase everything.
    5. Type just "trigger". We are going to find out how triggers work by searching the API Reference.
    6. Make sure the cursor is on "trigger" or select the whole word.
    7. Click the Help Menu and choose Unity API Reference to look it up.
    8. You can do this faster by pressing Command-' (Mac) or Control-' (Windows).
    9. Look at the results that come up for something that looks related to triggering an event when a collider is touched.
    10. Click Result 2: OnTriggerEnter.
    11. Select and copy the example code.
    12. Switch back to MonoDevelop.
    13. Erase the word trigger.
    14. Paste the example code into Teleport.js.
    15. Delete the whole "Destroy" line.
    16. Your code should look like this now: function OnTriggerEnter( other : Collider ) {

}

  1. Change the Destroy line to reload the current level instead.
    1. Select and delete the GameObject.Destroy line.
    2. Since we want to reload the same level, type "loadlevel" Your code should look like this:


function OnTriggerEnter( other : Collider ) {
loadlevel
}

    1. Click "loadlevel" and click Help Menu / Unity API Reference to look it up.
    2. The first result is the one we want! Click Application.LoadLevel
    3. Copy the example code.
    4. Switch to MonoDevelop.
    5. Paste the example code on a blank line between the "function OnTriggerEnter {" and "}".

Your code should look like this:

function OnTriggerEnter( other : Collider ) {
Application.LoadLevel("Highscore");
}

    1. Change Application.LoadLevel("Highscore"); to "Application.LoadLevel("level1");"

Your code should look like this:

function OnTriggerEnter( other : Collider ) {
Application.LoadLevel("level1");
}

    1. Save your code.
    2. Switch to Unity.
    3. Save your scene and name the scene file "level1".
    4. If you get an error about Build Settings, make sure to add it by going to File/Build Settings/Add Current.
    5. Hit PLAY to test it.
    6. When you jump off the edge and hit the lava, do you get teleported back to the top?
    7. If so, you are now a game developer, congratulations!

Here's what your first level should look like:

File:Unity101LavaTriggerScript.jpg


Congratulations! You're ready for the next tutorial:

Part 2: Coin & World Components

More Ways To Make Your First Level Fun

Now that you have a basic platforming game level that you can jump around in and try not to fall off the edge, it is time to make your level exciting and fun.


  1. Make your lava red
    1. In Project panel, click Assets.
    2. Click Create and click Material.
    3. Type the name "LavaMaterial" and hit return.
    4. In the Inspector panel, there's a white box to the right of Main Color. Click it.
    5. In the Color panel that pops up, pick a reddish color and close the Color panel.
    6. In Project panel, drag the LavaMaterial into the Hierarchy panel to drop it on the Lava object.
  2. Expand your game level
    1. Make 10 cube platforms and position them with gaps so that you have to jump between the cubes.
    2. Arrange the cube gaps at increasing distances and difficulties until the last couple jumps are quite difficult but not impossible for you.
    3. Make sure that you always get teleported back to the start if you fall from anywhere in the level.
  3. Make a portal that teleports between two levels.
    1. Make a vertical wide narrow cube that looks like a door. (2.0, 3.0, 0.5 scale)
    2. Set it to IsTrigger = true (checked).
    3. Duplicate the Teleport.js script.
    4. Rename the duplicate script Portal.js.
    5. Attach Portal.js to the door by dragging it onto the object or its name in the Hierarchy list part of the window.
    6. Double click Portal.js.
    7. Add a new line at the top that reads "var levelToLoad : String = "level2";
    8. Replace "level1" with levelToLoad.

Your code should look like this:

var levelToLoad : String = "level2";
function OnTriggerEnter( other : Collider ) {
Application.LoadLevel( levelToLoad );
}

    1. Make level2 so your portal has somewhere to go:
      1. File Menu / New Scene.
      2. File menu / Save the scene as "level2".
      3. Repeat steps 1-9 to make yourself a new level with a new or duplicate "level1" as a starting template and rename the duplicate "level2".
      4. Make sure the name of the second level matches the name referred to in the Portal.js script.
      5. Add each of the levels in your game to the Build Settings list by clicking File Menu / Build Settings... and clicking Add Current after loading each one.
      6. Load the first level again.
      7. Play and walk into the first door.
      8. If it takes you to the first level again, congrats!
      9. Make the door white:
        1. In Project Panel, click Create / Material.
        2. I

The expanded Telport script which can go between levels or reload the same level:


  1. pragma strict

var levelToLoad : String = "";
var reload : boolean = false;
function OnTriggerEnter ( other : Collider ) {
if ( reload )
{
Application.LoadLevel(Application.loadedLevel);
}
if ( levelToLoad != "" )
{
Application.LoadLevel(levelToLoad);
}
}


Once you expand your level with more cubes for walls and jumping plus a portal to the next level, it might look like something like this:


File:PlatformingCubes.png