イベント会場の外から演出を実行!「Webトリガー」の紹介

投稿者:

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

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


今回は「Webトリガー」について紹介します。

この記事ではclusterでのイベントの進行に合わせて会場に変化を与えたいという方向けに、clusterのWebサイトから演出を実行できる「Webトリガー」という機能を紹介します。

Webトリガーを使えばイベントでさまざまな演出をできるようになるので、ぜひ使い方を覚えてみてください。

目次

「Webトリガー」とは

clusterでイベントを開催する時に使える機能です。

たとえば、

  • MC終了後に楽曲を開始する。
  • 演者のアドリブに合わせて、会場を演出する。
  • 進行に合わせて、会場の形状を変更する。

のようなことができます。

WebトリガーはclusterのWebサイトのイベント管理画面から入ることができるトリガー制御画面から実行できます。
cluster のイベント会場内に居なくても Webサイト から実行できるため、複数人でイベントを行うときに重宝します。
※トリガー制御画面はイベントのスタッフだけ開くことができます。

「Webトリガー」をつかってみる

Webトリガーの実行は簡単です。

まずはクイズ会場でイベントを立ててWebトリガーの使い方について確認してみます。
イベントの立て方についてはこちらをご覧ください。

こちらが今回使用するWebトリガーのファイルになります。
このJSONファイルはトリガーの実行に必要な情報をまとめたデータですが、まずはダウンロードしたファイルをそのまま使う形で大丈夫です。

▼JSONファイルはこちら
https://drive.google.com/file/d/1YPNAPA4kbV7mZ0pJUcLOqGDe2ep7bFCO/view?usp=sharing

  • 次にイベントページのスタッフ向け機能の欄にある「トリガー制御」をクリックしてください。

「トリガー制御」をクリックすると、こちらのページが表示されます。

  • 「JSONを読み込む」をクリックして先ほどダウンロードしたファイルを読み込んでください。

JSONファイルを読み込むと下記の画像のように設定されたトリガーが表示されます。

このトリガー制御画面からそれぞれのボタンを押してトリガーを実行するとイベント会場に変化が起きます。

「Webトリガー」を実行できるワールドをつくってみる

次に「Webトリガー」を使ってオブジェクトが動く簡単なワールドをつくってみます。

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

上記で紹介する方法以外ではテンプレートプロジェクトを利用するのがおすすめです。下記のページからテンプレートプロジェクトをダウンロードして、Unityで開くことで、clusterへアップロードする環境まで一気に準備することができます。

https://docs.cluster.mu/creatorkit/download/template-project/

▼今回作成した Unity の Scene はこちら
https://drive.google.com/file/d/1lMXf-W3kEsJjhpL3iTENDkpOjD4IXzUF/view?usp=sharing


ここから「Webトリガー」を使ってオブジェクトが動く簡単なワールドをつくっていきます。

  • まず最初に「3D Object → Plane」から床を作成します。
  • 次に「3D Object → Cube」から Cube を3つ作成します。

作成した Cube に与えたい変化ごとに、コンポーネントを「Add Component」からそれぞれ追加します。

Cubeを出したり消したりする

左側の cube に Set Game Object Active Gimmick を追加します。
Target は Global に設定し、key を active にします。

Set Game Object Active Gimmick|Creator Kit ドキュメントhttps://docs.cluster.mu/creatorkit/gimmick-components/set-game-object-active-gimmick/

Cubeを回転させる

中央の cube に Add Continuous Torque Item Gimmick を追加します。
Target は Global に設定し、key を rotate にします。Parameter Type を Integer に設定します。
最後にCubeが横に回転するように Torque の Y の値に 5 を設定します。

Add Continuous Torque Item Gimmick|Creator Kit ドキュメント
https://docs.cluster.mu/creatorkit/gimmick-components/add-continuous-torque-item-gimmick/

Cubeを移動させる

右側の cube に Add Instant Force Item Gimmick を追加します。
Target は Global に設定し、key を Jump にします。Parameter Type を Signal に設定します。
最後にCubeが上に移動するように Force の Y の値に 5 を設定します。

Add Instant Force Item Gimmick|Creator Kit ドキュメント
https://docs.cluster.mu/creatorkit/gimmick-components/add-instant-force-item-gimmick/

便利なWebサービスを使ってJSONファイルを作成する

Cube の設定が完了したら次はWebトリガーを準備します。

Webトリガーは先ほど紹介したJSONというフォーマットで記述したファイルを用います。
書き込むJSONのフォーマットについてはこちらをご覧ください。

……とはいえ、最初からこれを用意するのは大変ですよね。
こちらの Web サービスを利用することでWebトリガー用の JSONファイルを簡単に作成することができます!

上記のWebサービスについて下記で少し説明します。

  • displayName はトリガー制御ページに表示されるボタンです。
  • state は 会場に送られるメッセージの設定の配列です。
  • key はメッセージの識別名を指定します。 Webトリガーから通知する対象はGlobalのみとなります。
  • type はメッセージの型(値の種類)を指定します。
  • value はメッセージの値を指定します。
  • 設定でshowConfirmDialogにチェックマークを入れていないと、ダイアログが出現せずそのままトリガーが実行されます。

*マークがついている箇所は必須項目になります。
各項目の詳細な説明はこちらのページを参照してください。
Webからトリガーを実行する | Cluster Creator Kit ドキュメント

  • 作成が完了したら、「JSONをダウンロード」を押してファイルをダウンロードしてください。

今回作成したWebトリガーはこちらです。

Webトリガーの動作を確認する

Unity上の WebTriggerWindow でWebトリガーの動作を確認できます。

  • Unityのメニューから「Cluster > Preview > WebTriggerWindow」から開きます。
  • 「JSONを読み込む」から先ほど作成したJSONファイルを読み込みます。

再生ボタンを押して、WebTriggerWindow からボタンを押してWebトリガーを実行してみましょう!
トリガーを実行すると会場にあるギミックのうち、TargetGlobalKeyが設定ファイルに指定したkeyと一致するギミックが動作します。

トリガーの実行を確認できましたね。
あとはワールドとしてアップロードをしましょう!

注意点
webのトリガー制御画面から実行できるのは、イベント会場のトリガーです。ワールドでは実行することはできません。


今回は「Webトリガー」を使ってオブジェクトが動く簡単なワールドをつくってみました。Webトリガーを使うと会場の外からいろいろなものを操作することができます。

Target を Global にすることで他のギミックもwebトリガーで実行することができます。

イベントでの演出にぜひ取り入れてみてください!


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

▼ 「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