Skip to main content
Beim ersten Login eines neuen Konto-Owners leitet Scanova diesen zu einem 4-stufigen Assistenten unter /onboarding, bevor er das Haupt-Dashboard überhaupt zu sehen bekommt — der gesamte Zweck besteht darin, einen QR-Code zu erstellen, bevor Sie sich selbst überlassen werden, um die App zu erkunden.
Der Auslöser dieser Seite (first_login) ist kontobezogen und nur jemals einmal wahr, sodass er auf dem für die Verifizierung des übrigen Dokumentationsprojekts verwendeten gemeinsam genutzten Testkonto nicht live erneut ausgelöst werden konnte — dieses Konto hatte seinen ersten Login längst abgeschlossen, bevor diese Seite geschrieben wurde. Jeder Schritt unten wurde live verifiziert, indem direkt zu /onboarding navigiert wurde (die Route selbst hat keine weitere Sperre außer der Anmeldung) und der Ablauf von Anfang bis Ende durchlaufen wurde; nur das automatische Weiterleitungsverhalten beim ersten Login selbst wird aus dem Quellcode dokumentiert, nicht beobachtet.

Wer dies sieht, und warum

Gemäß der eigenen Routing-Logik der App (lib/next-path.ts) gilt der Assistent nur für einen tatsächlich neuen Konto-Owner — ein Teammitglied, das eine Einladung als geteilter Nutzer annimmt, löst beim ersten Login ebenfalls dasselbe zugrunde liegende first_login-Flag aus, ist davon jedoch bewusst ausgenommen, da der Assistent Berechtigungen voraussetzt (wie das Erstellen eines QR-Codes), die ein Viewer oder eine andere eingeschränkte Rolle möglicherweise nicht besitzt. Ein neu eingeladenes Teammitglied gelangt stattdessen direkt zum Dashboard. Ist die Profilvervollständigung noch ausstehend, hat diese Sperre Vorrang — der Assistent erscheint erst, nachdem Ihr Profil vollständig ist.

Schritt 1 — Choose

Der Assistent öffnet mit einer personalisierten Begrüßung (“Welcome, {name}! Let’s create your first QR Code.”) und drei Ausgangspunkten, die denselben drei Optionen entsprechen, die überall sonst in der App verfügbar sind (siehe Quick Code vs. full Page):
Onboarding-Assistent Schritt 1, Choose, mit der Überschrift 'Welcome, Docs! Let's create your first QR Code.' und drei Karten: Quick Code (Website URL), Choose a Template (mit der Markierung Popular) und Build with AI (mit der Markierung AI-Powered)

Schritt 1 des Onboarding-Assistenten — Auswahl eines Ausgangspunkts

  • Quick Code — ein direkt ausgeführter QR-Code, z. B. Website URL.
  • Choose a Template (mit der Markierung Popular) — ein vorgestaltetes Seitenlayout (Business Card, Custom Page und mehr).
  • Build with AI (mit der Markierung AI-Powered) — beschreiben Sie, was Sie benötigen, und lassen Sie KI den Seiteninhalt generieren.
Eine Fortschrittsanzeige oben (1 Choose → 2 Create → 3 Configure → 4 Design & Finish) verfolgt Ihre Position während des gesamten Ablaufs, und ein Link Visit Dashboard oben rechts ermöglicht es Ihnen, den Assistenten jederzeit vollständig zu überspringen.

Schritt 2 — Create

Die Auswahl eines Ausgangspunkts öffnet dessen typspezifisches Erstellungsformular. Für Website URL (der hier verifizierte Pfad) ist dies ein einzelnes Feld, das nach der Ziel-URL fragt, mit einer live gerenderten QR-Code-Vorschau rechts, während Sie tippen:
Onboarding-Assistent Schritt 2, Create, mit einem Formular 'Enter your website URL' mit einer https://-Präfix-Eingabe und einem Live-QR-Code-Vorschaubereich

Schritt 2 — Eingabe einer Website-URL mit Live-QR-Code-Vorschau

Schritt 3 — Configure

Als Nächstes benennen Sie den QR-Code und wählen dessen Kurz-URL:
Onboarding-Assistent Schritt 3, Configure, mit einem QR-Code-Namensfeld, standardmäßig auf 'My QR Code' gesetzt, einer Kurz-URL-Domainauswahl auf scnv.io mit automatisch generiertem Slug und einer Customize-Option, einem Schalter für GPS-Standortverfolgung sowie einer Schaltfläche Create QR Code

Schritt 3 — Benennung des QR-Codes und Konfiguration seiner Kurz-URL

  • QR Code name — standardmäßig “My QR Code”, wenn leer gelassen.
  • Short URL — standardmäßig scnv.io mit automatisch generiertem Slug; wählen Sie Customize, um einen eigenen festzulegen.
  • GPS location tracking — ein optionaler Schalter zum Erfassen des genauen Scan-Standorts (erfordert die Zustimmung des Besuchers zum Zeitpunkt des Scans).
Die Auswahl von Create QR Code zeigt kurz den Status “Generating your QR Code…” an und führt dann zum letzten Schritt weiter.

Schritt 4 — Design & Finish

Der letzte Schritt bestätigt den Erfolg mit einer feiernden Konfetti-Animation und Ihrem fertigen, scanbaren QR-Code:
Onboarding-Assistent Schritt 4, Design and Finish, mit einer Konfetti-Animation, der Überschrift 'Congratulations, [name]! Your QR Code is ready.', einer optionalen Designauswahl, einem echten QR-Code-Bild, den Schaltflächen Test your QR und Download QR sowie einer Schaltfläche Continue to plans

Schritt 4 — der fertige QR-Code, bereit zum Testen, Herunterladen oder Anpassen

Von hier aus:
  • Choose a design (optional) — vor dem Herunterladen einen visuellen Stil anwenden.
  • Test your QR — öffnet das Ziel in einem neuen Tab, genauso wie es ein Scan tun würde.
  • Download QR — lädt das QR-Code-Bild herunter.
  • Continue to plans — die abschließende Aktion, die Sie in die Hauptanwendung führt (ein Hinweis auf dem Bildschirm erinnert Sie daran, dass das Design später auch vom Dashboard aus geändert werden kann).
  • Quick Code vs. full Page — dieselben drei Ausgangspunkte, jederzeit verfügbar unter /qr/create, nicht nur während des Onboardings.
  • Classic to New UI — eine separate, einmalige Entscheidung auf Kontoebene, unabhängig von diesem Assistenten.