DOWNLOAD ASSETS FOR THIS TUTORIAL:
Download Images For This Tutorial
The Finished Unity Project (Only download if you have issues with tutorial)
First download, install, and sign up for Unity3d free: https://store.unity.com/download?ref=personal
Open up Unity, and create a new project
Call the project whatever you like, and put it in a location on your computer where you can easily get to/ can put future Unity projects as well (Mine is c:\working_dir\Unity\TheHinterLandsUnity)
Interface
When the project opens, you will be greeted with the default layout. There are a couple of different sections to be aware of:
* Bottom middle/left is your file structure/ where you’ll put all your images/ scripts/ all your assets.
* Left center is the Hierarchy/ what is in your current level/scene (originally just the camera)
* Above that are the controls for interacting with objects- pan (move the view), move, rotate, scale, transform
* To the right is the scene view- where you will actually move/ interact with your objects
* To the right of that is the game view- what you’ll actually see in game. It’s usually best to drag that tag next to the scene tab so that you only see one at a time + the scene view will be larger/ easier to work with.
* On the far right is the inspector panel (you may have to click on the inspector tab, and the camera in the Hierarchy panel to see the same thing). This panel allows you to edit your game objects, or add more to them (like physics, new scripts, even networking)
* On the top, you have a play button to actually start your game, to play it and to test it.
Navigating the Scene view
(Learn more on the official docs: https://docs.unity3d.com/Manual/SceneViewNavigation.html)
In the scene view, to navigate use the buttons:
* Hold down middle mouse button to pan the view
* Roll the middle mouse button to zoom in /out
* If you click on the ‘2D’ icon on the top, it will switch to the 3d view, and you can use the right mouse button held down to rotate(but make sure you switch back to 2d)
* You can select stuff like normal just clicking on it with the left mouse button (try selecting the camera if you hadn’t)
Saving the scene
We should probably save at this point. Go to file->save scenes->right click and make a new folder names ‘Scenes’, click on it to go in, and name the scene ‘character_setup’.
Adding assets/ images
Attached are the images needed to build the Hinterlands Character (just doing the male version for now). Download it, create a new folder in the bottom panel (right click->create->Folder), name a folder ‘Images’, then create a new folder in that one called ‘guy’. Then drag all the images you downloaded into that folder.
You might notice that I only have images for one side of the body. That’s because humans are symmetrical, and it saves texture memory to re-use whatever you can. So we can just flip the images to use them for the other side of the character.
Now we’ll create a new game object to control the positioning of all our images. Right click on the top left (Hierarchy) panel, and click ‘Create Empty”. This creates a new game object (named “GameObject”) in our scene/ hierarchy panel. If you click on it in the hierarchy panel, you’ll see it just has a ‘Transform’ on it, which is what every basic game object has- which is just the position rotation and scale of the object.
While you have this game object selected, in the Inspector panel (to left), change the x, y and z values all to 0.
Click the ‘GameObject’ text in the hierarchy panel once (wait for 2s) and rename the GameObject to ‘Player’ (you can also do it after clicking the game object, and changing it in the top right panel/ inspector.
Next we’ll put all our images into the scene under our ‘Player’ game object. On the bottom in the Project panel, click on the first image, drag it on the ‘Player’ text on the Hierarchy panel, and repeat for all the images (you can also zoom in/ out on how many images you see in the bottom panel using the slider on the bottom right of the panel, so you can see all images at once if your screen is small).
Once you’ve dragged in all the images, double click on the first on in the hierarchy panel to zoom in on it. You’ll notice in the inspector panel that it has 2 components added on to it- the ‘Transform’ component again (with position, rotation, scale), but also a sprite renderer, which allows the image to be rendered in game.
So now we’ll want to move all the images to their proper position. We’ll start with the head. Make sure you have the move tool selected (second icon on the top left with the 4 arrows, or just hit the ‘w’ key- ‘q’ through ‘t’ represent all those tools). Click on the head in the hierarchy panel, then move the head up by clicking on the green arrow on the head and dragging up until the heads y value position is around 0.35 in the inspector panel (clicking on the yellow arrow makes it so it will only move it up/down, not allow it to move left/right).
Next we’ll move the torso/chest up. Click on the chest, then this time click on the little blue box at the base of the green and red arrows to be able to move the chest under the head (this allows you to move it right and left too).
You might notice the chest/ neck is going in front of the head, so you can’t tell exactly where it should be placed. We’ll have to change this so they have the proper draw sorting order.
Fixing Draw Sorting Order
Let’s put the head over the neck, so it gets drawn first/ on top of the neck. Click on the head, and in the inspector panel, change the ‘order in layer’ to 1 (since the default is 0, this will put it one over the body).
You should see the head being drawn on top of the chest. Now keep moving the chest till it looks right.
Then continue for all the other body parts, with the body parts all on the right side of the body for now (we’ll duplicate them to go on the left side afterwards).
The order I went was: head->chest->upper arm->hand->hips->thigh->calf->foot.
Once you have them all positioned, you’ll want to fix all of their draw orders. The values you’ll want to use:
Upper arm: 3
Lower Arm: 2 (has to be higher than the head)
Hand:3
Hips: -1
Thigh: -2
Calf: -1
Foot:-2
Chest: 0
Head:1
Lets also organize the body parts in the Hierarchy to make it easier to move body parts (so say if we move the upper arm, we’d want the lower arm and the hand to follow it).
So in the hierarchy, drag the head , upper arm and head onto the chest (which should then show them “under”/ indented under the chest, which means they are now children of it).
Then drag the lower arm onto the upper arm, and the hand on the lower arm.
Then drag the thigh on the hips, the calf on the thigh, and the foot on calf.
So the hierarchy should look like the following screenshot:
We did it this way because we can rotate the upper arm, and it will rotate the whole arm. We can rotate the thigh to rotate the whole leg, or rotate the chest to rotate the whole upper body.
Next we’ll want to copy all the right side body parts over to the left.
Right click on the upper arm, and click ‘duplicate’. In the Inspector panel, in the transform area, change the X scale from ‘1’ to ‘-1’ to flip the arm on the X axis (to reverse it for the other side of the body).
Rename everything in the duplicate to be whatever body part it is with ‘_L’ at the end (so ‘arm_upper_L’, ‘arm_lower_L’, ‘hand_L’). Then select the left upper arm again, and move it using the red X direction arrow to the right position on the other side of the body.
Since this arm should be behind the body, we’ll need to re-position the draw order to be behind the chest to make it look right. If you click on the chest, its draw order is 0, so the maximum we’ll want to use is -1. But since there are 3 parts, and they should be layered correctly, we’ll use:
hand_L: -5
arm_lower_L:-6
arm_upper_L:-5
Next we’ll do the legs. Right click on the thigh in the hierarchy and click duplicate again. Rename it and it’s children: ‘thigh_L’, ‘calf_L’, ‘foot_L’. Click on the thigh_L, and in the inspector panel, in the transform component area, set the X scale from ‘1’ to ‘-1’ to flip the thigh again. Use the red X arrow to move the thigh and its children into the right spot.
We’ll have to modify the draw order again to get it looking right. The hip was set to -1, so all the parts will have to be lower than that to be behind the hip (as well as behind the other leg). Set the following for each parts draw order:
Thigh: -4
Calf: -3
Foot:-4
If you’re wondering how I picked those values, it’s that the right side of the body is in front of the left in this perspective- so they have to be layered on top. Some of the joints I made with the intention of layering them on top of each other (that’s why they have gaps in the black outline). Lastly you can move limbs to make sure they look correctly- the right arm should be in front of everything, the right leg should be in front of everything except the right arm. The left arm should be behind everything except the left leg (which should be below everything).
Now we should have our guy completely in and the drawing order + hierarchy all correct for being able to animate our guy!
So lets get to making a walk cycle.
Continue in part 2: Making a walk cycle in Unity using the animator window!