NPCを作成

zepetoキャラクターからnpcを作成する方法を学びましょう。 各機能に提供されているサンプルスクリプトを適用して、あなたのワールドに選択したnpcを追加します。 zepeto idを使用してnpcを作成します。 npcの外見と着用するアイテムは、入力されたzepeto idと同じになります。 npcを作成する前に、特定の外見を持つzepetoキャラクターを設定することをお勧めします。 npcが作成される場所オブジェクトの設定 シーンにzepetoキャラクター作成コードをデフォルトで実装します。 📘 次のガイドを参照してください。 \[ zepetoキャラクターを作成する docid\ x3hpjvyg3lww0pu1r8k1s ] 階層を作成 > 空のオブジェクトを作成し、npcに名前を変更します。 npcが作成される場所を保存するオブジェクト。 位置と回転を設定します。 npc作成スクリプトの作成 1\) プロジェクトを作成 > 作成 > zepeto > typescript とし、npccreatorに名前を変更します。 2\) 以下のようなサンプルスクリプトを書きます。 import { zepetoscriptbehaviour } from 'zepeto script'; import { spawninfo, zepetocharacter, zepetocharactercreator } from 'zepeto character controller'; export default class npccreator extends zepetoscriptbehaviour { // npcのzepeto id public zepetoid string; // npcキャラクターオブジェクト private npc zepetocharacter; start() { // spawninfoの新しいインスタンスを作成し、オブジェクトのトランスフォームに基づいてその位置と回転を設定します const spawninfo = new spawninfo(); spawninfo position = this transform position; spawninfo rotation = this transform rotation; // zepeto idを使用して新しいキャラクターを作成し、それを npc変数に割り当てるためにzepetocharactercreatorを使用します zepetocharactercreator createbyzepetoid(this zepetoid, spawninfo, (character zepetocharacter) => { this npc = character; }) } } スクリプトの流れは次のとおりです： start() zepetocharactercreator createbyzepetoid()関数を使用してnpcオブジェクトの位置にnpcを作成し、それを npcに保存します。 3\) スクリプトの記述が完了したら、npcオブジェクトにスクリプトを追加します。 4\) インスペクターでzepeto idを割り当てます。 zepeto id npcのzepeto id。 5\) 実行するために再生ボタンを押すと、npcが作成されます。 6\) 同様にnpcの位置オブジェクトを追加し、複数のnpcを簡単に作成するためのnpcスクリプトを追加します。 npcのラベリング プレイヤーと区別するために、名前タグでnpcにラベルを付けることができます。 名前タグキャンバスプレハブを作成する 1\) 階層 > ui > キャンバスを作成し、prefnametagcanvasに名前を変更します。 レンダーモードをワールドスペースに設定します。 2\) prefnametagcanvasの子として階層 > ui > テキストを作成し、nametagtextに名前を変更します。 名前を表すテキスト。 テキストを適切なサイズにするために、コンテンツサイズフィッターコンポーネントを追加します。 3\) 完了したら、プロジェクトウィンドウにドラッグしてプレハブにし、ハイライターにまだ残っているprefnametagcanvasを削除します。 npc名札スクリプトの作成 1\) プロジェクトを作成 > 作成 > zepeto > typescript とし、npccreatorwithnametagに名前を変更します。 2\) 以下のようにサンプルスクリプトを書きます。 import { zepetoscriptbehaviour } from 'zepeto script'; import { knowsockets, spawninfo, zepetocharacter, zepetocharactercreator } from 'zepeto character controller'; import { canvas, camera, vector3, object, gameobject } from 'unityengine'; import { text } from 'unityengine ui'; export default class npccreatorwithnametag extends zepetoscriptbehaviour { // npcのzepeto id public zepetoid string; // 名札に表示される名前 public nametag string; // 名札キャンバスゲームオブジェクトのプレハブ public nametagprefab gameobject; // 名札キャンバスゲームオブジェクトのy軸オフセット値 public nametagyoffset number; // npcキャラクターオブジェクト private npc zepetocharacter; // 名札キャンバスゲームオブジェクト private npcnametagobject gameobject; // 名札キャンバスゲームオブジェクト内のテキスト private npcnametagtext text; // 名札キャンバス private canvas canvas; // ワールドカメラ private cachedworldcamera camera; start() { // spawninfoの新しいインスタンスを作成し、オブジェクトのトランスフォームに基づいて位置と回転を設定 const spawninfo = new spawninfo(); spawninfo position = this transform position; spawninfo rotation = this transform rotation; // zepetocharactercreatorを使用してzepeto idで新しいキャラクターを作成し、 npc変数に割り当て zepetocharactercreator createbyzepetoid(this zepetoid, spawninfo, (character zepetocharacter) => { this npc = character; // 名札を設定 this setnametag(); }) } // 名札を設定 setnametag() { // 名札キャンバスゲームオブジェクトを動的に作成 this npcnametagobject = object instantiate(this nametagprefab) as gameobject; // 名札キャンバスゲームオブジェクトの親をnpcのトランスフォームに設定 this npcnametagobject transform setparent(this npc transform); // npcの頭の上に名札キャンバスゲームオブジェクトの位置を設定 this npcnametagobject transform position = vector3 op addition(this npc getsocket(knowsockets head upper) position, new vector3(0, this nametagyoffset,0)); // 名札内のテキストを設定 this npcnametagtext = this npcnametagobject getcomponentinchildren\<text>(); this npcnametagtext text = this nametag; this canvas = this npcnametagobject getcomponent\<canvas>(); this cachedworldcamera = object findobjectoftype\<camera>(); this canvas worldcamera = this cachedworldcamera; } private update() { if (this canvas != null) { this updatecanvasrotation(); } } // 名札キャンバスの回転をカメラに向けて更新 private updatecanvasrotation() { this canvas transform lookat(this cachedworldcamera transform); this canvas transform rotate(0, 180, 0); } } スクリプトの流れは次のとおりです： 開始する() setnametag() カスタム関数を呼び出します。 setnametag() npcのために動的に名前タグを生成し、生成された名前タグをnpcの頭上に調整します。 名前タグの中のテキストを設定します。 更新する() updatecanvasrotation() カスタム関数を呼び出して、カメラに合わせてキャンバスを回転させます。 3\) スクリプトの記述が完了したら、npcオブジェクトに追加します。 4\) インスペクターで、zepeto id、名前タグ、名前タグプレハブ、および名前タグyオフセットを割り当てます。 名前タグ npcの名前タグに表示される名前。 名前タグプレハブ 名前タグキャンバスのプレハブ。 名前タグyオフセット 名前タグキャンバスオブジェクトのy軸オフセット値を格納する変数。キャラクターの頭上に名前タグを配置する際に、キャラクターと名前タグの間の距離を調整できます。 5\) 再生ボタンを押して実行すると、名前タグを持つnpcが作成されます。 npcの行動を制御する npcの行動を制御できます。 ジャンプ zepetoキャラクターapiを使用してnpcをジャンプさせます。 zepetoキャラクターapiを使用して、より広範な動作を実装できます。 📘 以下のガイドを参照してください。 \[ zepetoキャラクター docid\ lmi7uxuecfhlfsvgcsrlo ] npcジャンプスクリプトの作成 1\) プロジェクト > 作成 > zepeto > typescriptを作成し、npcjumpに名前を変更します。 2\) 以下のようにサンプルスクリプトを書きます。 import { zepetoscriptbehaviour } from 'zepeto script'; import { spawninfo, zepetocharacter, zepetocharactercreator } from 'zepeto character controller'; import { waitforseconds } from 'unityengine'; export default class npcjump extends zepetoscriptbehaviour { // npcのzepeto id public zepetoid string; // npcキャラクターオブジェクト private npc zepetocharacter; start() { // spawninfoの新しいインスタンスを作成し、オブジェクトのトランスフォームに基づいて位置と回転を設定します const spawninfo = new spawninfo(); spawninfo position = this transform position; spawninfo rotation = this transform rotation; // zepetocharactercreatorを使用してzepeto idで新しいキャラクターを作成し、 npc変数に割り当てます zepetocharactercreator createbyzepetoid(this zepetoid, spawninfo, (character zepetocharacter) => { this npc = character; this startcoroutine(this jumpcoroutine()); }); } jumpcoroutine() { // 無限ループで継続的に while (true) { // zepetocharacterのjump()メソッドを呼び出してジャンプさせます this npc jump(); // 5秒待機 yield new waitforseconds(5); } } } スクリプトの流れは次のとおりです： 開始() jumpcoroutine()コルーチンを呼び出します。 jumpcoroutine() npcキャラクターが5秒ごとにジャンプするようにjump()メソッドを呼び出します。 3\) スクリプトの記述が完了したら、スクリプトをnpcオブジェクトに追加します。 4\) 再生ボタンを押すと、npcがジャンプします。 ジェスチャー npcのためにジェスチャーを実装するには、アニメーターコントローラーを使用します。 アニメーターコントローラーを使用すると、より多様な動作を実装できます。 📘 unityアニメーターコントローラー https //docs unity3d com/manual/class animatorcontroller html https //docs unity3d com/manual/class animatorcontroller html アニメーションクリップの準備 以下のガイドを使用して、npcが実行するためのジェスチャーアニメーションクリップを準備します。 📘 以下のガイドを参照してください。 \[ zepetoキャラクターアニメーションを使用するかどうか docid\ fqjpvarypgvo1jx0lko4x ] \[ カスタムアニメーションを適用する方法 docid\ htbui3cjugc8jeiah7uvx ] アニメーターの作成 1\) プロジェクト > 作成 > アニメーターコントローラーを作成し、npcanimatorcontrollerに名前を変更します。 2\) アニメータータブで、状態を作成 > 空の状態。 3\) インスペクターで適切に名前を変更し、アニメーションクリップをモーションに割り当てます。 npcジェスチャースクリプトの作成 1\) プロジェクトを作成 > 作成 > zepeto > typescript として名前を npcgesture に変更します。 2\) 以下のようにサンプルスクリプトを書きます。 import { zepetoscriptbehaviour } from 'zepeto script'; import { spawninfo, zepetocharacter, zepetocharactercreator } from 'zepeto character controller'; import { animator, runtimeanimatorcontroller } from 'unityengine'; export default class npcgesture extends zepetoscriptbehaviour { // npcのzepeto id public zepetoid string; // npcのanimator controller public npcanimator runtimeanimatorcontroller; // npcキャラクターオブジェクト private npc zepetocharacter; start() { // spawninfoの新しいインスタンスを作成し、オブジェクトのトランスフォームに基づいて位置と回転を設定します const spawninfo = new spawninfo(); spawninfo position = this transform position; spawninfo rotation = this transform rotation; // zepetocharactercreatorを使用してzepeto idによって新しいキャラクターを作成し、 npc変数に割り当てます zepetocharactercreator createbyzepetoid(this zepetoid, spawninfo, (character zepetocharacter) => { this npc = character; // npcキャラクターからanimatorコンポーネントを取得し、そのruntimeanimatorcontrollerをnpcanimatorに設定します this npc getcomponentinchildren\<animator>() runtimeanimatorcontroller = this npcanimator; }); } } スクリプトの流れは次のとおりです： start() npcオブジェクトのanimatorコンポーネントを取得し、npcanimator変数で指定されたanimator controllerに設定します。 3\) スクリプトの記述が終わったら、npcが作成されるlocationオブジェクトに追加します。 4\) インスペクターで、zepeto id、npc animatorを割り当てます。 npc animator npcのアニメーションコントローラー。 5\) 再生ボタンを押して実行すると、npcがジェスチャーをするのが見えます。 6\) ジェスチャーやジャンプ以外のアクションを行うnpcを作成するためにこれを適用できます。 npcの上の吹き出し npcの頭の上にキャンバスを作成し、画像やテキストを表示してバブルにすることができます。 吹き出しキャンバスプレハブの作成 1\) 階層 > ui > キャンバスを作成し、名前をprefspeechbubblecanvasに変更します。 レンダーモードをワールドスペースに設定します。 2\) prefspeechbubblecanvasの子として階層 > ui > 画像を作成し、名前をspeechbubbleimageに変更します。 これはスピーチバブルの背景となる画像です。 3\) 階層を作成 > ui > speeachbubbleimageの子としてテキストを作成し、名前をspeeachbubbletextに変更します。 これはスピーチバブルの中のテキストです。 テキストのサイズを適切にするために、content size fitterコンポーネントを追加します。 4\) 完了したら、プロジェクトウィンドウにドラッグしてprefabにし、ハイライトにまだ残っているprefspeechbubblecanvasを削除します。 npcスピーチバブルスクリプトの作成 1\) プロジェクトを作成 > 作成 > zepeto > typescriptを選択し、名前をnpcspeechbubbleに変更します。 2\) 以下のようにサンプルスクリプトを書いてください。 import { zepetoscriptbehaviour } from 'zepeto script'; import { knowsockets, spawninfo, zepetocharacter, zepetocharactercreator } from 'zepeto character controller'; import { canvas, camera, vector3, object, gameobject } from 'unityengine'; import { text } from 'unityengine ui'; export default class npcspeechbubble extends zepetoscriptbehaviour { // npcのzepeto id public zepetoid string; // スピーチバブルに表示されるダイアログ内容 public speechbubbletext string; // スピーチバブルキャンバスゲームオブジェクトのプレハブ public speechbubbleprefab gameobject; // スピーチバブルキャンバスゲームオブジェクトのy軸オフセット値 public speechbubbleyoffset number; // npcキャラクターオブジェクト private npc zepetocharacter; // スピーチバブルキャンバスゲームオブジェクト private speechbubbleobject gameobject; // スピーチバブルキャンバスゲームオブジェクト内のテキスト private speechbubbletext text; // スピーチバブルキャンバス private canvas canvas; // ワールドカメラ private cachedworldcamera camera; start() { // spawninfoの新しいインスタンスを作成し、オブジェクトのトランスフォームに基づいてその位置と回転を設定 const spawninfo = new spawninfo(); spawninfo position = this transform position; spawninfo rotation = this transform rotation; // zepetocharactercreatorを使用してzepeto idによって新しいキャラクターを作成し、 npc変数に割り当て zepetocharactercreator createbyzepetoid(this zepetoid, spawninfo, (character zepetocharacter) => { this npc = character; // スピーチバブルを設定 this setbubble(); }) } // スピーチバブルを設定 setbubble() { // スピーチバブルキャンバスゲームオブジェクトを動的に作成 this speechbubbleobject = object instantiate(this speechbubbleprefab) as gameobject; // スピーチバブルキャンバスゲームオブジェクトの親をnpcのトランスフォームに設定 this speechbubbleobject transform setparent(this npc transform); // npcの頭の上にスピーチバブルキャンバスゲームオブジェクトの位置を設定 this speechbubbleobject transform position = vector3 op addition(this npc getsocket(knowsockets head upper) position, new vector3(0, this speechbubbleyoffset,0)); // スピーチバブル内のテキストを設定 this speechbubbletext = this speechbubbleobject getcomponentinchildren\<text>(); this setbubbletext(this speechbubbletext); this canvas = this speechbubbleobject getcomponent\<canvas>(); this cachedworldcamera = object findobjectoftype\<camera>(); this canvas worldcamera = this cachedworldcamera; } // スピーチバブルキャンバスを開き、テキストを設定 setbubbletext(bubbletext string) { this speechbubbleobject setactive(true); this speechbubbletext text = bubbletext; } private update() { if (this canvas != null) { this updatecanvasrotation(); } } // スピーチバブルキャンバスの回転をカメラに向けて更新 private updatecanvasrotation() { this canvas transform lookat(this cachedworldcamera transform); this canvas transform rotate(0, 180, 0); } } スクリプトの流れは次のとおりです： 開始() setbubble() カスタム関数を呼び出します。 setbubble() スピーチバブルキャンバス (speechbubbleprefab) を作成し、作成したスピーチバブルをnpcの頭の上に配置します。 setbubbletext() カスタム関数を呼び出して、スピーチバブル内のテキストを設定します。 setbubbletext() npcのスピーチバブルキャンバス ( speechbubbleobject) をアクティブにします。 スピーチバブル内にパラメータとして与えられた文字列 (bubbletext) を表示します。 更新() updatecanvasrotation() カスタム関数を呼び出して、キャンバスをカメラに合わせて回転させます。 3\) スクリプトの記述が完了したら、npcが作成される場所のオブジェクトに追加します。 4\) インスペクターで、zepeto id、スピーチバブルテキスト、スピーチバブルプレハブ、スピーチバブルyオフセットを割り当てます。 スピーチバブルテキスト この変数は、npcキャラクターがスピーチバブルで言うダイアログを保存します。私たちの例では、次のダイアログを保存します "こんにちは世界"。 スピーチバブルプレハブ この変数は、スピーチバブルキャンバスゲームオブジェクトのプレハブを保存します。 スピーチバブルyオフセット この変数は、スピーチバブルキャンバスゲームオブジェクトのy軸オフセット値を保存します。これにより、キャラクターの頭上にスピーチバブルを配置する際に、キャラクターとスピーチバブルの間の距離を調整できます。 5\) 再生ボタンを押して実行すると、npcの頭上にスピーチバブルが浮かんでいるのが見えます。 npcとのインタラクション npcと対話することで、たくさんの楽しいコンテンツを実装できます。 このガイドでは、npcに近づくと変化する吹き出しを実装する例を使用します。 コライダーの設定 1\) npcと対話するためにオブジェクトにコライダーコンポーネントを追加し、istriggerを確認します。 2\) プレイヤーがnpcと対話できる範囲にコライダーをリサイズします。 npcインタラクションスクリプトの作成 1\) プロジェクトを作成 > 作成 > zepeto > typescript として名前を npcinteraction に変更します。 2\) 以下のようにサンプルスクリプトを書きます。 import { zepetoscriptbehaviour } from 'zepeto script'; import { knowsockets, spawninfo, zepetocharacter, zepetocharactercreator, zepetoplayers } from 'zepeto character controller'; import { canvas, camera, vector3, object, gameobject, collider } from 'unityengine'; import { text } from 'unityengine ui'; export default class npcinteraction extends zepetoscriptbehaviour { // npcのzepeto id public zepetoid string; // スピーチバブルに表示されるダイアログ内容 public speechbubbletext string; public changedspeechbubbletext string; // スピーチバブルキャンバスゲームオブジェクトのプレハブ public speechbubbleprefab gameobject; // スピーチバブルキャンバスゲームオブジェクトのy軸オフセット値 public speechbubbleyoffset number; // ローカルキャラクターオブジェクト private zepetocharacter zepetocharacter; // npcキャラクターオブジェクト private npc zepetocharacter; // スピーチバブルキャンバスゲームオブジェクト private speechbubbleobject gameobject; // スピーチバブルキャンバスゲームオブジェクト内のテキスト private speechbubbletext text; // スピーチバブルキャンバス private canvas canvas; // ワールドカメラ private cachedworldcamera camera; start() { // spawninfoの新しいインスタンスを作成し、オブジェクトのトランスフォームに基づいて位置と回転を設定 const spawninfo = new spawninfo(); spawninfo position = this transform position; spawninfo rotation = this transform rotation; // zepetocharactercreatorを使用してzepeto idによって新しいキャラクターを作成し、 npc変数に割り当て zepetocharactercreator createbyzepetoid(this zepetoid, spawninfo, (character zepetocharacter) => { this npc = character; // スピーチバブルを設定 this setbubble(); }) zepetoplayers instance onaddedlocalplayer addlistener(() => { this zepetocharacter = zepetoplayers instance localplayer zepetoplayer character; }); } // プレイヤーキャラクターがコライダーに入ったか確認 ontriggerenter(collider collider) { if (this zepetocharacter == null || collider gameobject != this zepetocharacter gameobject) { return; } this setbubbletext(this changedspeechbubbletext); } ontriggerexit(collider collider) { if (this zepetocharacter == null || collider gameobject != this zepetocharacter gameobject) { return; } this setbubbletext(this speechbubbletext); } // スピーチバブルを設定 setbubble() { // スピーチバブルキャンバスゲームオブジェクトを動的に作成 this speechbubbleobject = object instantiate(this speechbubbleprefab) as gameobject; // スピーチバブルキャンバスゲームオブジェクトの親をnpcのトランスフォームに設定 this speechbubbleobject transform setparent(this npc transform); // npcの頭の上にスピーチバブルキャンバスゲームオブジェクトの位置を設定 this speechbubbleobject transform position = vector3 op addition(this npc getsocket(knowsockets head upper) position, new vector3(0, this speechbubbleyoffset,0)); // スピーチバブル内のテキストを設定 this speechbubbletext = this speechbubbleobject getcomponentinchildren\<text>(); this setbubbletext(this speechbubbletext); this canvas = this speechbubbleobject getcomponent\<canvas>(); this cachedworldcamera = object findobjectoftype\<camera>(); this canvas worldcamera = this cachedworldcamera; } // スピーチバブルキャンバスを開き、テキストを設定 setbubbletext(bubbletext string) { this speechbubbleobject setactive(true); this speechbubbletext text = bubbletext; } private update() { if (this canvas != null) { this updatecanvasrotation(); } } // スピーチバブルキャンバスの回転をカメラに向けて更新 private updatecanvasrotation() { this canvas transform lookat(this cachedworldcamera transform); this canvas transform rotate(0, 180, 0); } } スクリプトの流れは次のとおりです： ontriggerenter(), ontriggerexit() トリガーがコライダーエリアに入ると検出されたとき、setbubbletext()カスタム関数を呼び出して、スピーチバブル内のテキストをchangedspeechbubbletextに設定します。 コライダーエリアを離れると、setbubbletext()カスタム関数を呼び出して、スピーチバブル内のテキストをspeechbubbletextに設定します。 3\) スクリプトの記述が完了したら、npcが作成されるlocationオブジェクトに追加します。 4\) インスペクターで、zepeto id、スピーチバブルテキスト、スピーチバブルプレハブ、スピーチバブルyオフセット、および変更されたスピーチバブルを割り当てます。 スピーチバブルテキスト この変数は、npcキャラクターがスピーチバブルで言うダイアログを格納します。私たちの例では、次のダイアログを格納します "こんにちは世界"。 スピーチバブルプレハブ この変数は、スピーチバブルキャンバスgameobjectのプレハブを格納します。 スピーチバブルyオフセット この変数は、スピーチバブルキャンバスgameobjectのy軸オフセット値を格納します。これにより、キャラクターの頭上にスピーチバブルを配置する際に、キャラクターとスピーチバブルの間の距離を調整できます。 変更されたスピーチバブル プレイヤーがnpcのコライダーに入ると、npcのスピーチバブルに表示されるダイアログを格納します。 5\) プレイを押して実行し、プレイヤーがnpcに近づくと、吹き出しのテキストが変わります。 npcインタラクションの適用 ダイアログ形式を作成するには、パネルを使用してuiを作成します。 以下は、パネルとボタンで構成されたシンプルなダイアログの例です。 これは、npcとインタラクションするときにダイアログを開き、各ボタンが押されたときにそれを処理する例のスクリプトです。 これを適用して、面白いコンテンツを実装します。 import { gameobject, humanbodybones, object, collider } from 'unityengine'; import { zepetoscriptbehaviour } from 'zepeto script'; import { button } from 'unityengine ui'; import { zepetocharacter, zepetoplayers } from "zepeto character controller"; export default class npcdialoginteraction extends zepetoscriptbehaviour { public npcdialogcanvas gameobject; public yesbutton button; public nobutton button; private zepetocharacter zepetocharacter; start() { zepetoplayers instance onaddedlocalplayer addlistener(()=>{ this zepetocharacter = zepetoplayers instance localplayer zepetoplayer character; }); // ダイアログ はいを選択 this yesbutton onclick addlistener(() => { console log("はい") this npcdialogcanvas setactive(false); }); // ダイアログ いいえを選択 this nobutton onclick addlistener(() => { console log("いいえ") this npcdialogcanvas setactive(false); }); } // プレイヤーキャラクターがコライダーに入ったか確認 ontriggerenter(collider collider) { if (this zepetocharacter == null || collider gameobject != this zepetocharacter gameobject) { return; } this npcdialogcanvas setactive(true); } ontriggerexit(collider collider) { if (this zepetocharacter == null || collider gameobject != this zepetocharacter gameobject) { return; } this npcdialogcanvas setactive(false); } }