UX-Design & Research | Interfacedesign | Prototyping
Konzeption & Gestaltung eines Multivertrags-Kundenportals für Freeyou
Freeyou stand vor einer strategischen Neuausrichtung:
Aus einem auf ein einzelnes Versicherungsprodukt fokussierten Kundenportal sollte eine skalierbare Multi-Produkt-Plattform entstehen.
Kontext & Ausgangslage
Mit der geplanten Einführung weiterer Versicherungsprodukte – unter anderem einer Gegenstandsversicherung – wurde deutlich, dass eine grundlegende Neukonzeption von Informationsarchitektur, UI-Struktur und UX-Logiken notwendig war.
Das bestehende Portal war funktional stabil, jedoch:
- nicht auf mehrere Verträge ausgelegt
- nicht komponentenbasiert aufgebaut
- nicht langfristig erweiterbar
Ich war während dieser Phase als UX/UI Designer maßgeblich für die konzeptionelle, visuelle und strukturelle Neuausrichtung des Kundenportals verantwortlich.
Zentrale Herausforderungen
- Vereinheitlichung unterschiedlicher Versicherungslogiken innerhalb einer gemeinsamen UX
- Übersetzung technischer Constraints in nutzerzentrierte Interface-Lösungen
- Aufbau einer Pattern Library parallel zum laufenden Produktbetrieb
Zielsetzung
Ziel war nicht ein reines Redesign, sondern der strategische Umbau eines bestehenden Systems.
Zentrale Ziele:
- Aufbau eines skalierbaren Kundenportals, das mehrere Versicherungsprodukte konsistent abbilden kann
- Entwicklung einer modularen UI- und Komponentenlogik als Basis für zukünftige Erweiterungen
- Sicherstellung einer klaren Nutzerführung, trotz wachsender funktionaler Komplexität
- Etablierung einer einheitlichen Designsprache über Produkt- und Teamgrenzen hinweg
Rolle & Verantwortung
In diesem Projekt übernahm ich eine end-to-end UX/UI-Rolle mit starkem Fokus auf Systemdesign:
- UX-Konzeption & Informationsarchitektur
- UI-Design & visuelle Gestaltung (Komponenten & Pages)
- Aufbau einer Pattern Library in Figma
- Erstellung von Wireframes, Prototypen und UX-Flows
- Enge Zusammenarbeit mit Product Ownern und Entwicklern
- Begleitung erster Implementierung bis in den Code
Vorgehen & Designprozess
Analyse & technische Abstimmung
Zu Beginn analysierte ich gemeinsam mit Product Ownern und Entwicklern:
- bestehende Vertrags- und Datenlogiken
- technische Rahmenbedingungen
- zukünftige Produktanforderungen
Diese Phase war entscheidend, um eine UX-Struktur zu entwickeln, die technisch realistisch, visuell konsistent und langfristig tragfähig ist.
Konzeption & Pattern Library
Auf Basis der Analyse entwickelte ich eine modulare Design- und Komponentenlogik:
- Progress-Bar mit Prozentangabe (nicht nur Schritten)
- Schrittmarker zeigen aktuelle Position
- Descriptive Labels (nicht "Step 3", sondern "Ihr Zuhause – Schritt 1 von 3")
Jede Komponente wurde bewusst so gestaltet, dass sie:
- produktübergreifend einsetzbar
- erweiterbar
- und klar dokumentiert ist
Enge Zusammenarbeit mit der Entwicklung
Durch den direkten Austausch mit dem Entwicklungsteam konnten Designentscheidungen frühzeitig im Code überprüft werden. Diese Arbeitsweise führte zu:
- kürzeren Feedback-Zyklen
- höherer Umsetzungssicherheit
- weniger Reibungsverlusten zwischen Design und Entwicklung
UX wurde dadurch nicht als „Vorschlag“, sondern als integraler Bestandteil des Produkts verstanden.
Prototyping & Testing
Um Konzepte früh validierbar zu machen, setzte ich auf:
- High-Fidelity Wireframes
- interaktive Prototypen
- Storybook zur code-nahen Visualisierung von Komponenten
Pattern Library – zentrale Bausteine
- Modulares Figma-System mit Komponenten und Variablen
- Wiederverwendbare UI-Patterns für Navigation, Cards, Tabellen und Formulare
- Konsistentes Design Language System (Typografie, Farben, Spacing)
- Responsives Layout für Desktop, Tablet und Mobile
- Dokumentation und Übergabe an Entwicklung & Produkt
Ergebnisse & Wirkung
Auch ohne harte KPIs zeigte das Projekt klare strukturelle Effekte:
- Etablierung eines skalierbaren Kundenportals für zukünftige Produkte
- Einführung einer einheitlichen UX- und UI-Sprache im Unternehmen
- Deutlich verbesserte Abstimmung zwischen Design, Produkt und Entwicklung
- Solide Grundlage für ein langfristiges UX-Framework bei Freeyou
Learnings
Dieses Projekt zeigt exemplarisch, wie ein bestehendes Produkt durch strategisches UX-Design, komponentenbasiertes Denken und enge interdisziplinäre Zusammenarbeit nachhaltig transformiert werden kann – von einer singulären Produktlösung hin zu einer zukunftsfähigen Multi-Produkt-Plattform.
- Systemisches UX-Denken ist entscheidend, sobald Produkte skalieren
- Eine saubere Pattern Library ist nicht nur Design-Artefakt, sondern Organisationswerkzeug
- Frühe und kontinuierliche Zusammenarbeit mit der Entwicklung erhöht Qualität und Geschwindigkeit
- UX wirkt am stärksten, wenn sie strukturelle Entscheidungen mitträgt
Zurück zur Übersicht