見出し画像

【ベータ機能】ワールドクラフトで特定のエリアに入ったらポストプロセスをONにする方法

inaba（イナバ）

こんにちは。こんばんは。イナバです。
メタバースプラットフォーム　clusterでアイテムやワールドを制作しています。

Cluster Script Advent Calendar 2024に参加しています！！
昨日はかおもさんの「Unity上でClusterScriptを動かすための一歩目」の記事でした。
・・・うん、読んでもわからん（私の力量不足です）！

今回はベータ機能を使用して、ワールドクラフトで特定のエリアに入ったらポストプロセスをONにする方法をご紹介します。


特定のエリアに入ったらポストプロセスがONになる？

CCK製のワールドではプレイヤーが特定のエリアに入ることでポストプロセスをONにしてワールドの表現を変えることできます。
以下はプレイヤーが水面の下のエリアに入った際に、水の中にいるような表現を作る公式の解説記事です。ぜひご覧ください！

ワールドクラフト製のワールドの場合、プレイヤーに触れることでポストプロセスの設定をONにするアイテムをうまく配置することで、同じような演出を再現することが可能です。

ベータ機能を使用したポストプロセスの設定方法は以下の記事もご参照ください。

実際の映像

洞窟の出入り口に２種類のアイテムを設置することにより、エリアに入るとポストプロセスがＯＮになってワールドの見え方が変わるようになります！逆にエリアを出るとポストプロセスがＯＦＦとなります。

動画ではわかりやすく青と赤のアイテムにしていますが、透明のアイテムにするとエリアの境界は外見からはまったくわからなくなります。

アイテムの作り方と置き方

ポストプロセスを切り替えたい出入り口に、プレイヤーに触れるとポストプロセスがONにするアイテムとポストプロセスをOFFにするアイテムをそれぞれ配置することで、プレイヤーの移動に伴ってポストプロセスの演出を切り替えることができます。

出入り口にポストプロセスをON,OFFするアイテムを配置する

アイテムの準備

アイテムの設定

今回はアイテムにプレイヤーが触れると○○する系のアイテムを作ります。
Overlapを使用するので、Overlap Detector Shapeのコンポーネントを付けたアイテムをアップロードしてください。
ベータ機能の設定とOverlapの設定は以下の記事も併せてご覧ください。

ポストプロセスをONにするアイテムのコード

プレイヤーがアイテムに触れると水中にいるような表現になるアイテムです。 「//ポスプロのコードを挿入」の中身を変えることで様々な表現が可能です。


$.onUpdate(deltaTime => {
    // 初期化
    if (!$.state.initialized) {
        $.state.initialized = true;
        $.state.overlapPlayers = [];
    }


    // 前のフレームで接触していたプレイヤーIDの一覧
    let previousOverlapPlayers = $.state.overlapPlayers;


    // このフレームで接触しているプレイヤーIDの一覧
    let currentOverlapPlayers = [];


    // 接触しているオブジェクトをすべて取得
    let overlaps = $.getOverlaps();


    overlaps.forEach(overlap => {
        // 接触しているオブジェクトがプレイヤーであるかどうかを確認
        
        let playerHandle = overlap.Handle;
        if (playerHandle === null) return;
        
        // 現在接触しているプレイヤーの一覧に追加
        currentOverlapPlayers.push(playerHandle.id);


        // 前のフレームで接触していたプレイヤーは除外
        if (previousOverlapPlayers.includes(playerHandle.id)) return;


        //ポスプロのコードを挿入
        const effects = new PostProcessEffects();
    
        effects.depthOfField.active = true;
        effects.depthOfField.aperture.setValue(6);
        effects.depthOfField.focalLength.setValue(50);
        effects.depthOfField.focusDistance.setValue(2);
    
        effects.colorGrading.active = true;
        effects.colorGrading.colorFilter.setValue(0, 1, 1, 255);


        effects.lensDistortion.active = true;
        effects.lensDistortion.intensity.setValue(50);
      
        
        //ポスプロを適用する
        playerHandle.setPostProcessEffects(effects);

    });


    $.state.overlapPlayers = currentOverlapPlayers;
});

ポストプロセスをOFFにするアイテムをのコード

プレイヤーがアイテムに触れるとポストプロセスがリセットされるアイテムです。

$.onUpdate(deltaTime => {
    // 初期化
    if (!$.state.initialized) {
        $.state.initialized = true;
        $.state.overlapPlayers = [];
    }

    // 前のフレームで接触していたプレイヤーIDの一覧
    let previousOverlapPlayers = $.state.overlapPlayers;


    // このフレームで接触しているプレイヤーIDの一覧
    let currentOverlapPlayers = [];


    // 接触しているオブジェクトをすべて取得
    let overlaps = $.getOverlaps();


    overlaps.forEach(overlap => {
        // 接触しているオブジェクトがプレイヤーであるかどうかを確認
        let playerHandle = overlap.Handle;
        if (playerHandle === null) return;


        // 現在接触しているプレイヤーの一覧に追加
        currentOverlapPlayers.push(playerHandle.id);


        // 前のフレームで接触していたプレイヤーは除外
        if (previousOverlapPlayers.includes(playerHandle.id)) return;


        playerHandle.setPostProcessEffects(null);
    });


    $.state.overlapPlayers = currentOverlapPlayers;
});

上記のアイテムをアップロードして、出入り口にそれぞれ配置することで特定の領域に入った場合にポストプロセスをONにすることができます。

出入り口ごとにアイテムを設置しなければならないので、出入り口が多いほどアイテムの容量をたくさん消費してしまうので注意が必要です。

注）私の環境では一応動きますが、環境によってはうまく動かないこともあるかもしれませんのでご了承ください。

余談

今回紹介したXの投稿にりのたんから以下のようなリプがありました！

掲載許可はいただきました

このやり取りがきっかけとなったかどうかはわかりませんが、今回のポストプロセスアイテムの演出も使用した新しいコラボワールドを近日公開予定です！公開しました！

予告動画はこちら

ワールド公開の際にはぜひ遊びにきてください！

明日はみずこホリさんの「指定したIDの人だけが押せるやつ」です！

追記

2024年12月25日にコラボワールドが公開されました！

コラボワールドの制作秘話はこちら！



いいなと思ったら応援しよう！