ANLEITUNG: Erstellen Sie eine AR-Anprobe mit dem neuen Sunglasses Slider-Plugin

Online-Brillenkauf ist ohne Umkleidekabine schwierig. Deshalb haben wir Sunglasses Slider entwickelt: eine einfache WebAR-Anprobe, mit der man in Sekundenschnelle durch mehrere Brillen blättern und sehen kann, was wirklich passt. Die App läuft im Browser, also ohne Apps und ohne spezielle Einrichtung.

Was Sie vorbereiten werden

Sie benötigen vier leichte 3D-Modelle von Sonnenbrillen im .glb-Format und vier passende Vorschaubilder (eines pro Modell). Wenn Sie nur experimentieren möchten, können Sie Beispielmodelle auf Sketchfab herunterladen. Halten Sie die Dateien klein, damit Ihr Smartphone nicht einfriert.

Schritt 1 – Sammeln Sie die 3D-Modelle

Gehen Sie zu Sketchfab, suchen Sie nach Sonnenbrillen und laden Sie vier Modelle im .glb-Format herunter. Geben Sie ihnen eindeutige Namen: classic_black.glb, retro_tortoise.glb, sport_mirrored.glb usw. 

Schritt 2 – Erstellen Sie die Miniaturansichten

Öffnen Sie einen Web-Viewer wie den glTF Viewer. Laden Sie jede .glb-Datei, drehen Sie sie in einen vorteilhaften Winkel, machen Sie einen Screenshot und speichern Sie sie als 512×512 PNG oder JPG. Benennen Sie sie passend zu den Modellen, z. B. classic_black_thumb.png.

Schritt 3 – Erstellen Sie ein Projekt in MyWebAR

Melden Sie sich an, klicken Sie auf „Erstellen“ Proprojekt und wählen Sie den Tracking-Typ „Gesichtsfilter und -effekte“. Öffnen Sie den Editor. Das Gesichts-Tracking platziert automatisch Frames auf dem Kopf, sodass Sie nichts manuell ausrichten müssen.

Schritt 4 – Plugin hinzufügen

Öffnen Sie in der linken Seitenleiste die Erweiterungen, suchen Sie nach Sunglasses Slider und installieren Sie es. Gehen Sie dann zu Objekte und drücken Sie „+“, um das Plugin zu Ihrer Szene hinzuzufügen.

Schritt 5 – Schieberegler einrichten

Laden Sie für jede Folie das GLB-Modell und das dazugehörige Miniaturbild hoch. Führen Sie diesen Vorgang für alle vier Frames durch. Wenn alles korrekt aussieht, klicken Sie auf „Konfiguration speichern“.

Schritt 6 – Veröffentlichen und ausprobieren

Klicken Sie auf „Veröffentlichen“, um live zu gehen. Öffnen Sie den Link auf Ihrem Smartphone und testen Sie wie ein echter Kunde: Wechseln Sie zwischen den Rahmen, prüfen Sie die Passform und sehen Sie, wie sich das Bild bei unterschiedlichen Lichtverhältnissen verhält.

Hier ist ein Beispiel, das Sie erkunden können:

https://mywebar.com/p/Project_0_ki7txkwo8y

Warum Teams wie dieser Flow

Es funktioniert in jedem modernen mobilen Browser, es muss kein Code geschrieben werden und der Austausch von Modellen oder Miniaturansichten dauert nur wenige Minuten. Käufer können mehrere Bilder schnell vergleichen, was Zweifel reduziert und Entscheidungen beschleunigt.

Schnelle Lösungen, wenn sich etwas nicht richtig anfühlt

Wenn ein Modell riesig oder winzig aussieht, exportieren Sie den GLB erneut mit der richtigen Skalierung und versuchen Sie es erneut. Wenn Materialien falsch aussehen, stellen Sie sicher, dass Texturen in den GLB gepackt sind. Wenn ältere Telefone ruckeln, vereinfachen Sie die Geometrie oder reduzieren Sie die Texturgröße.

Das ist das gesamte Setup. Vier Modelle, vier Miniaturansichten, eine Veröffentlichung. Sie erhalten eine saubere AR-Anprobe, die sich natürlich anfühlt und einfach zu pflegen ist.

Unsere Nachrichten

Blog

Neuigkeiten

Aktualisierungen

Blog

Neuigkeiten

Aktualisierungen

Blog

Neuigkeiten

Aktualisierungen

Melden Sie sich für unseren Newsletter an

Erhalten Sie die neuesten Updates in Ihr Postfach