Warum sind UX und UI nicht nur eine Frage der Ästhetik, sondern auch ein geschäftliches Anliegen?
Man ist versucht, Design als eine oberflächliche Ebene zu betrachten, die erst nach der Produktentwicklung hinzugefügt wird. Die Zahlen erzählen jedoch eine andere Geschichte.
McKinsey schätzt in seiner Studie „The Business Value of Design“, dass Unternehmen, die ernsthaft in Design investieren, ihre Mitbewerber über einen Zeitraum von fünf Jahren bei den Einnahmen um 32 % und bei der Rendite für die Aktionäre um 56 % übertreffen . Laut Forrester Research generiert jeder in UX investierte Dollar im Durchschnitt 100 Dollar Rendite, was einem ROI von 9.900 % entspricht . IBM beziffert die Kosten für die Behebung eines Usability-Problems in der Produktion auf das 100-Fache der Kosten in der Entwurfsphase.
Diese Zahlen lassen sich direkt auf B2B-Software übertragen. Ein Mitarbeiter, der bei jeder Aktion 30 Sekunden verliert – und diese Aktion täglich dutzende Male wiederholt –, verursacht einen Produktivitätsverlust, der sich auf das gesamte Team auswirkt. Eine unübersichtliche Benutzeroberfläche führt zu Eingabefehlern. Ein schlecht durchdachter Arbeitsablauf verlangsamt die Einarbeitung neuer Mitarbeiter und erhöht die Anzahl der Supportanfragen.
Im Gegensatz dazu hat ein gutes UX/UI-Design konkrete Auswirkungen:
- Verkürzung der Einarbeitungszeit: Laut der Nielsen Norman Group kann eine gut gestaltete Benutzeroberfläche die Einarbeitungszeit um 40 % bis 60 % verkürzen.
- Weniger Bedienungsfehler: Eine übersichtliche visuelle Hierarchie und gut platzierte Bestätigungen reduzieren Bedienungsfehler erheblich.
- Weniger Supportanfragen: Selbstständige Nutzer beanspruchen die IT- und Helpdesk-Teams weniger.
- Schnellere Akzeptanz: Die Teams finden leichter Zugang zu einem Tool, das sie als intuitiv empfinden, was die Amortisationszeit der Lösung verkürzt.
Bei Solid machen sich diese Vorteile direkt in der Praxis bemerkbar. Jede Verbesserung der Benutzeroberfläche führt zu einer messbaren Zeitersparnis bei Vorgängen, die manchmal mehrere Dutzend Mal am Tag wiederholt werden.
B2B-Software unterliegt besonderen gestalterischen Anforderungen
Die Gestaltung einer B2B-Oberfläche unterliegt nicht denselben Regeln wie die einer Anwendung für Endverbraucher. Die Nutzer sind Fachleute, die präzise, sich wiederholende Aufgaben ausführen, oft unter anspruchsvollen Bedingungen wie im Lager, unterwegs, unter Zeitdruck usw.
Dies erfordert spezifische Gestaltungsentscheidungen:
- Kontrollierte Informationsdichte: Ein Fachmann benötigt viele relevante Daten, die sichtbar sind – manchmal auf einem einzigen Bildschirm –, ohne dass es dabei zu einer kognitiven Überlastung kommt.
- Funktionalität vor Ästhetik: Jede Interaktion sollte in möglichst wenigen Schritten erfolgen und einer vorhersehbaren und reproduzierbaren Logik folgen.
- Übersichtlichkeit der Systemzustände: Der Benutzer muss jederzeit wissen, was gerade geschieht – ob geladen wird, eine Aktion ausgeführt wird, ein Fehler aufgetreten ist oder ob die Verbindung aktiv ist oder unterbrochen wurde.
- Bestätigungen bei kritischen Aktionen: Da manche Aktionen nicht rückgängig gemacht werden können, ist es von entscheidender Bedeutung, klare Sicherheitsvorkehrungen in die Benutzeroberfläche zu integrieren, ohne dabei den Arbeitsablauf zu verlangsamen.
- Umgang mit Grenzfällen: leere Zustände, nicht gefundene Ressourcen, Verbindungsabbruch – jedes Ausnahmeszenario muss durchdacht und visuell dargestellt werden.
In unseren Lösungen werden diese Anforderungen besonders berücksichtigt. Ein Beispiel: Ein Mitarbeiter, der ein RFID-Tag an einem Objekt anbringt, hat keine Zeit, zwischen mehreren Bildschirmen hin und her zu wechseln. Er benötigt eine Benutzeroberfläche, die sich auf das Wesentliche konzentriert, die richtigen Informationen zum richtigen Zeitpunkt anzeigt und ihn daran hindert, einen irreversiblen Fehler zu begehen, ohne ihn deutlich darauf hinzuweisen. Das sind keine bloßen Details, sondern die Grundlagen eines Tools, das Teams manchmal mehrere Stunden am Tag nutzen.
Unser Designprozess: von der Ideenfindung bis zur Entwicklung
Schritt 1 – Rahmenbedingungen & Verständnis
Vor Beginn der Konzeption legen wir den Funktionsumfang fest: Problemstellungen, Ziele, Zielgruppe und Einbindung in bestehende Arbeitsabläufe. Dieser Schritt umfasst auch die Abstimmung mit den Beteiligten (Produktmanager, IT, Fachabteilungen, Entwickler), um eine gemeinsame Vision sicherzustellen.
Schritt 2 – Recherche und Erfassung der Gegebenheiten vor Ort
Wir analysieren die Nutzer und Geschäftsprozesse anhand von Interviews und einer Bestandsaufnahme. Ziel ist es, die tatsächlichen Nutzungsgewohnheiten, die praktischen Einschränkungen und die Reibungspunkte zu verstehen, um ein Design zu entwickeln, das auf den betrieblichen Kontext zugeschnitten ist.
Schritt 3 – Wireframing
Bevor wir an der Benutzeroberfläche arbeiten, durchlaufen wir in der Regel eine Phase der Wireframes – funktionale Schwarz-Weiß-Skizzen, die als Plan oder Gerüst dienen. Ihr Ziel ist es, die Struktur, den Inhalt, die Anordnung der Elemente und die Benutzererfahrung (UX) festzulegen, ohne sich um das endgültige Design (Farben, Bilder usw.) zu kümmern.
In dieser Phase werden die zentralen UX-Fragen geklärt:
- In welcher Reihenfolge sollen die Informationen angezeigt werden?
- Wie viele Schritte sind erforderlich, um eine Aufgabe zu erledigen?
- Was passiert bei einem Benutzerfehler?
Bei der Entwicklung und Optimierung unserer Lösungen ist diese Phase von entscheidender Bedeutung: Sie ermöglicht es, die Abläufe vor Ort bereits vor der detaillierten Planung zu antizipieren.
Schritt 4 – UI-Entwurf mit dem Solid-Designsystem
Sobald die Struktur validiert ist, gehen wir zur visuellen Gestaltung in der Software Figma über und stützen uns dabei auf unser Designsystem.
Dabei handelt es sich um eine Bibliothek wiederverwendbarer Komponenten (Schaltflächen, Tabellen, Formulare, Symbole, Schriftarten, Farben usw.), die die gemeinsame Grundlage für alle unsere Lösungen bildet.
Die Verwendung eines Designsystems bei der Entwicklung von Lösungen ist heutzutage unverzichtbar, denn es gewährleistet:
- Visuelle Einheitlichkeit: Alle Bildschirme folgen derselben visuellen Gestaltung, wodurch eine einheitliche Orientierung zwischen unseren verschiedenen Lösungen und Funktionen gewährleistet ist.
- Zeitersparnis: Vorhandene Komponenten werden direkt wiederverwendet und auch auf der Entwicklerseite identisch weiterentwickelt, sodass nicht bei jeder neuen Funktion von vorne begonnen werden muss.
- Kontrollierte Weiterentwicklung: Jede Verbesserung einer Komponente lässt sich problemlos auf alle Schnittstellen übertragen, in denen sie zum Einsatz kommt, wodurch eine dauerhafte Konsistenz gewährleistet wird.
Schritt 5 – Entwicklung
Sobald die UI-Entwürfe fertiggestellt sind, werden sie an das Entwicklungsteam weitergeleitet.
Unsere Lösungen werden überwiegend mit Flutter entwickelt, einem von Google entwickelten Framework, das es ermöglicht, einen einheitlichen Code-Basis für alle Plattformen – mobile, Web- und Desktop-Anwendungen – zu pflegen. Parallel dazu sorgt die Backend-Entwicklung für die Geschäftslogik, die Datenverwaltung und die Bereitstellung der APIs, die für das reibungslose Funktionieren der Funktionalität erforderlich sind.
Schritt 6 – Lieferung & kontinuierliche Weiterentwicklung
Sobald die Funktion entwickelt ist, wird sie in Betrieb genommen und im Laufe der Zeit überwacht.
Die Analyse der Nutzungsdaten und des Feedbacks ermöglicht es, im Rahmen einer iterativen Produktentwicklung kontinuierlich Verbesserungsmöglichkeiten zu identifizieren.
Ein konkretes Beispiel: unsere Neugestaltung der RFID-Kopplungsfunktion
Theorie ist gut. Ein Fall aus der Praxis ist besser.
In einer Rückverfolgbarkeitslösung ist die Zuordnung ein zentraler Vorgang: Dabei wird ein physischer RFID-Tag einem im System registrierten Objekt zugeordnet. Ein kritischer Vorgang, bei dem ein Fehler die Integrität der nachfolgenden Daten gefährdet.
In der vorherigen Version dieser Funktion umfasste der Ablauf mehrere Schritte über verschiedene Bildschirme hinweg. Nach einer Analyse der tatsächlichen Nutzung haben wir die Benutzeroberfläche grundlegend überarbeitet :
- Einheitlicher Bildschirm: Die in Echtzeit erkannten RFID-Tags und die Liste der zuzuordnenden Assets werden nun nebeneinander auf ein und demselben Bildschirm angezeigt; der Bediener kann lesen, auswählen und bestätigen, ohne die Ansicht zu verlassen.
- Statusanzeige für den Erfassungsort: Zeigt ständig den Verbindungsstatus zum RFID-Lesegerät an und ermöglicht es, den Erfassungsort mit wenigen Klicks zu wechseln, ohne den Arbeitsablauf zu unterbrechen.
- Erweitertes Bestätigungsfenster: Vor dem Bestätigen wird dem Benutzer eine Zusammenfassung der Informationen zum ausgewählten Objekt angezeigt – ein Sicherheitsschritt, der Fehler bei der Zuordnung verhindert.
Das Ergebnis ist eine erhebliche Zeitersparnis bei einer sich wiederholenden Aufgabe sowie eine messbare Fehlerreduzierung . Genau das sollte jede gute UX/UI-Arbeit in einer B2B-Lösung bewirken, unabhängig von der Branche.
Möchten Sie unsere Benutzeroberflächen in Aktion sehen? [cta|Fordern Sie eine Vorführung an|/contact]
Warum sollte man bei der Auswahl einer B2B-Lösung die UX/UI bewerten?
Wenn ein Unternehmen eine B2B-Lösung evaluiert, achtet es in der Regel auf Funktionen, Sicherheit, Preis und technische Integration. Die Benutzeroberfläche wird oft erst als Letztes bewertet, manchmal sogar erst nach Vertragsunterzeichnung. Das ist ein Fehler.
Bei Lösungen zur Rückverfolgbarkeit haben solche Lücken direkte betriebliche Kosten zur Folge: Eine falsche Zuordnung, eine falsch interpretierte Information, ein übersehener Status – und schon ist die Datenintegrität gefährdet. Bei Solid ist die UX/UI-Qualität unserer Benutzeroberflächen so konzipiert, dass dies nicht geschieht.
Ein Tool, das Ihre Teams täglich nutzen, muss auf ihre Bedürfnisse zugeschnitten sein – und nicht nur auf die des Vertriebsmitarbeiters.
Suchen Sie nach einer Rückverfolgbarkeitslösung, die speziell für Ihre Außendienstmitarbeiter entwickelt wurde?[cta|Kontaktieren Sie einen Solid-Experten|/contact]
