Wir stellen vor Vectary Canvas, ein neuer Raum für AI-beschleunigte Ideenfindung. → Canvas

Schmuck-Konfigurator

Erstelle eine interaktive Präsentation, um einen Schmuck-Konfigurator für deine Kunden zu entwickeln.

Was ist ein Schmuck-Konfigurator?

Ein 3D-Schmuck-Konfigurator ist ein in Vectary erstelltes Online-Tool, das Käufer dazu einlädt, ihre eigenen Schmuckstücke im digitalen Raum zu entwerfen und zu personalisieren. Die intuitive Benutzeroberfläche mit einer Vielzahl von Optionen ermöglicht es Nutzern, ihr eigenes finales Design zu konfigurieren. Es kann als direkter Link geteilt oder direkt in eine Website eingebettet werden.

Konzeptentwicklung

Dieses Projekt setzt im Vergleich zu einem Standard-Konfigurator stärker auf Storytelling. Es ermöglicht Nutzern, in drei Schritten ihren eigenen, einzigartigen Ring zu kreieren, anstatt nur mit Objekten an einem einzigen Ort zu interagieren. Die Floating UI steuert die grundlegende Navigation durch die Szene, während konfigurierbare Optionen angezeigt werden. Das sind die einzelnen Schritte:

  • Wähle das Material der Ringschiene
  • Wähle den Edelstein
  • Sieh dir die Vorschau an, starte von vorn oder bestelle über eine API

Die fertige Variante kann auch als Augmented Reality (AR) geteilt und in einer realen Umgebung betrachtet werden.

So erstellst du einen Schmuck-Konfigurator

Das Modell einrichten

‍

Der Ring selbst wurde modelliert in Blender und importiert als .obj-Datei. Die Steine wurden durch 3D-Scannen mittels Photogrammetrie erstellt und als .obj-Dateien in Vectary Studio importiert. Die Polygonanzahl der Steine wurde in Studio mit dem Simplify-Plugin reduziert.

‍

Beleuchtungs-Setup

‍

Die Szene ist in drei Bereiche mit unterschiedlichen Licht-Setups unterteilt. Jeder Bereich zeigt Stillleben-Kompositionen aus realistischen Steinen, in deren Mitte interaktive Elemente positioniert sind. Ein Licht gerichtetes Licht bleibt außerhalb dieser Gruppen und ist jederzeit sichtbar. Die Beleuchtung der Ringschiene und der Edelsteine bringt Herausforderungen mit sich. Im ersten Bereich ist die Ringschiene von drei rechteckigen Lichtern und einem Spotlight umgeben, um alle Teile in den Reflexionen der Ringschiene hervorzuheben. Der Edelsteinbereich basiert ausschließlich auf dem gerichteten Licht, während die finale Ring-Zusammenstellung zwei Spotlights und ein rechteckiges Licht umfasst.



‍

Lichter sind in Gruppen organisiert und unter Varianten platziert, um die Performance zu optimieren und nur eine aktive Lichtgruppe zu verwenden. Der nächste Bereich ist aufgrund des Kamerawinkels und der Fading-Effekte nie vollständig sichtbar.

‍

Materialien & Baking

‍

Die gesamte Farbpalette der Szene ist neutral, mit einem Altrosa-Ton anstelle von monochromatischem Weiß, was die Stillleben-Steine in der Szenenumgebung ergänzt. Die Steine sind realistische, 3D-gescannte Assets mit optimierten Texturen nur im Farbkanal; alle anderen Kanäle sind leer, um die Szenengröße zu reduzieren. Die Variation im Aussehen dieser Steine wird erreicht durch gebackene Lightmaps.



‍

Tipp: Entferne überflüssige Geometrie an unsichtbaren Stellen, wie der Unterseite dieser Steine. Zudem gibt es nur eine Art von Stein in der Szene, die als Instanz mit unterschiedlichen Größenparametern dupliziert wurde, was wiederum Dateigröße spart.
Die Ringschiene im ersten Bereich verfügt über vier verschiedene metallische Materialien, die von Edelmetallen inspiriert sind.

‍

Die Edelsteine nutzen mehrere Techniken, um das gewünschte Aussehen zu erzielen. Jeder Edelstein enthält ein kleineres Duplikat in seinem Inneren, und der Refraktionsparameter mit Absorption für Farbe spielt eine entscheidende Rolle. Zudem haben die äußeren Edelsteine einen Clear Coat mit einem auf 1000 % gesetzten Wert auf der Oberseite. Diese Kombination aus verschiedenen Materialien, die auf die äußeren und inneren Edelsteine angewendet werden, sorgt für ein komplexeres finales Aussehen.

‍

Interaktionen

‍

Die ersten beiden Bereiche bieten 360-Grad-Animationen in einer Endlosschleife für jede Ringschiene und jeden Edelstein, die so eingestellt sind, dass sie sich linear wiederholen. Das Floating-UI-Menü steuert die Navigation durch die Szene und die Materialkonfigurationen. Die UI enthält Bilder mit Namen, die bei Klick die Materialien für Ringschiene und Edelsteine ändern.

‍

Die Materialien der Ringschiene im ersten und letzten Bereich sind nicht miteinander verknüpft, sodass zwei Materialien gleichzeitig geändert werden müssen. Dies stellt sicher, dass Nutzer beim Übergang zu Schritt drei dasselbe Material sehen, das sie zu Beginn ausgewählt haben.

Die Vorteile eines 3D-Schmuck-Konfigurators

Anpassung

Visualisierung

Zugänglichkeit

Try Business Workspaces

  • Ideate together in Canvas
  • Create and review 3D as a team
  • Organize projects and control access
  • Publish 3D and AR across every channel
  • Scale with APIs, hosting, and expert support
Talk to our team
Vectary Workspaces with shared folders, team cursors, and a 3D material board