← Alle Projekte SaaS-UI · Produktdesign

Lumen — Onboarding, das das Produkt zeigt, bevor die Anmeldung endet

Ein B2B-SaaS-Onboarding-Flow mit Live-Dashboard-Vorschau, die sich beim Beantworten der Fragen selbst aufbaut — plus das wiederverwendbare UI-Kit dahinter.

Interaktive Projektdemo · Namen, Daten und Leistungswerte sind beispielhaft.

ÜberzeugendSchnell
TailwindFramer MotionStorybookFigma
90 Sek. Bis zu einem verbundenen, personalisierten Dashboard Interaktive Demo öffnen ↗
upsurfaced.com/demos/lumen-saas-ui-kit-onboarding.html Demo im Vollbild öffnen ↗

Kontext

Aktivierung ist der Punkt, an dem SaaS-Produkte sterben: Nutzer registrieren sich, sehen ein leeres Dashboard und verschwinden wieder. Lumen ist eine datenschutzkonforme Nachbildung eines echten Projekts — ein Onboarding, das den Aha-Moment direkt in die Anmeldung einbaut.

Das Problem

Die meisten Onboarding-Flows stellen Fragen und geben nichts zurück. Der Nutzer leistet die Arbeit, das Produkt bleibt bis Schritt vier eine Blackbox. Bis dahin ist bereits die Hälfte wieder weg.

Der Ansatz

Ich habe einen vierstufigen Flow entworfen, bei dem das Produkt antwortet: Während der Nutzer seinen Workspace benennt und ein Ziel auswählt, baut sich daneben eine Live-Dashboard-Vorschau selbst zusammen — mit seinem Namen, seinen Kennzahlen, seinem Chart. Darunter liegt ein echtes Designsystem: Buttons, Badges, Toggles, Avatar-Stacks — als Kit dokumentiert, damit ein Entwicklerteam den Rest des Produkts in derselben Sprache weiterbauen kann.

Was die Umsetzung zeigt

Von Schritt eins bis zu einer personalisierten, datenverbundenen Dashboard-Vorschau in rund 90 Sekunden — mit progressiver Offenlegung („Schritt 2 dauert etwa 90 Sekunden“), die die Verbindlichkeitsangst bei jedem Schritt senkt. Der Komponenten-Streifen beweist: Das hier ist ein System, kein einzelner Bildschirm.

Interaktive Projektdemo — entwickelt, um Produkterlebnis und technische Umsetzung nachvollziehbar zu machen. Namen, Marken, Daten und Leistungswerte sind beispielhaft.

Machen wir Ihr Unternehmen leichter auffindbar und überzeugender.

Ein kostenloses KI-Sichtbarkeits-Audit zeigt Ihnen genau, wo Sie stehen. Ohne Bedingungen. Starten Sie damit, oder buchen Sie ein Erstgespräch.