Subjectsのカーソルの表示: マルチユーザーデモ
概要
リアルタイムで複数の参加者が実験に参加しているマルチユーザー実験では、参加者同士がカーソルを見えるようにしたい場合があります。このデモでは、その設定方法を示します。
実装に関する注意
Labvancedでは、複数の参加者のカーソル位置を共有するために実装できるアプローチがいくつかあります。プラットフォームは柔軟であるため、アプローチを決定する前に実験デザインを考慮することが重要です。
この点を明確にするために、これを達成するための2つのアプローチを提示します：
- アプローチ1： カーソル位置を配信するための配列を利用したデモ
- アプローチ2： さらに下のセクションで、 x座標とy座標に対して単一の値を使用するデモについて話し合います
アプローチ1: マウストラッキングと配列を使用したカーソル表示
このデモには2つのオブジェクト（ユーザーごとに1つのマウス）が含まれており、オブジェクトパネルのサイドパネルにリストされています。このアプローチは2人以上の参加者がいるマルチユーザー研究で使用できます。
オブジェクト
以下は、すべてのビジュアルスタイリングを処理できるObject Propertiesパネルです。現在、両方のカーソルはVisibilityの値が1（これは不透明度=100%を意味します）として表示されています：
このデモでは、以下の通りVisibilityを0に変更します。後で実験が開始されると、一つのカーソルが見えるようになります。つまり、参加者1の場合、こちらに参加者2のカーソルオブジェクトが表示され、逆も同様です。これは以下のEvent:Initセクションで説明されています。
カーソルに対して2つのオブジェクトを持たない場合は、このセクションを参照して、単一のカーソルオブジェクトの代替方法を確認してください。
カスタム変数
ここでは、このデモの目的で作成されたすべてのカスタム変数をリストします。実験を構築している間に事前に作成することも、エディタ内で作成することもできます。
イベント概要
イベントを追加するには、[[+] Frame Event (on this frame only)].
このデモでは、以下のイベントがあります。
- Event:Init: 他の参加者のマウスを可視化する
- Event: sendMove: マウスの座標を送信する
- Event: receiveMove: マウスの座標を受信する
以下に、各イベントの構造が説明されています。
EVENT: init
このイベントは、フレームが初期化されるときに何が起こるかを指定します。この場合、参加者1が参加者2のマウスを見て、逆にすることが目標です。
トリガー
このイベントのトリガーはOn Frame Initであり、フレームが初期化されたときにカーソルオブジェクトの可視性を設定したいからです。
アクション
これを指定して「次へ」ボタンをクリックすると、フレーム初期化時に発生するアクションを選択できます。
以下に、使用するアクションは制御アクション→「If... Then」、であることを示します：
Role_Idが1に等しい場合（注： Role_Id はマルチユーザー研究に特有の変数で、参加者にIDを割り当てます）。- 次に、
Set Object Propertyのmouse_user_2オブジェクトのVisibilityを1に設定します。 - 注： これらの2つのアクションの組み合わせは本質的に「あなたが参加者1（Role_Id==1）である場合、あなたはmouse_user_2オブジェクトを見るでしょう。」を意味します。
- 注：
Role_Id == 1はエディタでどのように指定されていますか？これは、以下のステップバイステップセクションでさらに詳しく説明されています。
[Else If]]セクションでは、参加者2（Role_Id==2）のために同じことを行います。ターゲットオブジェクトはmouse_user_1で、Visibilityの値が1である必要があります。
EVENT: sendMove
次に、2人の参加者間に「橋」を確立する必要があります。つまり、マウスを動かすと、その値が追跡され、他の参加者に送信されるということです。
トリガー
したがって、Mouse triggerがこのイベントで使用され、実行されている「移動」がイベントをトリガーします。
アクション
再び、Control Action→If…Thenコマンドが必要です：
あなたのRole_Idが1の場合、次のVariable Actionsが発生します：
Set / Record a Variable：変数moveMouse1をポイント/定義し、それを動的なトリガー特有の値のMouse [X,Y] Arrayと等しく設定します。Distribute Variable:この変数を参加者2と共有します。
そうでなければ、あなたのRole_Id==2 …
次に：
moveMouse2は、前の例と同様にMouse [X,Y]配列を記録しますが、参加者2のマウストラッキング値を格納し、彼らのMouse [X,Y]配列と等しく設定します。- 次に、この変数を参加者1に配布します。
要約 - ここまでの過程で、私たちは次のことを行いました：
- 各参加者のマウストラッキング[X,Y]配列を格納するための変数を作成しました（moveMouse1は参加者1のカーソル用、moveMouse2は参加者2のカーソル用）
- そして、マウストラッキング値を他の参加者に送信するために変数配布アクションを使用して橋を設立しました。
EVENT: receiveMove
次に、これらのマウストラッキング値を使って何が起こるかを指定する必要があります。この場合、配列形式でマウスの動きを受信した際に、マウスカーソルオブジェクトを動きに合わせて変更したいと考えています！言い換えれば、[X,Y]配列を使用して、これらの値をマウスカーソルにバインドし、他の参加者が画面上で何をしているかを示すように動かします！したがって、これを達成するために、以下に説明するトリガーとアクションが使用されます。
Trigger
マウストラッキング値は変数に保存されていますので、これらの変数が変化するたびに、マウスが動いていることを意味します。したがって、マウストラッキング値を保持している2つの特定の変数を選択して、画面上のカーソル位置を更新するために、Variable Value Changed triggerを使用できます。以下に示すように：
Action
次に、カーソルの変数配列からx座標とy座標の値を取得するために、Select From Array (Read) actionを使用します。これらの値をオブジェクトの座標を設定するために使用する予定です。
したがって、参加者1の[X,Y]の配列を持つmoveMouse1変数を選択し、1のFixed Indexを呼び出して、その値をx_mouse1という数値変数に保存します。配列内でx値は最初にリストされています。
もう一つのSelect From Array (Read)アクションを追加し、Fixed Indexに2と記入します。これは、y座標の2番目の配列値を呼び出し、それをy_mouse1変数に保存したいためです。
カーソル画像を動かすためには、マウストラッキングから取得して変数x_mouse1およびy_mouse1に保存したx座標とy座標をリアルタイムで更新しなければなりません。
これを実現するために、Set Object Propertyアクションを選択し、Targetのmouse_user_1（以下の画像では、ダイアログボックスがタイトルを短縮しているため「mouse」とだけ記載されています）のプロパティXにx_mouse1+5という値（これは算術演算です）を設定します。この手順に従った説明を参照してください。
この時点で、入力フィールドに+5が表示される理由を疑問に思っているかもしれません…これは、実際には埋め込まれた画像を含むテキストオブジェクトであるため、オフセットを作成する必要があります（このウォークスルーの冒頭で説明した通り）。したがって、研究を構築し、ユーザーがカスタマイズされたカーソルを見たり、他のオブジェクトをクリックしたりする必要がある場合は、このオフセットを作成しなければなりません（カーソルの画像を省略してテキストラベルだけを保持することを選択しない限り）。
続いて、+Add Propertyを選択し、同じ画像オブジェクトを指し、Yプロパティを選択し、y_mouse1変数に等しく設定します。
同じプロセスを繰り返しますが、参加者2のために専用にした他の変数を選択します：
ここでは、オブジェクトmouse_user_2を指し、対応する変数を割り当てます：
これらのすべてのアクションにより、2つのカーソルオブジェクトが参加者の動きに応じて移動し、配列変数から値を読み取り、これらの数値を使用してオブジェクトのxおよびy値を設定します。
EVENT: end
次に、データ記録プロセスを正式に終了させ、データを保存するための「終了」ボタンを挿入してイベントを作成します。このボタンがトリガとして使用されると、Accept/End Sessionアクションが行われる制御アクションに至ります。
Trigger
セッションを終了させるために、ボタンのトリガは、End Buttonをクリックすることでセッションが終了します。
Action
アクションは、セッションを受け入れる/終了します。
繰り返しになりますが、このデモは学習目的のものであり、マルチユーザーの研究環境でマウスおよびカーソルの位置を共有する方法の一例に過ぎないことに注意してください。この効果を達成する他の例は、今後のセクションで説明されます。
Approach 2: Single Variable Approach for Sharing Cursors in Multi-User Studies
この別のデモでは、 配列の代わりに、単一の値（つまり、X座標およびY座標を直接呼び出す）を使用するオプションを示しています。
このデモの完全なプレビューです。終了時に記録されたデータのプレビューも含まれています：
Single Object for the Cursor
このデモは、カーソル用の2つのオブジェクトの代わりに1つのみを使用する点で、前のデモとは異なります。このアプローチは、対戦相手や仲間のカーソルの位置を表示したいマルチユーザー研究に最適です。
Custom Variables
この別のデモには、以下のカスタム変数とその仕様が含まれています。このデモは変数が少ないですが、配列の前の例に比べてより多くのイベント/アクションが必要です。
EVENT: sendMove
トリガーはマウスの動きです：
アクションは、マウスのX座標とY座標のトリガー特有の値を2つの別々の変数に記録することです。これらは特に参加者1を示すように命名されています。
このif/then条件の下での次のアクションは、これらの2つの値を参加者2に配布するためのものです。
次に、「Else If」条件を追加して、マウスのX座標とY座標のトリガー特有の値を、参加者2を示すために特に名付けられた2つの異なる変数に記録します。
次のアクションは、これら2つの値を参加者1に配信するために使用されます。
EVENT: receiveMove1
次に、マウス座標を送信するためのイベントが必要です。したがって、参加者1に関連する特定の変数値が変更されると、それがトリガーとして使用されます。
次に、アクションを使用してカーソル位置のオブジェクトプロパティをこれらの値に更新します。要するに、あなたが参加者2の場合、対戦者オブジェクトは参加者1の変数の座標を取ります：
EVENT: receiveMove2
ここでも同じことをします。もしあなたが参加者1であれば、対戦者オブジェクトは参加者2の変数の座標を取ります：
結論
このデモでは、マルチユーザー研究の設定において、マウス座標がオブジェクトプロパティを更新するためにどのように使用できるかの多くの方法のうちの2つを示しています。配列を使用できます。
デモ詳細：値の入力ステップバイステップ
Labvancedの使い方がまだわからない場合や、追加の説明が必要な場合、以下のセクションでは、特定のコマンドの実装方法と、それを実装するために必要なメニューのステップをステップバイステップで示しています：
- 要件アクションでの
Role_ID==1の指定 - マウス追跡のためにレコードされるマウス[X,Y]配列の選択
- オブジェクトプロパティを設定するための算術演算の使用
要件アクションでのRole_ID==1の指定
上記のデモでは、この行が頻繁に表示されるので、どのようにしてそのようにすることができますか？
最初に+Add Actionと選択制御アクション→要件アクション（If…Then）を選択します。これがこのデモのコンテキストにおいて頻繁に出現するためです。
次に、+ Requirementを選択して、If条件をより詳細に指定します。
最初の鉛筆アイコン（公式には値選択メニューとして知られています）で、Variable→Select Variableを選択して、Role_Id変数を指すようにします。
これにより、すべてのローカル/グローバル変数が保存されている変数メニューが開きます。上部パネルのGlobal Variablesの下にRole_Id変数が見つかります。これを選択します。
次に、別のペンアイコンで、参加者の役割IDの値を指定する必要があります。したがって、定数値→数値に進みます。
そして、単に数字の1を入力します。やったね！
オブジェクトプロパティを設定するための算術演算の使用
カーソル位置の設定は、Set Object Propertyアクションを使用し、ターゲットオブジェクト、そのプロパティを指定し、新しい値として使用される変数値を指定することで行います。
オブジェクトアクションを選択します：
Targetについては、最初のnoneをクリックし、リストから最初のカーソルオブジェクトmouse_user_1を選択します。オブジェクトプロパティの2番目のリストでは、Xオプションを選択します：
次に、ペンアイコンをクリックします。メニューからOperationsを選択し、Arithmeticオプションを選択します：
最初のペンアイコンをクリックし、Variable→Select Variableを選択すると、選択できる変数のダイアログボックスが表示されます。この中からx_mouse1変数を選択します。
次に、2番目のペンアイコンをクリックし、Constant Value→Numericを選択し、表示されるフィールドに数字の5を入力します。
このデモは、オブジェクトが画像とテキストの組み合わせであるため、オブジェクトの下をクリック可能にするために、値を5ポイントオフセットする必要があります：
下の+Add Propertyをクリックし、y_mouse1変数がYオブジェクトのオブジェクトプロパティに割り当てられることを示します。