Skip to main content

Avatar Controller

The next section is going to load a player Avatar and integrate a character controller to move it. This will use the Avatar Starter sample scene for its useful prefabs and scripts.

Import the Avatar Starter Sample Scene

From the top menu, select Window > Package Manager window. Then select Packages: In Project on the top left dropdown and also select the Genies Avatar SDK package on the left side menu.

Click the Samples tab and click the Import button next to the Samples Starter Scene sample.

Avatar Samples

Add the Character Controller Prefab

In the Project window, open the Assets > Samples > Genies Avatar SDK > X.Y.Z > Sample Starter Scene > Avatar Starter > Prefabs folder. Drag the AvatarSpawn prefab into the scene.

Spawn Prefab

info

This character controller prefab has script components that will control the Avatar by moving and jumping using user input.

Enable Touch Controls

In the Hierarchy, select the AvatarSpawn object. In the Inspector, make sure the Enable Touch Controls property is enabled.

Enable Touch

info

This property allows mobile devices to use UI joystick and buttons for input.

Add the Load My Avatar Script

Create a new empty Game Object named LoadMyAvatar. In the Project window, open the Assets > Samples > Genies Avatar SDK > X.Y.Z > Sample Starter Scene > Avatar Starter > Scripts folder. Drag the LoadMyAvatar script into the LoadMyAvatar component list.

Load Avatar

info

This script will load the Avatar once the user is logged in. It will also connect the animations and input systems to the character controller prefab scripts.

Add the Event System Prefab

In the Project window, open the Assets > Samples > Genies Avatar SDK > X.Y.Z > Sample Starter Scene > Common > Prefabs > MobileControls folder. Drag and drop the UI_EventSystem prefab into the scene.

Event System

tip

If there is already an EventSystem game object in the Hierarchy, make sure to delete that one. This is usually added by default when creating a UI Canvas object. This prefab has defined properties to work with the character controller system.

Add the Touch Controls UI

In the Project window, open the Assets > Samples > Genies Avatar SDK > X.Y.Z > Sample Starter Scene > Common > Prefabs > MobileControls folder. Drag and drop the GeniesTouchZones prefab into the scene.

Touch UI

info

This prefab has the UI for the move joystick, run button, and jump button.

Find the Avatar Animator

In the Project window, open the Packages > Genies Avatar SDK > Internal > Avatars > Runtime > Assets > CommonAnimations folder. Inside is the GeniesAvatarAnimator asset needed in the next step.

Avatar Animator

info

This folder contains a default animator and animation assets used by the Avatar Starter sample scene to animate the Avatar as it moves and jumps.

Add the Component Properties

In the Hierarchy window, select the LoadMyAvatar object and open the Inspector window.

Add the following properties to the LoadMyAvatar component:

  • Add the UI_EventSystem object to the Input System UI Input Module property.
  • Add the AvatarSpawn object to the Loaded Controller property.
  • Add the GeniesAvatarAnimator asset to the Optional Controller property.
  • Add the FreeLook Camera object to the Cinemachine Free Look Settings property.
  • Add the FreeLook Camera object to the Input Axis Controller property.

Add Properties

Test the Character Controller

Enter Play mode. After logging in, the Avatar should spawn and be controllable with the touch controls.

Test Game

tip

You may need to calibrate the FreeLook Camera properties for more optimal camera movement.