複数の移動先を設定できるワールドゲート【cluster用アイテム】

投稿者:

「Creators Guide」は、バーチャルSNS「cluster」で「つくる」ことにチャレンジしてみたい方に向けた導入ガイドです。

Creators Guideで読むことができるすべての情報はこちらにまとめています。


今回つくるもの

今回作成するのは、複数の移動先を設定できるワールドゲートです。自作のワールドやお気に入りのワールドを登録して遷移先にしてみましょう!
複雑なギミックですが、仕組みを理解すればさまざまなギミックに転用することができます。サンプルパッケージも配布しているので、ぜひ一度触ってみてください!

▼ 実際に制作する様子を動画でも公開しています

サンプルパッケージ

本記事ではサンプルパッケージを用意しています。こちらに同梱したアセットを使用した解説を行います。

またパッケージ内には実際にこの記事で作成する「複数の移動先を設定できるワールドゲート」を配布しています。記事を見ながら、アイテムの構成を確認してみてください。

[ダウンロードリンク]

目次

事前準備

まず、clusterにワールドをアップロードできる環境を用意してください。
Creators Guide のこちらの記事を参考に準備をお願いします。

ワールドゲートの本体となるスイッチのオブジェクトを用意する

まずはギミックを実装する本体となるオブジェクトを用意します。

  • サンプルパッケージのUnity package ファイルをProjectにドラッグ&ドロップするか、
  • ダブルクリックし、導入してください。

導入が完了したら、

  • Hierarchy を右クリックし、 Create Empty で空のゲームオブジェクトを作成します。
    • 名前は “WorldPortalRoot” に変更します。

この階層下に3Dモデルを追加していきます。

  • 作成した GameObject を選択し、Create Empty で空のゲームオブジェクトを作成します。
    • 名前を “CountNumber” に変更します。
  • Asset / ClusterItems / Models からTriangle を Scene 上に2つ配置します。
    • 配置したそれぞれの三角形を選択した後にInspector上で Add Component から Mesh Collider を追加します
  • 次に、 3D Object / Cylinder から円柱を追加します。
    • このときに Inspector の欄から Capsule Collider を削除して、代わりに Add Component から Mesh Collider を追加してください。

Cube の Scale を “1” にしたときのスケール感は下記の画像のようになります。
小さいアバターによってボタンが大きく感じる場合はボタン全体の Scale を ×0.6 してみるとよいかもしれません。

本画像のオフィシャルアバターの身長は約180cm
  • 次にワールドゲートの遷移先を設定する親となる、空のゲームオブジェクトを作成します。
    • 名前は “WorldRoot” としてください。
  • この階層下にワールドゲート本体の役割を果たす Cube を 3D Object / Cube から作成します。
スイッチのモデル
複数の移動先を設定できるワールドゲートの階層構成

これでギミックを実装する本体のオブジェクトは完成です!

トリガーを設定して、複数の遷移先を選択できるようにするギミックを実装する

Cluster Creator Kitには「トリガー」と呼ばれる、ワールド内で起こったことやプレイヤーの動作を検知し、それをメッセージとして通知する機能を持つものがあります。

今回はこちらを活用します。
下記に簡単に説明しますが、内容を完璧に理解しなくても、本記事の手順を踏むことでアイテムを完成させることができるので、読み飛ばしてもらっても問題ありません!

メッセージには Signal , Bool , Float , Interger の4種類の型があります。

簡単に説明すると、Signal は値を持たない、一時的なメッセージです。Bool はオン/オフのような2値で表現できる値のメッセージです。FloatとIntergerは数値を表すメッセージですが、前者は実数値として表現できる値のメッセージであり、後者は整数として表現できる値のメッセージです。

詳しくはこちらのドキュメントを参照してください。

トリガーには、そのトリガーが何を行うのか分かるように名前を設定するのがおすすめです。
この記事では、トリガーの Signal 型は先頭文字を大文字に、それ以外のトリガーの型については先頭文字を小文字にしています。

今回設定する Trigger 一覧

  • Interact Item Trigger
  • On Create Item Trigger

今回設定するTriggerの名前 一覧

  • worldNumber :接続先を決定する整数値
  • Next :次の選択へ送るメッセージ
  • Prev :前の選択に戻るメッセージ
  • AddWorldNumber :worldNumber に1加えるメッセージを出す
  • SubWorldNumber :worldNumber から1引くメッセージを出す
  • CheckNumber :worldNumber の値を比較するメッセージを出す
  • 01on / 02on / 03on / 04on :CheckNumber のメッセージを受け、worldNumber と同値のポータルを出す

また、トリガーの依存関係は下記の図のようなイメージになります。

それでは、前章で用意したオブジェクトにトリガーを設定していきましょう。

  • まずボタンとなる Triangle に「Interact Item Trigger」 を設定します。
  • それぞれのTriangleに “Next / Prev” を設定していきます。
    • まず「+」を押して設定ウインドウを表示させ、それぞれのTarget に”Next”、”Prev”を設定します。
    • Target はGlobal 、Value は Signal にします。
  • 次に「Interact Item Trigger」の下にある「+」を押して、次の設定ウインドウを表示させてください。
    • Target はGlobal 、Value は Signal にした上で、Targetに”CheckNumber” のメッセージを両方に設定してください。

※Target はトリガーが通知する対象の種類を指定するもの
※「Interact Item Trigger」は掴めないアイテムに「使う」機能を追加し、使われたことを通知するトリガー

  • 次に、CountNumberに「On Create Item Trigger」をアタッチしてください。
    • 「+」を押して設定ウインドウを表示させます。
    • Target を Global  にし、トリガーに “worldNumber” を設定します。
    • 初期値は  Integer 型の “0” を設定します。

※「On Create Item Trigger」はこのアイテムが生成された時に通知するトリガー

同じく CountNumberに2つのパターンを設定します。

  •  “Next” / “Prev” のメッセージを受け取るための Global Logic を加えます。

この記事では “worldNumber” の値によって条件分岐を行います。

“worldNumber” が4未満のときに “Next” メッセージを受けとった場合、”AddWorldNumber” を送信するようにします。

  • TargetはGlobalとし、Keyに”Next”を設定してください。
  • 次にComponent の下側にある「+」マークからスロットを1つ追加します。
  • 一番上のGlobalの横のウインドウに”AddWorldNumber”と記入してください。その横はSignalとしてください。
  • 次に条件分岐として “LessThan” を選択してください。この設定により1つ目の値が2つ目の値より小さい場合に、”AddWorldNumber” のメッセージを送信します。
    • 1つ目には RoomState を設定し、”worldNumber” を入力します。
    • 2つ目には Constant を設定し、整数型を扱う Integer にした上で整数値の “4”  を入力しましょう。

同様に “worldNumber” が1より大きいときに “Prev” メッセージを受けとった場合に送信する “SubWorldNumber” を設定します。

  • TargetはGlobalとし、Keyに”Prev”を設定してください。
  • 次に Component の下側にある「+」マークからスロットを1つ追加します。
  • 一番上のGlobalの横のウインドウに”SubWorldNumber”と記入してください。その横はSignalとしてください。
  • 次に条件分岐として “GreaterThan” を選択してください。この設定により1つ目の値が2つ目の値より大きい場合に、”SubWorldNumber” のメッセージを送信します。
    • 1つ目には RoomState を設定し、”worldNumber” を入力します。
    • 2つ目には Constant を設定し、整数型を扱う Integer にした上で整数値の “1”  を入力しましょう。

※RoomState は最後に受け取ったメッセージを参照します。Constant は定数を使用する場合に設定し、型と値を指定します。
※Global Logic はParamater TypeがSignalのメッセージを読み取った際にさまざまなメッセージを出すことができます。これを用いることで条件分岐を行うことができます。ロジックについて詳しく知りたい方はこちらをご覧ください。

つづいて “AddWorldNumber” / “SubWorldNumber” のメッセージを受け取ったときの処理を Global Logic で加えます。このロジックでは、それぞれのメッセージを受けたときに “worldNumber” を1増減させるメッセージを送信します。

同じくCountNumberにコンポーネントを設定していきます。

まず最初に “AddWorldNumber” のロジックを組んでいきます。

  • TargetはGlobalとし、Keyに”AddWorldNumber”を設定してください。
  • Component の下側にある「+」マークからスロットを1つ追加します。
  • 一番上のGlobalの横のウインドウに”worldNumber”と記入してください。その横はIntegerとしてください。
  • 次に条件分岐として “Add” を選択してください。これは1つ目の値と2つ目の値を足し合わせたものをメッセージとして送信します。
    • 1つ目には RoomState を設定し、”worldNumber” を入力します。
    • 2つ目には Constant を設定し、整数型を扱う Integer にした上で数値の “1”  を入力しましょう。

次に “SubWorldNumber” のロジックを組んでいきます。

  • TargetはGlobalとし、Keyに”SubWorldNumber”を設定してください。
  • 次に Component の下側にある「+」マークからスロットを1つ追加します。
  • 一番上のGlobalの横のウインドウに”worldNumber”と記入してください。その横はIntegerとしてください。
  • 次に条件分岐として “Subtract” を選択してください。これは1つ目の値から2つ目の値を引いたものをメッセージとして送信します。
    • 1つ目には RoomState を設定し、”worldNumber” を入力します。
    • 2つ目には Constant を設定し、整数型を扱う Integer にした上で整数値の “1”  を入力しましょう。
 CountNumberのInspector欄の設定がこのようになっていればOKです!

次は、切り替えるワールドゲートの親となる WorldRoot に Global Logic を追加します。

“CheckNumber” のメッセージを受けたときに “worldNumber” の値に応じて、まずは “01on” などの Bool 値をもつメッセージを送信するように設定します。

下記の図では  “worldNumber”  の値が1と等しかったとき、 “01on”  のメッセージを送信しています。

  • TargetはGlobalとし、Keyに”CheckNumber”を設定してください。
  • Component の下側にある「+」マークからスロットを1つ追加します。
  • 一番上のGlobalの横のウインドウに”01on”と記入してください。その横はBoolとしてください。
  • 次に条件分岐として “Equals” を選択してください。これにより値が等しかったものをメッセージとして送信します。
    • 1つ目には RoomState を設定し、”worldNumber” を入力します。
    • 2つ目には Constant を設定し、整数型を扱う Integer にした上で整数値の “1” を入力しましょう。

同様の手順で、”02on”と”2″など対応するGlobal Logicを設定していきましょう。

特定のメッセージを受けたときに表示するように、それがついているGameObjectのアクティブ状態を切り替えるギミック「Set Game Object Active Gimmick」を WorldRoot の階層下にあるオブジェクトに追加します。

  • Inspector上のadd componentで「Set Game Object Active Gimmick」を検索して、選択してください。
  • ここで”01on”のメッセージを受けるようにするために、Target は Global で Key は “01on” に設定してください。

ここで正しく機能しているのか確認してみましょう!(動画では8:10からのシーン)

WorldRootの階層下にあるオブジェクトを非表示にして、画面上部の再生ボタン「▶」を押してプレビューモードにしてください。

左右の矢印を押すと worldNumber が増減し、配置したワールドゲートが表示されます。同様の手順で、World GateのKey をWorldRootで設定した”02on”などのBool値と対応させることで、ほかのオブジェクトを表示することができます。

次に特定のワールドに行くようにできるワールドコンポーネント「World Gate」を設定します。

  • WorldRootの階層下にあるオブジェクトを非表示にして、 Inspector上のadd componentで「World Gate」を検索して、選択してください。
  • 登録したいワールドの World Id を設定していきます。
  • より後ろの文字列となっています。

ポータル番号をみえるようにする

現在表示されているポータルの番号を簡単に表示する方法を紹介します。

ポータル番号をきれいに見えるようにするやり方はいくつかあるので、自分なりの方法を見つけるのはよいかもしれませんが、ここでは簡単な方法を紹介します。

  • Hierarchy を右クリックし、UI / Text を選択して Canvas と Text を作成します。
    • このとき同時に生成される Event System は削除しておいてください。残ったままだとワールドアップロード時にエラーが表示されアップロードができなくなってしまいます。
  • ここで Canvas のLayerを UI から default に変更し、Render Mode を World Spaceに変更してください。
    • こうしておくとワールドになった際にも、UI をカメラで撮影できるようになります。
  • Canvas の Width , Height を 0 に変更します。
  • Canvas の Scale は (x, y, z) = (0.001, 0.001, 0.001) に調節しておきます。
  • 次にText を選択し 、Font Size を最大値である “300” に設定しましょう!これによってくっきりとしたテキスト UI になります。

WorldSpaceUIのテキストについて詳しく知りたい方は下記をご覧ください。

次に表示されるテキストとポータルの番号を一致させるようにします。

  • TextにAdd Component から読み取ったメッセージをTextコンポーネントに設定するギミック「Set Text Gimmick」をアタッチします。
  • ここでは、ポータル番号を確認したいため Target は Global に設定します。Keyは “worldNumber”に、Parameter Typeは Integer にします。
  • そして、Format欄は”{0}”とします。この{0}の部分にポータル番号が表示されます。

この他にも、Signalメッセージの送られたタイミングなどの表示も可能です。
詳しくは「Set Text Gimmick」のドキュメントをご覧ください。

これで完成になります!ワールドに置いてアップロードしてみましょう!


今回解説したものはワールドゲートでしたが、この WorldRoot 以下の階層に存在する World (1) と同様に Set Game Object Active Gimmick で Trigger を設定してあげると、いろいろなことに使うことができます!

ポスターや cluster 用アイテムの切り替えなど利用用途はあなたの想像次第です!

ぜひつくってみてくださいね。


最後に公式による記事や多くのクリエイターの皆さんによるドキュメントやコミュニティを紹介します。
ぜひ活用して自分だけのワールドを制作してみましょう!

▼ 「Cluster Creator Kit」の全てが分かる公式ドキュメント
Cluster Creator Kit ドキュメントhttps://docs.cluster.mu/creatorkit/

▼ クリエイターによる投稿記事まとめ
ワールド制作部https://note.com/cluster_official/m/m1fd772ab8f45
アバター制作部https://note.com/cluster_official/m/m6b18e343f35c
イベント制作部https://note.com/cluster_official/m/m7155e6f6887f

▼ 分からないことがあればコミュニティを活用してみましょう!
Cluster Creator Community Discord
https://discord.gg/DHQmAfDhkt