Labvanced Web Bridge — Erweiterungsunterstützung & Anleitung

Neu bei Web Bridge? Folgen Sie der Website Frame Eye Tracking-Anleitung für einen Schritt-für-Schritt-Workflow, und kommen Sie dann hierher für detaillierte Referenzinformationen.

Hilfe benötigt? Kontaktieren Sie uns unter [email protected]

1. Was ist Labvanced Web Bridge?

Labvanced Web Bridge ist eine Browsererweiterung für Google Chrome, die die Labvanced-Experimentplattform (labvanced.com) mit echten Websites verbindet. Sie ermöglicht Forschenden, kontrollierte UX-Studien und Verhaltensforschung durchzuführen, bei denen die Teilnehmenden mit lebenden, externen Websites interagieren, während Labvanced Augenbewegungen (über Webcam), Mausklicks, Hover-Ereignisse und Scrollverhalten aufzeichnet.

Ohne diese Erweiterung verhindern Browser, dass Websites in Forschungsstudien eingebettet werden, aufgrund von Standardsicherheitsbeschränkungen. Die Erweiterung hebt diese Beschränkungen nur innerhalb kontrollierter Labvanced-Forschungssitzungen auf und fügt die Verhaltensverfolgungsfähigkeiten hinzu, die benötigt werden, um die Interaktion der Teilnehmenden mit der eingebetteten Website zu messen.

Warum diese Unterscheidung wichtig ist, reale aufgezeichnete Klicks und Blick versus eine KI-vorhergesagte Schätzung, wo die Aufmerksamkeit gehen könnte, siehe KI kann vorhersagen, wo Sie schauen werden. Sie weiß immer noch nicht, was Sie tun werden.

Im Labvanced-Editor erfolgt die Einbettung über das Website Frame, einen dritten Rahmentyp neben Canvas Frame und Page Frame, der speziell dafür gedacht ist, und nicht als Variante der anderen beiden. Siehe Website Frame für Informationen, wie es sich zu den anderen Rahmentypen verhält.

2. Installation

Schritt-für-Schritt

Forschende

1. Navigieren Sie zu Google Chrome.
2. Gehen Sie zur Chrome Web Store-Seite für Labvanced Web Bridge.
3. Klicken Sie auf "Zu Chrome hinzufügen".
4. Klicken Sie im Bestätigungsdialog auf "Erweiterung hinzufügen".
5. Sie werden sehen, dass das Labvanced Web Bridge-Symbol in Ihrer Chrome-Symbolleiste erscheint.

Teilnehmende

1. Klicken Sie auf Installieren
2. Klicken Sie auf "Zu Chrome hinzufügen".
3. Klicken Sie im Bestätigungsdialog auf "Erweiterung hinzufügen".
4. Kehren Sie zum Experiment zurück und aktualisieren Sie die Seite, um die Studie zu beginnen.

Bestätigung, dass die Erweiterung aktiv ist

Forschende Nach der Installation navigieren Sie zum Dashboard-Tab und erstellen Sie eine New Study. Scrollen Sie nach unten und aktivieren Sie Track External Website:, indem Sie das Kontrollkästchen aktivieren und die URL der Zielwebsite eingeben. Wenn die Erweiterung korrekt installiert ist, zeigt der Labvanced-Editor ein grünes Häkchen und eine Bestätigungsnachricht an.

Teilnehmende

Nach dem Aktualisieren der Versuchsseite wird das Experiment fortgesetzt.

3. Wer sollte dies installieren?

Forschende

Installieren Sie die Erweiterung, wenn Sie:

• Eine Studie entwerfen, die eine echte Website als Stimulus umfasst (z.B. Test einer Produktseite, eines Nachrichtenartikels, einer Kioskoberfläche).
• Das Website Frame-Element im Labvanced-Editor verwenden.
• Eine Studie, die externe Websites umfasst, vorab anzeigen oder testen.

Sie benötigen nicht diese Erweiterung für Studien, die nur Standardstimuli von Labvanced (Bilder, Videos, Texte, Formulare usw.) verwenden oder wenn Sie der Websitebesitzer sind, der direkt die HTTP-Header für Ihre Website bearbeiten und steuern kann.

Studien-Teilnehmende

Installieren Sie die Erweiterung, wenn:

• Sie einen Studienlink erhalten haben und angewiesen wurden, ihn vor dem Start zu installieren.
• Die Onboarding-Seite der Studie Sie auffordert, zu bestätigen, dass die Erweiterung installiert ist.

Wenn Sie sich nicht sicher sind, ob Sie sie benötigen, wird Ihre Studienlinkseite Ihnen dies sagen, bevor die Studie beginnt.

4. Wie man es benutzt — Anleitung für Forschende

4.1 Hinzufügen eines Website-Rahmens zu Ihrer Studie

1. Öffnen Sie Ihr Experiment im Labvanced-Editor.
2. Klicken Sie unter dem Trial Timeline auf die + Website-Rahmenoption.
3. Wählen Sie "Website Frame" aus den Elementtypen aus, dann die External Website-Option. Wenn die Erweiterung aktiv ist, erscheint die grüne Bestätigungsnachricht. Andernfalls verweisen Sie bitte auf den oben genannten Abschnitt zum Installationsverfahren.
4. Die Website, die Sie beim Erstellen der Aufgabe im vorherigen Schritt angegeben haben, wird jetzt automatisch angezeigt.

4.2 Auswahl von Interessengebieten (AOIs)

Interessengebiete (AOIs) sind die spezifischen Elemente auf der eingebetteten Website, die Sie verfolgen möchten. Zum Beispiel ein Produktbild, eine Überschrift oder ein "In den Warenkorb"-Button.

Es gibt keine automatische Erkennung: Labvanced liest niemals den eigenen HTML- oder Container-Markup der eingebetteten Website, um zu erraten, welche Elemente für Ihre Studie wichtig sind. Jedes AOI ist eine manuelle Klick- und Ankeraktion im Editor. Ein AOI allein zeichnet auch keine Daten auf, die Blickerfassung erfordert ein explizites Eyetracking Gaze-Ereignis, das darauf aufgebaut ist, siehe Blickdaten aufzeichnen: Ereignisse hinzufügen in der Anleitung für den Website-Rahmen, um zu erfahren, wie man es einrichtet.

1. Mit dem aktiven Website-Rahmen im Editor und der Website, die interaktiv angezeigt wird, klicken Sie auf das Add Website AOI-Objekt im Seitenmenü.
2. Das AOI-Objekt wird hinzugefügt und erscheint in Rot. Klicken Sie auf Ihr Ziel-AOI. Die Auswahl wird nun grün.

• Wenn Pick Element nicht an das genaue Element anheftet, das Sie gemeint haben, oder wenn Sie ein bestehendes AOI-Ziel, Größe oder Position anpassen möchten, siehe Auswahl und Anpassung von Website-AOIs für die vollständige Referenz zu den Parent/Child/Prev/Next-Navigationssteuerungen, Größen- und Positionsverschiebungen, Text Filter, Scrollable container, und Überprüfung, ob ein AOI tatsächlich verankert ist, bevor Sie es veröffentlichen.
• Sie können auch die Resolution-Option verwenden, um anzugeben, ob die Studie für Desktop oder Mobilgeräte gedacht sein soll. Im Bild unten wurde Mobil ausgewählt und die AOIs wurden automatisch aktualisiert.

3. Wiederholen Sie dies für zusätzliche Elemente.
4. Jedes AOI erscheint in der AOI-Liste. Allein wird es keine Daten aufzeichnen, fügen Sie ein Eyetracking Gaze-Ereignis wie oben beschrieben hinzu, um mit der Erfassung zu beginnen.

4.3 Was wird verfolgt

Für jedes AOI während einer Studierendensitzung bietet Labvanced Forschenden die folgenden Möglichkeiten zur Aufzeichnung von Verhaltensdaten:

4.4 Vorschau Ihrer Studie

Vor der Veröffentlichung sollten Sie Ihre Studie immer mit der installierten Erweiterung in der Vorschau anzeigen, um zu bestätigen:

• Die Website wird korrekt im Rahmen geladen.
• AOIs funktionieren wie erwartet.

Zuerst speichern Sie die Aufgabe, klicken Sie dann auf die "Vorschau"-Schaltfläche im Editor-Toolbar unter Task Controls, um eine Vorschau der Teilnehmeransicht der spezifischen Aufgabe zu öffnen.

4.5 Veröffentlichen und Teilen

Sobald Ihre Studie bereit ist:

1. Gehen Sie zum Launch & Participate Tab.
2. Klicken Sie auf die Activate-Schaltfläche, um die Datenaufzeichnungen für Ihre Studie zu aktivieren.
3. Klicken Sie unter Online Participation / Study Published auf Publish.
4. Kopieren Sie den Online Participation Link und teilen Sie ihn mit Ihren Teilnehmern.

5. Nutzung — Teilnehmerleitfaden

Vor der Studie

1. Sie erhalten von dem Forscher einen direkten Link zu einer Labvanced-Forschungsstudie.
2. Falls die Erweiterung noch nicht installiert ist, wird die Studienseite eine Installationsaufforderung mit einem direkten Link zum Chrome Web Store anzeigen.
3. Installieren Sie die Erweiterung, kehren Sie dann zum Studienlink zurück und aktualisieren Sie die Seite.
4. Sobald die Studie bestätigt, dass die Erweiterung installiert ist, klicken Sie auf Start, um zu beginnen.

Während der Studie

• Verwenden und interagieren Sie mit der Ihnen angezeigten Website, wie Sie es normalerweise tun würden: durchstöbern, klicken und scrollen Sie wie angewiesen.
• Die Erweiterung funktioniert lautlos im Hintergrund. Sie müssen nicht mit ihr interagieren.
• Klicken Sie während der Studie nicht auf das Erweiterungssymbol. Es ist nicht notwendig.

Nach der Studie

• Beantworten Sie alle Post-Studi-Fragen, falls dies angezeigt wird.
• Sobald die Studie endet, können Sie die Erweiterung deinstallieren, wenn Sie sie nicht mehr benötigen:
  • Klicken Sie mit der rechten Maustaste auf das Erweiterungssymbol in der Toolbar → "Von Chrome entfernen".

6. Anwendungsfälle

6.1 E-Commerce UX-Forschung

Binden Sie eine Produktliste oder eine Checkout-Seite ein. Verfolgen Sie, auf welche Produktbilder die Teilnehmer fixiert, auf welche "In den Warenkorb"-Schaltflächen sie klicken und wie weit sie scrollen, bevor sie eine Entscheidung treffen.

6.2 Studien zur Medienaufmerksamkeit

Binden Sie einen Nachrichtenartikel oder eine Homepage ein. Messen Sie, welche Überschriften die meiste Aufmerksamkeit erregen, wie die Lesegewohnheiten je nach Artikellänge variieren und welche Bilder zuerst ins Auge fallen.

6.3 Tests zur Navigation & Informationsarchitektur

Binden Sie das Navigationsmenü oder den mehrseitigen Flow einer Website ein. Zeichnen Sie Klicks und Verweildauern beim Überfahren auf, um die Klarheit und Auffindbarkeit von Menübezeichnungen zu bewerten.

6.4 Vergleichsstudien (A/B)

Erstellen Sie zwei Versuche mit verschiedenen eingebetteten Website-Versionen. Randomisieren Sie die Teilnehmer über die Bedingungen mithilfe der integrierten Gegenbalancierung von Labvanced. Vergleichen Sie die AOI-Metriken zwischen den Gruppen.

7. Daten & Datenschutz

Welche Daten sammelt die Erweiterung?

Die Erweiterung sammelt die folgenden nur wenn Sie sich in einer aktiven Labvanced-Forschungssitzung befinden:

• Bounding-Box-Positionen (x, y, Breite, Höhe) von vom Forscher ausgewählten Seitenelementen
• Mauskoordinaten, Klickpositionen, Hover-Ereignisse und Mausbewegungspfade
• Die aktuelle Seiten-Scrollposition und die Seiten-URL
• Sichtbare Textausschnitte von überfahrenen/gklickten Elementen (auf 50 Zeichen gekürzt)

Passwortfelder und sensible Formulareingaben werden niemals gelesen. Die Erweiterung schließt ausdrücklich <input type="password"> und Eingaben mit sensiblen Autocomplete-Attributen (autocomplete="password", cc-*). Diese geben in allen Fällen leere Werte zurück.

Wo gehen die Daten hin?

Alle Daten werden ausschließlich an die eingebettete labvanced.com-Seite über die postMessage-API des Browsers übertragen. Die Erweiterung sendet keine Daten an externe Server, speichert nichts lokal und sammelt während des normalen Surfens außerhalb einer Labvanced-Studie keine Daten.

Verfolgt die Erweiterung mich auf anderen Websites?

Nein. Die Inhalts-Skripte der Erweiterung werden in alle iFrames injiziert (da die Domain der Zielwebsite im Voraus nicht bekannt sein kann), aber sie verlassen sofort, es sei denn, location.ancestorOrigins bestätigt, dass labvanced.com ein übergeordneter Frame ist. Auf einer Website, die nicht von Labvanced eingebettet ist, werden keine Listener installiert, kein DOM gelesen und es fließen keine Daten.

Verändert die Erweiterung etwas außerhalb von Labvanced?

Nein. Die Erweiterung entfernt iframe-Einbettungsbeschränkungen (X-Frame-Options / Content-Security-Policy-Header) nur in Browser-Tabs, deren oberste URL labvanced.com ist. Alle anderen Tabs sind vollständig unangetastet. Diese Regeln werden nur im Speicher gespeichert und werden entfernt, wenn der Tab geschlossen oder zu einer anderen Seite navigiert wird.

Vollständige Datenschutzrichtlinie

Siehe die vollständige Datenschutzerklärung unter: https://www.labvanced.com/extension-privacy-policy.html

8. Fehlerbehebung

Die Website lädt in meiner Studie nicht

Mögliche Ursachen und Lösungen:

Das Erweiterungssymbol zeigt eine Warnung oder ist grau

• Klicken Sie auf das Symbol, um das Popup zu öffnen und die Statusmeldung zu lesen.
• Stellen Sie sicher, dass Sie sich auf einer labvanced.com-Seite oder in einer geöffneten Labvanced-Studie befinden.
• Versuchen Sie, die Erweiterung von chrome://extensions zu deaktivieren und wieder zu aktivieren.

Der Elementauswähler hebt keine Elemente hervor

• Stellen Sie sicher, dass die Erweiterung aktiviert ist und Sie sich im Editor befinden (nicht im Vorschau-Modus).
• Einige Websites verwenden Shadow DOM oder iframe-in-iframe-Strukturen, die das Auswählen von Elementen einschränken. Versuchen Sie, ein Parent-Element über das Object Properties-Panel auszuwählen.
• Aktualisieren Sie den Editor und versuchen Sie es erneut.

9. Häufig gestellte Fragen

F: Ist die Erweiterung kostenlos? A: Ja. Die Erweiterung ist kostenlos zu installieren und zu verwenden. Ein Labvanced-Konto ist erforderlich, um Studien zu entwerfen.

F: Funktioniert es in anderen Browsern (Firefox, Safari, Edge)? A: Derzeit wird nur Google Chrome unterstützt. Microsoft Edge (Chromium-basiert) könnte funktionieren, wird jedoch nicht offiziell unterstützt oder getestet.

F: Muss ich die Erweiterung nach der Studie installiert lassen? A: Nein. Teilnehmer können sie sofort nach Abschluss der Studie deinstallieren. Klicken Sie mit der rechten Maustaste auf das Erweiterungssymbol → "Von Chrome entfernen".

F: Wird die Erweiterung meinen Browser verlangsamen? A: Die Erweiterung ist außerhalb von Labvanced-Sitzungen inaktiv. Sie verursacht keine zusätzlichen Lasten beim normalen Surfen.

F: Kann sie meine Passwörter oder Bankdaten sehen? A: Nein. Passwortfelder (<input type="password">) und Kreditkarten-Eingaben sind ausdrücklich ausgeschlossen und geben in allen Fällen leere Werte zurück. Die Erweiterung liest oder überträgt niemals sensible Formulardaten.

F: Kann ich als Forscher dies verwenden, um eine Website zu verfolgen, die der Teilnehmer eigenständig besucht? A: Nein. Die Erweiterung aktiviert sich nur innerhalb von iFrames, die von labvanced.com eingebettet sind. Sie kann keine Websites verfolgen, die Teilnehmer unabhängig in anderen Tabs besuchen.

F: Die IT-Richtlinie meiner Institution erfordert eine Überprüfung der Erweiterung, bevor Mitarbeiter sie installieren können. Wen kann ich kontaktieren? A: Kontaktieren Sie uns unter [email protected] mit Ihrem Anliegen.

10. Kontakt & Unterstützung

E-Mail: [email protected]

Dokumentation: https://www.labvanced.com/content/learn/de/guide/

Community-Forum auf Discord: https://discord.com/invite/SBpFJnVZah

Fehlerberichte: Bitte fügen Sie hinzu:

• Ihre Chrome-Version (chrome://settings/help)
• Die URL der Website, die Sie einzubetten versuchen
• Einen Screenshot von Fehlernachrichten
• Schritte zur Reproduktion des Problems

Labvanced Web Bridge wird von der Scicovery GmbH entwickelt und gewartet. Für die vollständige Datenschutzrichtlinie besuchen Sie https://www.labvanced.com/extension-privacy-policy.html