アイ・トラッキングデモ: AOIとしてのSVG
概要
このデモでは、アイ・トラッキングの視線データをキャプチャすることを目指しています。具体的には、研究に含まれる特定の興味のある領域（AOI）に関連する視線データをキャプチャしたいと考えています。これらはSVG 形状オブジェクトとして提供されます。
デモのプレビューは、視線位置をリアルタイムで示す赤い円によってフィードバックを提供し、以下に示されています。
- 注意: デモ録画は5.5分のキャリブレーションオプションを使用して行われました。赤い円は参加者の視線をリアルタイムで表すオブジェクトであり、全体の設置についてはさらに以下で説明されます。
デモの実行を示したこの短いビデオと、最後に記録されたデータのプレビューをご覧ください:
オブジェクト
このデモには、4つのSVGオブジェクトの上に配置された桟橋の背景画像が含まれています。また、視線フィードバックオブジェクト（赤い円）もあります。このデモの目的のために、視線をリアルタイムで表現したいと考えており、この赤い円がそれを反映しています。
作成されたカスタム変数
データを記録するには、変数が必要です。このデモのために作成されたカスタム変数のリストは以下に示されており、‘変数’タブからアクセスできます。以下の画像は、このデモが利用している変数の詳細と設定を示しています:
以下に、変数の説明とその目的を示します:
| 変数名 | 説明 | レコードタイプ |
|---|---|---|
All Gaze Data | x/y座標の配列[X,Y]、タイムキャプチャ[T]、および測定の信頼度[C]を保存するために使用されます。 | すべての変更 / タイムシリーズ |
AOI1_gaze_data | 参加者がAOI1という名前のSVGオブジェクトを見ているときに[X,Y,T,C]の配列を保存するために使用されます。 | すべての変更 / タイムシリーズ |
SVG1_path | AOI1に留まった視線のSVGノードのパスを記録します（詳細は以下で説明）。 | すべての変更 / タイムシリーズ |
AOI2_gaze_data | 参加者がAOI2という名前のSVGオブジェクトを見ているときに[X,Y,T,C]の配列を保存するために使用されます。 | すべての変更 / タイムシリーズ |
SVG2_path | AOI2の視線が留まったSVGノードのパスを記録します。 | すべての変更 / タイムシリーズ |
以下同様....
設定されたイベント
視線データをキャプチャすることに関心があるため、以下のイベントが使用されます:
- すべての視線データ: このイベントはタスクが始まるとすぐに開始され、アイ・トラッキングの視線データを連続して記録します。
- AOI視線データ: このイベントは参加者が特定のAOI（つまり4人のいずれか）を見たときに開始され、視線関連の値を記録します。
- 実験の終了: セッションを受け入れる/終了し、被験者が‘終了’ボタンをクリックするとデータを記録するイベントです。
イベント1: すべての視線データ
最初のイベントでは、次のことを達成したいと考えています:
- 研究の間ずっとすべてのアイ・トラッキングデータを記録する
- リアルタイムで画面に視線の検出位置を表示する（つまり、あなたが研究者としてデモを試すときにウェブカメラのトラッキングを把握できます）
トリガー
したがって、アイ・トラッキング視線トリガーを使用してこのイベントを開始します。
アクション
視線が検出されると、次のアクションが発生します: 最初に、先に作成したAll Gaze Data変数を呼び出しSet / Record Variableアクション内でデータを[X,Y,T,C]の配列として記録します。
上記は、以下のように緑のボタンをクリックし、ターゲット変数を選択し、鉛筆アイコンresult-select menuをクリックし、最後にトリガー固有の（アイ・トラッキング視線）メニューから[X,Y,T,C]の配列を選択することによって達成されます。
また、Set Object Propertyアクションを追加して赤い円オブジェクト（‘視線’と呼ばれる）を設定し、そのXプロパティを設定し、Yプロパティをそれぞれ座標XとYに設定します。言い換えれば、オブジェクトのxおよびy値をxおよびy座標と等しく設定します…最終的には、これによりオブジェクトがリアルタイムで動くようになります。
注意: Coordinate XおよびCoordinate Yのオプションは、トリガー固有の（アイ・トラッキング視線）メニューから選択されます。
イベント2: AOI視線データ
このイベントでは、次の数値が求められます:
- 視線が特定のAOI（つまりアップロードしたSVGオブジェクト）に対して記録されること
- AOIの特定のSVGノードデータが報告されること
トリガー
Eyetracking Gazeトリガーもここでトリガーとして使用されます。しかし、この文脈では、特定の要素にのみ関心があることを示すため、該当するオプションをクリックして4つのSVGオブジェクトを選択します。これらは興味のある領域（AOI）として機能しています。
アクション
各AOIに呼び出しを設定するには、Control Action → Requirement Action (If…Then)が必要です。基本的には、Labvancedに次のような処理を行うことを求めています…「参加者がAOI1を見ているとき、特定の変数にその特定のデータを記録し、その視線のSVGパスも記録したい」
最初に+ Requirementボタンをクリックすると、2つのペンアイコンの値が表示されます。
- 最初のペンアイコン: 最初のフィールドでは、トリガー固有の（アイ・トラッキング視線）メニューから
Stimulus Nameオプションを選択し、トリガー（この場合視線）があった刺激のオブジェクト名を使用します。 - 2番目のペンアイコン:
Constant Valueを選択し、次にStringオプションを選んでオブジェクト名（つまりAOI1）を入力します:
ここまでで、いつトリガー（視線）がAOI1という名前の刺激にあるときに…次のようになります:
- 以前に作成した変数
AOI_gaze_dataが[X,Y,T,C]の配列を記録します。 - また、
SVG1_path変数が記録され、Stimulus Infoを含むことになります。ここで、興味の対象（AOI1）がSVGの場合、刺激情報はSVGのノードを含むことになります。
次のAOIを指定するには、ダイアログボックスの+Add Else If Caseボタンを押し、上で示した通りに構造を繰り返しますが、主な違いはStimulus NameをAOI2として設定し、データを保存するための特定の変数、つまりAOI2_gaze_dataおよびSVG2_Pathを呼び出すことです。以下のように示されます:
次に、AOI3の場合、再びAdd Else If Caseを選択し、同じ構造に従いますが、この特定のAOIのデータを保存するために作成したカスタム変数を使用します:
再度、AOI4の場合、再びAdd Else If Caseを選び、同じ構造を繰り返しますが、この特定のAOIのデータを保存するために作成したカスタム変数を使用します:
イベント3: 実験の終了 / データの保存
最後に、データが記録され保存されるためには、Jump ActionをAccept / End Sessionアクションとして選択する必要があります。Finishボタンがクリックされたとき（これがトリガーです）に行われます。以下に示します。
トリガー
トリガーは、‘終了ボタン’が使用されたときに発生するように指定されています:
アクション
発生するアクションは、セッションが受け入れられ、結果としてデータが記録されることです。
記録されたデータ
記録されたデータには、すべてのカスタム変数に加え、タスク番号、セッション番号などの実験固有の値が含まれます。
以下の例では、Dataview & Exportタブが、時間系列ファイルで分離されたデータがどのように見えるかを示します。各時間系列変数（つまりすべての変更を記録する変数）は、以下の左側のパネルに自分のCSVファイルと共に表示されます。これは、Configure Export設定を使用して関連する設定を指定することにより達成できます。
_All Gaze Data.csv_が選択されると、以下に示すように多数の変数が記録されます。‘value’列は、値がカンマで区切られた[X,Y,T,C]配列をキャプチャします:
以下の画像は、視線がAOI1にあったときに具体的に記録された配列のプレビューを示しています。‘value’列に示されている通りです:
以下の画像は、視線がAOI1にあったときに具体的に記録されたSVGパスのプレビューを示しています。‘value’列に示されている通りです:
結論
このデモは、視線データを記録し、AOIで視線が発生する文脈でSVGオブジェクトを利用して視線を記録する方法を示すことを目的としています。
質問がある場合は、お気軽にお問い合わせください。特に実験の詳細について教えていただければ幸いです。フィージビリティチェックが必要な場合もご連絡ください！