Tech Game Dev Blog — Third Person Controller & Photo Mode

胡琦
Hu Chi
Published in
4 min readJun 19, 2020

Below is my attempt on creating a customised third person controller using animation clips downloaded from Mixamo, a website by Adobe that provides free humanoid animations. Here are the things I implemented:

Additive Scene Loading

In case of needed to switch between multiple scenes, I decided to use multi-scene editing: putting the player in the player scene, and design the levels in level scenes. Here is how it looks in the hierarchy window:

C# Singleton Pattern

Sometimes it is easy to forget to put reference objects and components in the inspector. In the case of multi-scene editing, it is not possible to reference objects from different scenes as well. Often are times that we only need one instance of a specific component, for example, a game manager component that controls the state of the game. This is where singleton pattern designing becomes handy. Declaring a static variable called m_instance, and make the game object running through the entire of the game by calling DontDestroyOnLoad(this), so it will not be destroyed when we switch scenes.

Here are some the two instances I have currently created:

Game Manager — Serve as the main brain of the game.

InputController — All user inputs are wired through this controller, so it is easier to enable or disable certain controls.

Third Person Controller

The third person controller provided in Unity’s Standard Assets works out of the box, however I want to have fully customised control of my character, so I move on to create my own controller. There are mainly two ways I can think of to set up the character:

  1. Use a Rigidbody and a Capsule Collider.
  2. Use a Character Controller

And to move the character, we need two parameters: the forward speed to update the position and the turning speed to update the rotation.

Position: Getting the forward speed

Since we are using root motion, we can move the character by playing a moving animation instead of updating the position by code.

We want to know how fast the player should walk forward, so we calculate the forward vector of user’s input and the facing direction of the character. The magnitude of the dot product of these two vectors is the parameter we are sending to the animator. A dot product between two vector A and B means if we project a vector A on vector B, we can get another vector C that is parallel to vector B (imagine casting a shadow of a pole on the ground, and vector C is the shadow that is laying on the plane). Multiplying the lengths of vector B and C yields the result of vector A and vector B’s dot product.

Rotation: Getting the turn speed (rotate directly)

As for rotating the character, at first I simply update the rotation by code using spherical linear interpolation (or slerp) to let the player face towards the direction the camera is facing.

Rotate directly. It looks kinda fake.

Rotation: Getting the turn speed (rotate with root motion)

Next I calculated the angle difference we need to compensate to the character. With some smooth damping, the animation is now looking pretty good. The reason is because when root motion is applied, the character moves and rotates based on the actual joints that contribute to the change of the transform.

Rotate by root motion. It looks more realistic.

Inverse kinematics (IK) for foot placement

Inverse kinematics is used for procedural animations. Here I used it to create accurate foot placement when the character is not standing on a horizontal surface, i.e. standing on a slope or an uneven surface. We use a ray to hit downwards, and if the ray hits the floor, we try to put the foot to the point that the ray and the floor intersects.

Footsteps with IK. The feet are positioned according to the point they are stepping on.

Photo Mode

Last but not least, I created a photo mode that can be used to capture in game screenshots in realtime. I designed a simple but functional UI to make it easy for the player to use. In order to bring up the photo mode, I also designed a pause menu. This photo mode alone can be a very useful tool that can be used in other projects. On top of that, I had also added icons for gamepads like PS4 DualShock controllers.

Photo mode screenshots. Noted in the top two screenshots, the feet are placing on the slope correctly using inverse kinematics.
Controlling the photo mode.
Pause menu design. Fully controllable with a PS4 controller.

--

--