LoginSignup
12
16

More than 5 years have passed since last update.

VIDEをつかって、Unityでの会話シナリオを作る。

Last updated at Posted at 2016-09-26

VIDEとは

VIDE (Versatile Interactive Dialogue Editor) は2016年8月に公開された、会話シナリオをノード形式(いわゆるグラフ)で編集できる無料のUnityアセットです。発言と選択肢の条件分岐しか入力できませんが、その分、シンプルで使いやすいのがありがたいです。

image

VIDEの使い方

ノードグラフを作る。

VIDEを使うには、まず任意のゲームオブジェクトにVIDE_Assignコンポーネントをアタッチします。

image

Open VIDE Editorをクリックすると、VIDE Editorが出てきます。

image

この画面では、Charlieという付属のダイアログが表示されます。新しく作るには、Add New dialogueボタンを押します。名前を入力すると(ここではTestUtage)、ブランクのダイアログが出てきます。

image

ここからは、nodeを入力し、つなげていきます。nodeには二種類あります

  • NPC dialogue node:comment(発言)を一つだけ登録できます。
  • Player dialogue node:commentを複数登録し、選択肢として使うことができます。

クイズ番組でいうなら、NPCが出題者、Playerは解答者、になります。

NodeにはEnd hereというオプションがあり、それがTrueの時は、そこが最後になります。Falseの時にはそれに続くNodeを付けられます。

image

上図の「○」ボタンで線を引いて、他のノードにつなげます。こんな感じでつなげてみました。

image

作業が終わったらセーブします。データは\Assets\VIDE\Resources\DialoguesフォルダにJSON形式で保存されます。

スクリプトからノードグラフを読みだす

VIDEのノードグラフの状態は、VIDE_Dataコンポーネントから取得します。適当なゲームオブジェクトにVIDE_Dataをアタッチして、AssignedにVIDE_Assignコンポーネントを入力してください。

image

次に、ゲーム用のGUIを準備します。ここでは、VIDEのサンプルスクリプトを改造したものを使います。

VideLegacyGUITest

using UnityEngine;

public class VideLegacyGUITest : MonoBehaviour
{

    public VIDE_Data _VIDE_Data;
    public VIDE_Assign _VIDE_Assign;

    void Start()
    {
        _VIDE_Data.BeginDialogue(_VIDE_Assign); // [1] シナリオ開始
    }

    void OnGUI()
    {
        var data = _VIDE_Data.nodeData;

        if (!_VIDE_Data.isLoaded) return;

        if (data.currentIsPlayer) // プレイヤーノードの場合
        {
            for (int i = 0; i < data.playerComments.Length; i++)
            {
                if (GUILayout.Button(data.playerComments[i]))
                {
                    data.selectedOption = i; //[3] 選択肢の情報
                    _VIDE_Data.Next(); //[4] 次のノードへ 
                }
            }
        }
        else {  // NPCノードの場合
            GUILayout.Label(data.npcComment[data.npcCommentIndex]);

            if (GUILayout.Button("次へ"))
            {
                _VIDE_Data.Next(); //[2] 次のノードへ
            }

            if (data.isEnd)
            {
                _VIDE_Data.EndDialogue();
            }
        }
    }
}

実行するとこんな感じです。

image

エディタ上でVIDE_Data, VIDE_Assignシナリオは、VIDE_DataのBeginDialogue(VIDE_Assign)メソッドで開始します(コード内[1])。NPC dialogue nodeの場合は選択肢がないので、「次へ」ボタンを押したらVIDE_DataのNext()メソッドで次のノードに進みます(コード内[2])。Player dialogue nodeの場合は選択肢があるので、押されたボタンに応じてVIDE_Data.nodeData.selectedOptionにインデックスを渡してから(コード内[3])VIDE_DataのNext()メソッドで次のノードに進みます(コード内[4])。

TagとExtra Data

上では触れませんでしたが、NPC dialogue nodeにはTagとExtra dataを入力できます。

image

これらは、VIDE_Data.nodeData、VIDE_Data.nodeData.extraDataからアクセスできます。Tagは、どのNPCの発言かを示すのに、Extra DataはNPCの発話中の行動(アイテムを渡すなど)を指定するのに使えます。もちろん、それ以外の使い方も可能です。

おわりに

発表して一か月も経っていないので、いろいろ細かい改善ポイントはありますが、シンプルで使いやすいアセットだと思います。今後のアップデートに期待したいですね。

12
16
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
12
16