top of page

Von extern zu integriert: UX-Design für datengetriebene Planung

Die Challenge

In der bisherigen Software konnten Projektmanager und Planer im Maschinen- und Anlagenbau ihre Kennzahlen nur über eine externe KPI-Lösung auswerten, die separat lizenziert werden musste. Um den Nutzern eine integrierte und konsistente Erfahrung zu bieten, wurde beschlossen, ein eigenes Dashboard zu entwickeln, das wichtige Kennzahlen direkt innerhalb der Software analysierbar macht.

Meine Rolle

Als UX/UI Designer war ich verantwortlich für die Entwicklung des Interaktionskonzepts, die Erstellung der User Stories, die Ausarbeitung der Designs und die enge Abstimmung mit Produktmanagement, Entwicklung und QS. Mein Ziel war es, eine vertraute, konsistente und leicht erlernbare Oberfläche zu schaffen, die sich nahtlos in das bestehende System einfügt.

Konzeption & Abstimmung

Die funktionalen Anforderungen wurden in enger Zusammenarbeit mit dem Produktmanagement definiert. Da wir bereits wussten, wie unsere Kunden mit der bisherigen Lösung arbeiteten, konnten wir die zentralen Funktionen gezielt ableiten. Auf dieser Grundlage habe ich ein grobes Interaktionskonzept erstellt, das als Basis für eine Aufwandsschätzung diente. Diese Schätzung war wichtig, um das Projekt im Budget und Zeitrahmen zu halten.

0007.png

Anschließend habe ich für jede Funktion eine User Story mit Akzeptanzkriterien in Jira angelegt. Über das Ticketsystem konnten wir Fortschritte, verfügbare Kapazitäten und den Abgleich mit der ursprünglichen Zeitschätzung transparent nachverfolgen.

Web KPI Epic.png

Design & Interaktion

Beim Design lag mein Fokus darauf, bestehende Interaktionsmuster beizubehalten, um erfahrenen Nutzern den Umstieg zu erleichtern. Neue Interaktionen wurden nur dort eingeführt, wo sie einen klaren Mehrwert boten.
Für die Darstellung der Kennzahlengruppen entschied ich mich für ein horizontales Grid, um flexibel auf unterschiedliche Mengen und Höhen reagieren zu können. Nutzer können Gruppen oder Kennzahlen löschen, mit der Möglichkeit, diese bis zum nächsten Refresh jederzeit wiederherzustellen.

Früher Test 1.png
Früher Test 2.png
Früher Test 3.png
Dashboard - Gruppe duplizieren.png
KPI Limit erreicht.png

Beim Hinzufügen neuer Kennzahlen können Schwellenwerte definiert werden, die kritische Zustände visuell hervorheben. In den Diagrammen werden alle Werte performant in einem einzigen Viewport gerendert, während mehrere Detailstufen es dem Nutzer ermöglichen, sich gezielt auf relevante Informationen zu konzentrieren.

Diagramm 1.png

Designsystem & Zusammenarbeit

Um eine konsistente Umsetzung sicherzustellen, habe ich ein Designsystem und Styleguide entwickelt, das Farben, Typografie, Komponenten und Interaktionsverhalten definierte. Dadurch konnte die Entwicklung effizienter arbeiten und neue Komponenten auf Basis bestehender Richtlinien erstellen.
Während der gesamten Entwicklung stand ich in engem Austausch mit den Entwicklern und der QS. In regelmäßigen UX-Test-Runden habe ich geprüft, ob die Interaktionen wie geplant funktionieren.

Style Guide - Design System.png
Style Guide.png

Ein Beispiel aus diesen Tests: Kundendaten zeigten, dass Kennzahlen teils sechs- bis achtstellig waren, wodurch das ursprüngliche Layout an seine Grenzen kam. Durch gezielte Anpassungen konnte ich sicherstellen, dass auch große Zahlenwerte lesbar und visuell ausgewogen dargestellt werden.

UX Testrunde.png

Ergebnis & Impact

Das neue Web KPI Dashboard integriert die KPI-Analyse vollständig in die Software, wodurch Kunden keine externe Lösung mehr benötigen. Die Anwendung bietet vertraute Interaktionsmuster, klare Visualisierungen und flexible Anpassungsmöglichkeiten. Alles in einem konsistenten, intuitiven Design.
Mein Beitrag als UX/UI Designer lag darin, die komplexen Anforderungen in eine verständliche und benutzerfreundliche Oberfläche zu übersetzen, technische Machbarkeit mit Designqualität zu vereinen und den Entwicklungsprozess methodisch zu begleiten.

bottom of page