labvanced logoLabVanced
  • Research
    • Publications
    • Researcher Interviews
    • Use Cases
      • Developmental Psychology
      • Linguistics
      • Clinical & Digital Health
      • Educational Psychology
      • Cognitive & Neuro
      • Social & Personality
      • Arts Research
      • Sports & Movement
      • Marketing & Consumer Behavior
      • Economics
      • HCI / UX
      • Commercial / Industry Use
    • Labvanced Blog
    • Services
  • Technology
    • Feature Overview
    • Code-Free Study Building
    • Eye Tracking
    • Mouse Tracking
    • Generative AI Integration
    • Multi User Studies
    • More ...
      • Reaction Time/Precise Timing
      • Text Transcription
      • Heart Rate Detection (rPPG)
      • Emotion Detection
      • Questionnaires/Surveys
      • Experimental Control
      • Data Privacy & Security
      • Desktop App
      • Mobile App
  • Learn
    • Guide
    • Videos
    • Walkthroughs
    • FAQ
    • Release Notes
    • Documents
    • Classroom
  • Experiments
    • Cognitive Tests
    • Sample Studies
    • Public Experiment Library
  • Pricing
    • Licenses
    • Top-Up Recordings
    • Subject Recruitment
    • Study Building
    • Dedicated Support
    • Checkout
  • About
    • About Us
    • Contact
    • Downloads
    • Careers
    • Impressum
    • Disclaimer
    • Privacy & Security
    • Terms & Conditions
    • Third-Party Licenses
  • Appgo to app icon
  • Logingo to app icon
Learn
ガイド
ビデオ
ウォークスルー
よくある質問
ニュースレターアーカイブ
ドキュメント
教室
  • 中國人
  • Deutsch
  • Français
  • Español
  • English
  • 日本語
ガイド
ビデオ
ウォークスルー
よくある質問
ニュースレターアーカイブ
ドキュメント
教室
  • 中國人
  • Deutsch
  • Français
  • Español
  • English
  • 日本語
  • ガイド
    • はじめに

      • タスクエディタ
      • フレーム
        • キャンバスフレーム
        • ページフレーム
        • ウェブサイトフレーム
      • トライアルタイムライン
      • 刺激提示
      • 応答の正確さ
      • オブジェクト
      • イベント
      • 変数
      • タスクウィザード
      • トライアルシステム
      • 実験デザイン
        • スタディの作成
        • データフレームパターン
        • マルチユーザー実験デザイン
    • 特集トピック

      • ランダム化とバランス
      • 視線追跡
        • 視線追跡タスクにおける刺激の提示
        • アイTrackingキャリブレーション設定の選び方
        • タスクにおける視線追跡の設定
        • 注視データの録画とエクスポート
        • 目のトラッキングのための形状を関心領域 (AOI) として使用する
        • 参加者キャリブレーション体験
      • Webブリッジ
        • ウェブサイトAOIの選択 | アンカー、調整、およびAOIトラッキングの検証
        • ウェブサイトのAOIでのマウス行動のトラッキング | Web Bridgeガイド
      • アンケート
      • デスクトップアプリ
      • サンプルスタディ
      • 参加者募集
      • APIアクセス
        • REST API
        • Webhook API
        • WebSocket API
      • その他のトピック

        • 正確な刺激タイミング
        • マルチユーザー研究
        • Labvancedにおけるヘッドトラッキング | ガイド
    • メインアプリタブ

      • 概要: メインタブ
      • ダッシュボード
      • 私の研究
      • 共有された研究
      • 私のファイル
      • 実験ライブラリ
      • 私のアカウント
      • ライセンスとサービス
    • スタディタブ

      • 概要: 研究特有のタブ
      • 研究デザイン
        • タスク
        • ブロック
        • セッション
        • グループ
      • タスクエディタ
        • タスクコントロール
        • 試行システム
        • フレームタイプ
        • オブジェクト
        • オブジェクトプロパティテーブル
        • 変数
        • システム変数テーブル
        • イベントシステム
        • テキストエディタの機能
        • タスクエディタにおける視線追跡オプション
        • タスクにおける頭追跡
        • マルチユーザー研究
      • 設定
      • 変数
      • メディア
      • テキストと翻訳
      • 開始と参加
      • 被験者管理
      • データビューとエクスポート
        • Dataview と変数 & タスクの選択 (古いバージョン)
        • 録音へのアクセス (古いバージョン)
  • ビデオ
    • ビデオ概要
    • Labvancedの始め方
    • タスクの作成
    • 要素ビデオ
    • イベントと変数
    • 高度なトピック
  • ウォークスルー
    • イントロダクション
    • ストループタスク
    • 語彙決定タスク
    • ポズナーの視線誘導タスク
    • 変化盲点フリッカーパラダイム
    • 眼球追跡サンプル研究
    • 乳幼児眼球追跡研究
    • マウストラッキングによる注意捕捉研究
    • 迅速な連続視覚提示
    • ChatGPT研究
    • 眼球追跡デモ: SVGをAOIとして
    • マルチユーザーデモ: 対象者のカーソルを表示
    • ゲームパッド/ジョイスティックコントローラー - 基本設定
    • EEG統合を持つデスクトップアプリ研究
    • 被験者間グループのバランシングと変数設定
    • マルチユーザー研究の構築
    • ウェブサイトフレーム眼球追跡ウォークスルー
    • 条件付きウェブカメラ眼球追跡
  • FAQ
    • 機能
    • サポートポリシーとガイドライン
    • セキュリティとデータプライバシー
    • ライセンス
    • Labvancedの精度
    • プログラムによる使用とAPI
    • Labvancedをオフラインで使用する
    • トラブルシューティング
    • 研究作成に関する質問
  • ニュースレターアーカイブ
  • ドキュメント
  • 教室
Labvanced Web Bridge拡張機能のヘッダーイラスト

Labvanced Web Bridge — 拡張機能サポートとガイド

Web Bridgeが初めてですか? ウェブサイトフレーム視線追跡ウォークスルーに従って、タスクの流れを始めから終わりまで体験し、ここに戻って完全な参照詳細を確認してください。

助けが必要ですか? [email protected]までご連絡ください。

目次

  • Labvanced Web Bridgeとは?
  • インストール
  • 誰がインストールすべきか?
  • 使用方法 — 研究者ガイド
  • 使用方法 — 参加者ガイド
  • 使用例
  • データとプライバシー
  • トラブルシューティング
  • よくある質問
  • お問い合わせとサポート

1. Labvanced Web Bridgeとは?

Labvanced Web Bridgeは、Labvanced実験プラットフォーム(labvanced.com)を実際のウェブサイトに接続するためのGoogle Chrome用のブラウザ拡張機能です。これにより、研究者は参加者が実際の第三者のウェブサイトと対話する制御されたUX研究と行動研究を実施することができ、Labvancedは目の動き(ウェブカメラを通じて)、マウスクリック、ホバーイベント、スクロール行動を記録します。

この拡張機能がないと、ブラウザは標準的なセキュリティ制限により、ウェブサイトを研究の中に埋め込むことを防ぎます。この拡張機能は、制御されたLabvanced研究セッション内でのみこれらの制限を解除し、埋め込まれたサイト上の参加者のインタラクションを測定するために必要な行動トラッキング機能を追加します。

Labvancedエディター内では、Website Frameを使用して埋め込みが行われ、これはCanvas FrameやPage Frameの他の2つのフレームタイプとは異なり、このために特別に構築された3番目のフレームタイプです。他のフレームタイプとどのように組み合わさるかについては、ウェブサイトフレームを確認してください。

LabvancedでChrome拡張機能を使用して埋め込まれたウェブサイト

2. インストール

ステップバイステップ

研究者

  1. Google Chromeに移動します。
  2. Labvanced Web BridgeのChromeウェブストアページにアクセスします。
  3. **「Chromeに追加」**をクリックします。
  4. 確認ダイアログで、**「拡張機能を追加」**をクリックします。
  5. Labvanced Web BridgeのアイコンがChromeのツールバーに表示されます。

ChromeにインストールされたLabvanced Web Bridge拡張機能

参加者

  1. インストールをクリックします。
  2. **「Chromeに追加」**をクリックします。
  3. 確認ダイアログで、**「拡張機能を追加」**をクリックします。
  4. 実験に戻り、ページを更新して研究を開始します。

拡張機能がアクティブであることの確認

研究者 インストール後、Dashboardタブに移動し、New Studyを作成します。下にスクロールして、チェックボックスをオンにしてTrack External Website:を有効にし、対象のウェブサイトのURLを入力します。拡張機能が正しくインストールされている場合、Labvancedエディターには緑のチェックマークと確認メッセージが表示されます。

Labvancedで新しい研究を作成した際にWeb Bridge拡張機能がインストールされていることを確認する緑の確認メッセージ

参加者

実験ページを更新すると、実験が進行します。

参加者にChrome拡張機能をインストールするよう促すメッセージ

3. 誰がインストールすべきか?

研究者

次の場合には拡張機能をインストールしてください:

  • 実際のウェブサイトを刺激として含む研究を設計している場合(例:製品ページ、ニュース記事、キオスクインターフェイスのテスト)。
  • LabvancedエディターでWebsite Frame要素を使用している場合。
  • 外部ウェブサイトを含む研究のプレビューまたはパイロットを行っている場合。

標準的なLabvanced刺激(画像、動画、テキスト、フォームなど)のみを使用する研究や、HTTPヘッダーを直接編集および制御できるウェブサイトの所有者である場合、この拡張機能は必要ありません。

研究参加者

次の場合には拡張機能をインストールしてください:

  • 研究リンクを受け取り、開始前にインストールするよう指示された場合。
  • 研究のオンボーディングページで拡張機能がインストールされていることを確認するよう求められた場合。

必要かどうかわからない場合は、研究リンクページが研究開始前にお知らせします。

4. 使用方法 — 研究者ガイド

4.1 研究にウェブサイトフレームを追加する

  1. Labvancedエディターで実験を開きます。
  2. Trial Timelineの下で、+ Websiteフレームオプションをクリックします。
  3. 要素タイプから**「ウェブサイトフレーム」**を選択し、次にExternal Websiteオプションを選択します。拡張機能がアクティブな場合、緑の確認メッセージが表示されます。それ以外の場合は、上記のインストール手順を参照してください。
  4. 前のステップでタスクを作成する際に指定したウェブサイトが自動的に表示されます。

4.2 興味のある領域(AOI)の選択

興味のある領域(AOI)は、埋め込まれたウェブサイト上でトラッキングしたい特定の要素です。たとえば、製品画像、見出し、または「カートに追加」ボタンなどです。

自動検出はありません:Labvancedは埋め込まれたウェブサイトのHTMLやコンテナのマークアップを読み取って、研究に関する要素を推測することはありません。各AOIはエディター内での手動クリックおよびアンカー操作です。AOI自体はデータを記録しません。視線キャプチャにはその上に構築された明示的なEyetracking Gazeイベントが必要です。設定方法については、視線データの記録:イベントを追加を参照してください。

  1. エディターでウェブサイトフレームがアクティブで、ウェブサイトが対話的な形で表示されている状態で、サイドメニューからAdd Website AOIオブジェクトをクリックします。
  2. AOIオブジェクトが追加され、赤で表示されます。目標のAOIをクリックします。選択は緑になります。
  • Pick Elementがあなたが意図した正確な要素にアンカーしない場合や、既存のAOIのターゲット、サイズ、または位置を調整したい場合は、ウェブサイトAOIの選択と調整を参照して、Parent/Child/Prev/Nextのナビゲーションコントロール、サイズと位置のオフセット、Text Filter、Scrollable container、および公開前にAOIが実際にアンカーされているかどうかを確認してください。
  • また、Resolutionオプションを使用して、研究がデスクトップ用かモバイル用かを示すこともできます。以下の画像ではモバイルが選択され、AOIが自動的に更新されました。
  1. 追加の要素についても繰り返します。
  2. 各AOIはAOIリストに表示されます。AOI単体ではデータを記録しません。上記の説明に従ってEyetracking Gazeイベントを追加してキャプチャを開始します。

モバイルベースのウェブサイト埋め込みおよびAOIプレビュー

4.3 追跡される内容

研究セッション中の各AOIについて、Labvancedは研究者に行動データを記録するための次の可能性を提供します:

データタイプ説明
要素の位置画面上の要素の境界ボックス(x、y、幅、高さ)で、参加者がスクロールする際にリアルタイムで更新されます。
視線データ要素の位置にマッピングされたウェブカメラによる視線追跡(研究設定で視線追跡を有効にする必要があります)
クリックイベント参加者が要素内でクリックしたかどうか、およびその位置
ホバーイベント参加者のマウスが要素内に入ったときと出たとき
マウス移動参加者がページ上を移動する際のマウス座標
スクロール位置各時点でのページスクロールオフセット

4.4 研究のプレビュー

公開する前に、拡張機能がインストールされている状態で常に研究をプレビューして、次のことを確認します:

  • ウェブサイトがフレーム内で正しく読み込まれる。
  • AOIが期待通りに機能している。

最初にタスクを保存し、その後、Task Controlsの下にあるエディターツールバーの**「プレビュー」**再生ボタンをクリックして、特定のタスクの参加者ビューのプレビューを開きます。

4.5 公開と共有

研究が準備できたら:

  1. Launch & Participateタブに移動します。
  2. Activateボタンをクリックして、研究のデータ記録を有効にします。
  3. Online Participation / Study Publishedの下でPublish.をクリックします。
  4. Online Participation Linkをコピーして、参加者と共有します。

5. 使用方法 — 参加者ガイド

研究の前に

  1. 研究者からLabvanced研究の直接リンクを受け取ります。
  2. 拡張機能がまだインストールされていない場合、研究ページにはChromeウェブストアへの直接リンクを伴うインストールプロンプトが表示されます。
  3. 拡張機能をインストールし、研究リンクに戻ってページをリフレッシュします。
  4. 研究が拡張機能のインストールを確認したら、Startをクリックして開始します。

研究中

  • 提示されたウェブサイトを通常通りに使用して対話します:指示に従ってブラウズ、クリック、スクロールしてください。
  • 拡張機能はバックグラウンドで静かに動作します。対話する必要はありません。
  • 研究中に拡張機能のアイコンをクリックしないでください。必要ありません。

研究の後に

  • プロンプトがある場合は、研究後の質問に回答してください。
  • 研究が終了したら、もはや必要がない場合は拡張機能をアンインストールできます:
    • ツールバーの拡張機能アイコンを右クリック → 「Chromeから削除」。

LabvancedのChrome拡張機能を削除する。

6. 使用例

6.1 EコマースUXリサーチ

商品リストやチェックアウトページを埋め込む。参加者が注視する商品画像、クリックする「カートに追加」ボタン、決定を下す前にどれだけスクロールするかを追跡します。

Labvancedに埋め込まれた書店のウェブサイトの例

6.2 ニュース&メディアの注目研究

ニュース記事やホームページを埋め込む。最も注目を集める見出し、記事の長さによる読書パターンの変化、最初に目を引く画像を測定します。

Labvancedに埋め込まれたニュースウェブサイトの例

6.3 ナビゲーションと情報アーキテクチャのテスト

ウェブサイトのナビゲーションメニューまたはマルチページフローを埋め込む。クリックとホバーの滞在時間を記録して、メニューラベルの明確さや見つけやすさを評価します。

6.4 比較研究 (A/B)

異なるウェブサイトバージョンを埋め込んだ2つの試行を作成します。Labvancedの組み込みの逆バランス機能を使用して条件間で参加者を無作為に分けます。グループ間でAOIメトリクスを比較します。

7. データとプライバシー

拡張機能はどのようなデータを収集しますか?

拡張機能は、アクティブなLabvanced研究セッション内にいるときのみ、以下の情報を収集します:

  • 研究者によって選択されたページ要素のバウンディングボックス位置 (x, y, 幅, 高さ)
  • マウス座標、クリック位置、ホバーイベント、マウス移動パス
  • 現在のページのスクロール位置とページURL
  • ホバーまたはクリックされた要素からの可視テキストスニペット(50文字に切り詰め)

パスワードフィールドや敏感なフォーム入力は決して読み取られません。 拡張機能は<input type="password">および敏感なオートコンプリート属性を持つ入力(autocomplete="password"、cc-*)を明示的に除外します。これらはすべての場合において空の値を返します。

データはどこに行きますか?

すべてのデータは、埋め込みされたlabvanced.comページにのみブラウザのpostMessage APIを介して送信されます。拡張機能は外部サーバーにデータを送信せず、ローカルに何も保存せず、Labvanced研究以外の日常のブラウジング中にデータを収集しません。

拡張機能は他のウェブサイトで私を追跡しますか?

いいえ。拡張機能のコンテンツスクリプトは、すべてのiframeに挿入されます(ターゲットウェブサイトのドメインは事前に分からないため)が、location.ancestorOriginsがlabvanced.comが祖先フレームであることを確認しない限り、すぐに退出します。Labvancedによって埋め込まれていないウェブサイトでは、リスナーはインストールされず、DOMは読み込まれず、データの流れはありません。

拡張機能はLabvanced以外の何かを変更しますか?

いいえ。拡張機能は、labvanced.comのトップレベルURLを持つブラウザタブでのみiframeの埋め込み制限(X-Frame-Options / Content-Security-Policyヘッダー)を削除します。他のすべてのタブには完全に影響を与えません。これらのルールはメモリ内にのみ保存され、タブが閉じたり、別のページに移動したりすると削除されます。

完全なプライバシーポリシー

完全なプライバシーポリシーは次のリンクでご覧いただけます: https://www.labvanced.com/extension-privacy-policy.html

8. トラブルシューティング

研究でウェブサイトが読み込まれない

考えられる原因と修正:

症状考えられる原因修正
空白の白いフレーム拡張機能がインストールされていないまたは無効chrome://extensionsで拡張機能が有効になっていることを確認してください
ウェブサイトがインタラクティブまたは応答しないサイトがJSレベルでiframeの埋め込みを検出しています一部のサイトは埋め込むことができません。[email protected]までご連絡ください

拡張機能のアイコンに警告が表示される、またはグレーアウトしている

  • アイコンをクリックしてポップアップを開き、ステータスメッセージを読みます。
  • labvanced.comのページにいるか、Labvanced研究が開いていることを確認します。
  • chrome://extensionsから拡張機能を無効にして再度有効にしてみてください。

要素ピッカーが要素をハイライトしない

  • 拡張機能が有効で、エディタにいる(プレビューモードではない)ことを確認してください。
  • 一部のウェブサイトは、要素の選択を制限するShadow DOMまたはiframe内のiframe構造を使用しています。Parent要素をObject Propertiesパネル経由で選択してみてください。
  • エディタをリフレッシュして再試行してください。

9. よくある質問

Q: 拡張機能は無料ですか? A: はい。拡張機能は無料でインストールおよび使用できます。研究をデザインするにはLabvancedアカウントが必要です。

Q: 他のブラウザ(Firefox、Safari、Edge)でも動作しますか? A: 現在、サポートされているのはGoogle Chromeのみです。Microsoft Edge(Chromiumベース)は動作するかもしれませんが、公式にサポートされているわけではありません。

Q: 研究の後に拡張機能をインストールしたままにする必要がありますか? A: いいえ。参加者は研究を完了した後すぐにアンインストールできます。拡張機能アイコンを右クリック → "Chromeから削除"。

Q: 拡張機能は私のブラウザを遅くしますか? A: 拡張機能はLabvancedセッションの外では非アクティブです。通常のブラウジングにオーバーヘッドを追加しません。

Q: 私のパスワードや銀行情報を見られますか? A: いいえ。パスワードフィールド(<input type="password">)やクレジットカード入力は明示的に除外され、すべての場合において空の値を返します。拡張機能は敏感なフォームデータを読み取ったり伝送したりすることはありません。

Q: 研究者として、参加者が訪問しているウェブサイトを追跡するためにこれを使用できますか? A: いいえ。拡張機能はlabvanced.comによって埋め込まれたiframeの内部でのみアクティブになります。他のタブで参加者が独自に訪問するウェブサイトを追跡することはできません。

Q: 私の所属機関のITポリシーにより、従業員がインストールする前に拡張機能のレビューが必要です。誰に連絡できますか? A: お問い合わせは[email protected]まで。

10. お問い合わせ&サポート

メール: [email protected]

ドキュメンテーション: https://www.labvanced.com/content/learn/ja/guide/

Discordのコミュニティフォーラム: https://discord.com/invite/SBpFJnVZah

バグレポート: 次の情報を含めてください:

  • Chromeのバージョン (chrome://settings/help)
  • 埋め込もうとしているウェブサイトのURL
  • エラーメッセージのスクリーンショット
  • 問題を再現するための手順



Labvanced Web BridgeはScicovery GmbHによって開発および維持されています。完全なプライバシーポリシーは次のリンクでご覧いただけます: https://www.labvanced.com/extension-privacy-policy.html

Prev
視線追跡
Next
アンケート