Create a ZEPETO Character

STEP 1 : Adding the ZEPETO Players component

In the Hierarchy window, select ZEPETO → ZepetoPlayers tab.

An object called ZepetoPlayers will be automatically created as shown below.

ZepetoPlayers is a component that manages character controller modules within the World.

Set values for character control and related functions can be set in the Inspector window.

STEP 2 : To Load Character

Once the CharacterController setting is complete, use the provided script to load a character.

Add a GameObject in the Scene and add the ZEPETOScript as shown below.

You can load ZEPETO characters with controllers directly to the Scene.

Enter the ZEPETO ID in [ZEPETO_ID] to load the character.

The character loaded in this way is called a local player, which refers to a ZEPETO character that can be directly controlled by the user on their own device.

Script for loading a ZEPETO character with a specific ZEPETO ID

import { ZepetoScriptBehaviour } from 'ZEPETO.Script';
import { SpawnInfo, ZepetoPlayers, LocalPlayer } from 'ZEPETO.Character.Controller';

export default class CharacterController extends ZepetoScriptBehaviour {

    Start() {
        ZepetoPlayers.instance.CreatePlayerWithZepetoId("", "[ZEPETO_ID]", new SpawnInfo(), true);
        ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener(() => {
            const player: LocalPlayer = ZepetoPlayers.instance.LocalPlayer;
        });
    }
}

❗️

Caution

• If you use this code, you will only play with the avatar of a specific ZEPETO ID.
• When releasing a world, you need to modify the code based on the ZEPETO ID of the user who accesses the world, rather than the ZEPETO ID entered in the code. Please use the script below.

Script for loading the character of the logged-in ID

import { ZepetoScriptBehaviour } from 'ZEPETO.Script';
import { SpawnInfo, ZepetoPlayers, LocalPlayer, ZepetoCharacter } from 'ZEPETO.Character.Controller';
import { WorldService } from 'ZEPETO.World'; 
 
export default class CharacterController extends ZepetoScriptBehaviour {   
 
    Start() {       
        // Grab the user id specified from logging into zepeto through the editor.
        ZepetoPlayers.instance.CreatePlayerWithUserId(WorldService.userId, new SpawnInfo(), true);            
        ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener(() => {           
            const player: LocalPlayer = ZepetoPlayers.instance.LocalPlayer;       
        });   
    }
}

❗️

Caution

• Please manage the local player creation code to exist only once in the client script.
• If the same player is created multiple times, the CreatePlayerWithUserId() script may be called elsewhere as well.

STEP 3 : Run

Use the [▶︎(play)] button at the center of the screen to check that the CharacterController is working properly.

CharacterController has a common character control Key Mapping for each Input Event corresponding to the device (PC/Mobile). Thus, the loaded character can be controlled in a Scene regardless of the platform.

On a PC, characters and cameras can be operated with a mouse. On a mobile device, characters and cameras can be operated with a virtual pad as shown in the screenshots below.

👍

The following input interfaces are supported for character control:

PC

• Move: Keyboard arrows, WASD
• Jump: Space
• Double Jump : (Left) Shift
• Zoom: Mouse wheel
• Rotate: Screen drag

Mobile

• Move: (Bottom left screen)virtual pad
• Jump: (Bottom right screen)virtual pad button
• Zoom: (Two fingers)screen drag
• Rotate: (One finger)screen drag

STEP 4 : Changing the Starting Position of ZEPETO Characters

By default, ZEPETO characters are created at the position of Vector3(0,0,0) if no other position is specified. The rotation is also created at the angle of Quaternion.Euler(0,0,0).

The character's starting position and rotation are determined by the SpawnInfo() argument in the ZepetoPlayers.instance.CreatePlayerWithUserId(WorldService.userId, new SpawnInfo(), true) function.

Therefore, to create the character at a specific location, you need to set the desired position in the SpawnInfo() before calling the character creation function.

To facilitate this, a 3D Object > Cube has been placed at the (0,0,0) position of the map.

If you want to create the character on top of the Cube, you can change the character's spawn position value as follows:

import { ZepetoScriptBehaviour } from 'ZEPETO.Script';
import { SpawnInfo, ZepetoPlayers, LocalPlayer, ZepetoCharacter } from 'ZEPETO.Character.Controller';
import { WorldService } from 'ZEPETO.World';
import { Quaternion, Vector3 } from 'UnityEngine';

export default class CharacterController extends ZepetoScriptBehaviour {

    Start() {
        // Set Character Spawn Position
        const spawnInfo = new SpawnInfo();
        spawnInfo.position = new Vector3(0,2,0);
        // Set Character Spawn Rotation
        spawnInfo.rotation = Quaternion.Euler(0,0,0);

        // Grab the user id specified from logging into zepeto through the editor.
        ZepetoPlayers.instance.CreatePlayerWithUserId(WorldService.userId, spawnInfo, true);
        ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener(() => {
            const player: LocalPlayer = ZepetoPlayers.instance.LocalPlayer;
        });
    }
}

After making changes to the position and rotation values, you can confirm the character's creation by clicking the [▶︎(play)] button in the center of the screen.

You can also create the character upside down by changing the position and rotation values as follows:

// Set Character Spawn Position
const spawnInfo = new SpawnInfo();
spawnInfo.position = new Vector3(2,1,2);
// Set Character Spawn Rotation
spawnInfo.rotation = Quaternion.Euler(90,0,0);