Labvanced Web Bridge — 拡張機能サポート & ガイド
助けが必要ですか? [email protected]までお問い合わせください
目次
1. Labvanced Web Bridgeとは何ですか?
Labvanced Web Bridgeは、Labvanced実験プラットフォーム(labvanced.com)とリアルなウェブサイトを接続するGoogle Chrome用のブラウザ拡張機能です。これにより、研究者は参加者が実際のサードパーティのウェブサイトと対話する管理されたUX研究や行動研究を行うことができ、Labvancedが目の動き(ウェブカメラを介して)、マウスクリック、ホバイベント、スクロールの挙動を記録します。
この拡張機能なしでは、ブラウザは標準のセキュリティ制限により、ウェブサイトを研究に埋め込むことを防ぎます。この拡張機能は、Labvancedの管理された研究セッション内のみでこれらの制限を解除し、埋め込まれたサイト上での参加者の相互作用を測定するために必要な行動トラッキング機能を追加します。

2. インストール
ステップバイステップ
研究者
- Google Chromeに移動します。
- Labvanced Web BridgeのChrome Webストアのページにアクセスします。
- **「Chromeに追加」**をクリックします。
- 確認ダイアログで**「拡張機能を追加」**をクリックします。
- Labvanced Web BridgeのアイコンがChromeツールバーに表示されます。

参加者
- インストールをクリックします。
- **「Chromeに追加」**をクリックします。
- 確認ダイアログで**「拡張機能を追加」**をクリックします。
- 実験に戻り、ページを更新して研究を開始します。
拡張機能がアクティブであることの確認
研究者 インストール後、Dashboardタブに移動し、New Studyを作成します。スクロールダウンして、ボックスにチェックを入れてTrack External Website:を有効にし、ターゲットウェブサイトのURLを入力します。拡張機能が正しくインストールされている場合、Labvancedエディタには緑のチェックマークと確認メッセージが表示されます。

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

3. 誰がこれをインストールするべきですか?
研究者
以下の場合は拡張機能をインストールしてください:
- 実際のウェブサイトを刺激として含む研究を設計している(例えば、製品ページ、ニュース記事、キオスクインターフェースのテスト)。
- Labvancedエディタで
Website Frame要素を使用している。 - 外部ウェブサイトを含む研究をプレビューまたはパイロットしている。
標準的なLabvanced刺激(画像、動画、テキスト、フォームなど)のみを使用する研究や、自身のウェブサイトのHTTPヘッダーを直接編集および制御できるウェブサイトの所有者である場合、この拡張機能は必要ありません。
研究参加者
以下の場合は拡張機能をインストールしてください:
- 研究リンクを受け取り、開始前にインストールするよう指示された。
- 研究のオンボーディングページが拡張機能のインストールを確認するよう求めている。
必要かどうか不明な場合は、研究リンクページが研究開始前に教えてくれます。
4. 使用方法 — 研究者ガイド
4.1 あなたの研究にウェブサイトフレームを追加する
- Labvancedエディタであなたの実験を開きます。
Trial Timelineの下で、+ Websiteフレームオプションをクリックします。- 要素タイプから**「ウェブサイトフレーム」**を選択し、その後
External Websiteオプションを選択します。拡張機能がアクティブである場合は、緑の確認メッセージが表示されます。そうでない場合は、上記のインストール手順を参照してください。 - 以前のステップでタスクを作成した際に指定したウェブサイトが自動的に表示されます。
4.2 興味のある領域(AOI)の選択
興味のある領域(AOI)は、埋め込まれたウェブサイト上で追跡したい特定の要素です。例えば、製品画像、見出し、「カートに追加」ボタンなどです。
- エディタでウェブサイトフレームがアクティブで、ウェブサイトが対話的に表示されている状態で、サイドメニューから
Add Website AOIオブジェクトをクリックします。 - AOIオブジェクトが追加され、赤で表示されます。ターゲットAOIをクリックします。選択が緑に変わります。
- AOIの選択を修正する場合、オブジェクトプロパティパネルを使用して、選択部分の
Parentを指して上に移動し、ウェブサイトのより大きな部分を選択するか、選択部分のChildを指してより具体的なコンポーネントを選択できます。AOIが固定されて(緑に表示される)状態になったら、x座標とy座標の各サイドのピクセルを増減してサイズオフセットを拡大または縮小したり、位置を変更したりできます。 Resolutionオプションを使用して、研究がデスクトップ用かモバイル用かを示すこともできます。以下の画像ではモバイルが選択され、AOIが自動的に更新されました。
- 追加の要素についても繰り返します。
- 各AOIはAOIリストに表示され、研究中に自動的に追跡されます。

4.3 追跡されるもの
研究セッション中の各AOIについて、Labvancedは研究者に以下の行動データの記録の可能性を提供します:
| データタイプ | 説明 |
|---|---|
| 要素位置 | スクリーン上の要素の境界ボックス(x, y, 幅, 高さ)、参加者がスクロールする際にリアルタイムで更新 |
| 視線データ | 要素の位置にマッピングされたウェブカメラベースの視線追跡(研究設定で視線追跡が有効である必要があります) |
| クリックイベント | 参加者が要素内でクリックしたかどうかとその位置 |
| ホバーイベント | 参加者のマウスが要素に入ったり出たりしたとき |
| マウス移動 | 参加者がページ上を移動する際のマウス座標 |
| スクロール位置 | 各瞬間のページスクロールオフセット |
4.4 研究をプレビューする
公開する前に、拡張機能がインストールされていることを確認するため、研究を必ずプレビューしてください:
- ウェブサイトがフレーム内で正しく読み込まれること。
- AOIが期待通りに機能すること。
タスクを最初に保存し、次にTask Controlsの下にあるエディタツールバーで**「プレビュー」**再生ボタンをクリックして、特定のタスクの参加者ビューのプレビューを開きます。
4.5 公開と共有
研究が準備できたら:
Launch & Participateタブに移動します。Activateボタンをクリックして研究のデータ録音を有効にします。Online Participation / Study Publishedの下で、Publish.をクリックします。Online Participation Linkをコピーして参加者と共有します。
5. 使用方法 — 参加者ガイド
研究の前に
- 研究者からLabvanced研究の直接リンクを受け取ります。
- 拡張機能がまだインストールされていない場合、研究ページにはChrome Webストアへの直接リンクがあるインストールのプロンプトが表示されます。
- 拡張機能をインストールし、研究リンクに戻り、ページを更新します。
- 研究が拡張機能がインストールされていることを確認したら、
Startをクリックして開始します。
研究中
- 通常通りに示されたウェブサイトを使用し、インタラクトしてください — 指示に従ってブラウズ、クリック、スクロールします。
- 拡張機能はバックグラウンドで静かに動作します。あなたがそれにインタラクトする必要はありません。
- 研究中に拡張機能のアイコンをクリックしないでください — それは必要ありません。
研究後
- プロンプトが表示された場合は、任意の研究後の質問に答えてください。
- 研究が終了したら、もはや必要がない場合は拡張機能をアンインストールできます:
- ツールバーの拡張機能アイコンを右クリック → 「Chromeから削除」。

6. 使用例
6.1 EコマースUXリサーチ
商品リストまたはチェックアウトページを埋め込んでください。参加者が注目する商品画像、クリックする「カートに追加」ボタン、決定する前にどれくらいスクロールするかを追跡します。

6.2 ニュース & メディアの注意研究
ニュース記事またはホームページを埋め込んでください。どの見出しが最も注意を引くか、記事の長さによって読みパターンがどのように変わるか、どの画像が最初に目を引くかを測定します。

6.3 ナビゲーション & 情報アーキテクチャテスト
ウェブサイトのナビゲーションメニューまたはマルチページフローを埋め込んでください。クリックスルーとホバーメニューの持続時間を記録して、メニューラベルの明瞭さと見つけやすさを評価します。
6.4 比較研究 (A/B)
異なるウェブサイトのバージョンを埋め込んだ二つの試行を作成します。Labvancedの組み込みのカウンターバランスを使用して、条件に参加者をランダム化します。グループ間でAOIメトリクスを比較します。
7. データ & プライバシー
拡張機能は何のデータを収集するのか?
拡張機能は、アクティブなLabvanced研究セッション内にいるときのみ、以下のデータを収集します:
- 研究者が選択したページ要素のバウンディングボックス位置(x, y, 幅, 高さ)
- マウス座標、クリック位置、ホバーイベント、およびマウスの移動パス
- 現在のページスクロール位置とページURL
- ホバー/クリックした要素からの可視テキストスニペット(50文字に切り捨て)
パスワードフィールドや敏感なフォーム入力は一切読み取られません。 拡張機能は、<input type="password">および敏感なオートコンプリート属性を持つ入力(autocomplete="password", cc-*)を明示的に除外します。これらはすべてのケースで空の値を返します。
データはどこに行くのか?
すべてのデータは、ブラウザのpostMessage APIを介して、埋め込まれたlabvanced.comページにのみ送信されます。拡張機能は外部サーバーにデータを送信せず、ローカルに何かを保存せず、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をご覧ください。