Workshop BOND UNIVERSITY Bachelor of Interactive Multimedia and Design Beginner Game Dev Character Control Building a character animation controller.

Transcription

1 Workshop BOND UNIVERSITY Bachelor of Interactive Multimedia and Design Beginner Game Dev Character Control Building a character animation controller.

2 FACULTY OF SOCIETY AND DESIGN Building a character animation controller with Unity Penny de Byl Faculty of Society and Design Bond University pdebyl@bond.edu.au

3 Character Controllers In this workshop you will learn how to import a character and a number of animations into Unity and to create a basic program that will allow the character to be controlled with the keyboard. T o begin, download the starter file mixamo.zip. Unzip. Open Unity and create a new 3D Project. Drag and drop the unzipped mixamo folder into the Project window. After importing the mixamo content the Project will look like that in Figure 1. Figure 1. The Mixamo contents in Unity STEP 1 Before you can create a character controller, first you need a character. The model for our character is called Beta. Beta s mesh is stored in the Beta@t-pose file. Drag and drop this file into the Scene as shown in Figure 2. Also add a Directional Light from the main menu GameObject > Light > Directional Light. Figure 2. The Beta model added to the Scene. 1

4 Switch to the Game window tab. If you can t see Beta or Beta is in the distance, this will be a result of the Main Camera s position. To fix this, with the Scene window visible, select Main Camera in the Hierarchy. A Camera Preview window will appear. The Camera Preview window displays the same point of view as seen in the Game window. Position the model in the Scene as you would have it appear in the Game. With the Main Camera selected in the Hierarchy select GameObject > Align With View from the main menu as shown in Figure 3. This will position the camera from the point of view being used in the Scene. Figure 3. Aligning the Camera with the Scene. 2

5 STEP 2 Before we can write code to control the animations of Beta we first need to assign the model with an Animator Controller. To do this, in the Project click on Create > Animator Controller as shown in Figure 4. Figure 4. Creating an Animator Controller The new controller will be called New Animator Controller. To rename it single click on its name in the Project window and when the cursor appears next to it, change it to Beta Animator. STEP 3 Double-click on Beta Animator. An Animator window will open as shown in Figure 5. In this area we define all the possible animation states our character can have and set up the transition links between them. Figure 5. The Animator Window 3

6 STEP 4 To assign the Animator Controller to Beta, select Beta in the Hierarchy and then drag and drop the Beta Animator from the Project onto the Animator Controller property in the Inspector as shown in Figure 6. STEP 5 Figure 6. Attaching the Animator Controller to the character. Double-click on the Beta Animator to bring up the Animator Tab. In this area we will define all the animation states that can be applied to the character. First, drag and drop the idle animation onto the Animator window. The component you need to drag and drop is signified by a icon. Lets start by dragging across the idle animation. It will appear in the Animator as an orange rectangle. Orange means the animation is default for the character (Figure 7). Figure 7. Creating an Animation State 4

7 Press play to see the idle animation play. STEP 6 If you watch carefully the idle animation plays once and then stop. It s a little difficult to see with this particular animation, but it does happen. When you want an animation to loop, as is the case with this one, you need to turn on looping. To do this, select the parent of the animation in the Project. That s the game object one level above the idle that was dragged into the Animator. In this case it is called Beta@idle. Now look in the Inspector and find the Loop Time check box. Tick this and then click the Apply button at the bottom of the same window as shown in Figure 8. Press Play. The idle animation will continue to loop. Figure 8. Setting an Animation to Loop STEP 7 Before we add any more animations to the character, lets create a navigation controller. Orient the Scene such that you are looking at the character as though in a third person game. Select the Main Camera in the Hierarchy and then from the main menu GameObject > Align With View. This will place the camera behind the character as shown in Figure 9. Figure 9. Setting the Camera up to follow the character. 5

8 Next make the camera a child of the character by dragging and dropping it, in the Hierarchy, onto the character. It will move to become a child of Beta@tpose as shown in Figure 10. Figure 10. Camera made a child of character. The camera will now automatically follow the character as it is stuck to it. STEP 8 To move the character around we need to create a script. In the Project window select Create > JavaScript and call it drive. Double-click on this new file to open in the text editor. Add the following code: #pragma strict private var speed: float = 0.2f; function Start () function Update () if(input.getkey("left")) this.transform.rotate(vector3.up, -1); else if(input.getkey("right")) this.transform.rotate(vector3.up, 1); if(input.getkey("up")) this.transform.position += this.transform.forward * speed; else if(input.getkey("down")) this.transform.position -= this.transform.forward * speed; Save the file, but don t close the editor. Switch back to Unity. Drag and drop the script file onto Beta@t-pose in the Hierarchy. It will appear in the Inspector as an attached script as shown in Figure 11. 6

9 Figure 11. Attaching the drive script to the character. At this point, if you play, the drive script will work when you use the arrow keys to move the character around. BUT, as there is no scenery it won t look like the character is moving. To give yourself a point of reference you might like to add some other game objects into the Scene or add a ground plane. Also, turning on the shadows for the light will also provide a sense of movement. STEP 9 When the character is moving you ll want it to display a walking animation. This requires walking to be added as another state in the Animator. Double-click on Beta Animator in the Project to open the Animator window. Drag and Drop the walking animation object into the window. A new rectangle will appear called walking. It will be grey, not orange. Orange is the default animation that will immediately play when the game starts as shown in Figure 12. Figure 12. Creating another animation state. 7

10 If you want to change walking to the default you can right click on it and select Set As Default. But we don t want to do that because the character is going to start from standing still. You will also want walking to loop, so set this animation to loop in the same manner you used for idle. STEP 10 For the character to go from one animation to another you need to create a Transition. Right-click on idle and select Make Transition, then immediately click on walking. A line will connect the two animations (Figure 13). Figure 13. Creating an animation transition. STEP 9 Next (see Figure 14), 1. Create a parameter called iswalking by clicking on the + button near Parameters. 2. Select Bool from the drop down menu. 3. Type iswalking into the textbox that appears. 4. Click on the Transition. It will turn blue. 5. In the Inspector set the condition to iswalking and its value to true. Figure 14. Creating a parameter to trigger the walking animation. What you have just done is create a variable that you can access in code to trigger the walking animation to play. When iswalking is set to true the character will transition from idle to walking. 8

11 We also need the character to transition back to idle when it is not walking. Create another transition. This time from walking to idle. You can use the same parameter but this time set the condition for iswalking to false (Figure 15). Figure 15. Creating a transition from walking to idle. STEP 10 You can now control the value of the iswalking parameter with code. When it is set to true the walking animation will play. When it is set to false the character will go back to idle. Modify the drive script with the new lines (shown in bold). #pragma strict private var speed: float = 0.2f; static var anim: Animator; function Start () anim = gameobject.getcomponent(animator); function Update () if(input.getkey("left")) this.transform.rotate(vector3.up, -1); else if(input.getkey("right")) this.transform.rotate(vector3.up, 1); if(input.getkey("up")) this.transform.position += this.transform.forward * speed; anim.setbool("iswalking",true); else if(input.getkey("down")) this.transform.position -= this.transform.forward * speed; anim.setbool("iswalking",true); else if(input.getkeyup("up") Input.GetKeyUp("down")) anim.setbool("iswalking",false); 9

12 STEP 11 Last we will add a jumping animation when the space bar is pressed. First, add the jump animation to the Animator Window as we ve done before. Make two transitions. One going from idle to jump and one going from jump to idle. Create a new parameter called jump. Set it to be a Trigger this time (instead of a Bool). For the transition going from idle to jump, set the condition to jump. For the transition going from jump to idle, leave the condition as the default. Figure 16. Creating animation transitions for a jump. In this case, the jump animation will be played once when it is triggered by the spacebar. After the jump animation plays we want the character to automatically transition back to the idle state. That is why we didn t give the transition from jump to idle and conditions. STEP 12 Open the drive script and add these new lines (just the parts in bold): function Update () if(input.getkey("space")) anim.settrigger("jump"); else if(input.getkey("left")) this.transform.rotate(vector3.up, -1); 10

13 Save and run. The character will now walk, turn and jump. STEP 13 There s one more animation you can add to your character that is included with the file; samba. See if you can add a trigger to get it working. HINT: If the parameter you create is called dance, then the code you need to trigger it will be: if(input.getkey("space")) anim.settrigger("jump"); else if(input.getkey("d")) anim.settrigger("dance"); else if(input.getkey("left")) 11

14 Like to Learn More? Unity is a free game development engine. It can be downloaded from I ve two books that can help you get started with programming Unity to create your own desktop and mobile games. The books were written for students and are used in over 40 universities internationally as a text. They are aimed at the novice and begin gently leading the reader through numerous simple exercises up to complete games. Read more about them at: Unity also has a comprehensive set of video tutorials for beginners at: Contact Me For more information or help with Unity or associated game creation matters feel free to contact me via or on social media. Penny de Byl pdebyl@bond.edu.au Facebook: More about Bond s Bachelor of Interactive Media and Design 12