Company logo

BIBA GmbH | Fallstudie

UX Design für eine ergonomische Innovationsplattform

UX Design
Agile UX
Workshops
Accessibility

Forschung trifft UX

Im Forschungsprojekt „RessourcE“ entsteht in Bremen in Zusammenarbeit mit BIBA - Bremer Institut für Produktion und Logistik GmbH ein regionales Kompetenzzentrum, das sich der ergonomischen Gestaltung von Dienstleistungsarbeit widmet. Ziel ist es, logistische Prozesse menschenzentrierter zu gestalten – Risiken zu erkennen, Belastungen zu reduzieren und gesündere Arbeitsumgebungen zu schaffen. Ein zentrales Ergebnis des Projekts: eine webbasierte Plattform, die Lösungsanbieter und Anwender:innen zusammenbringt und dabei hilft, ergonomische Maßnahmen gezielt zu identifizieren und zu bewerten.


Unser Auftrag: das User Interface Design dieser Plattform inklusive UX-Konzeption, Usability-Testing und einer barrierearmen, nach WCAG 2.1 entwickelten User Experience.

Herausforderung: Komplexität übersetzen


Das Projekt vereinte unterschiedliche wissenschaftliche und betriebliche Perspektiven: Lösungsanbieter (z. B. Hersteller von Exoskeletten oder Hebehilfen), Anwender:innen (Unternehmen, die ergonomische Risiken minimieren wollen) und Plattformbetreiber:innen (Expert:innen des Kompetenzzentrums in Bremen). Die Herausforderung für das Design lag darin, wissenschaftliche Funktionalität und nutzerfreundliche Zugänglichkeit miteinander zu verbinden.


Das Design musste drei Dinge gleichzeitig leisten:


  • Klare Bedienbarkeit über verschiedene Nutzergruppen hinweg.
  • Nachvollziehbare Entscheidungslogik bei hoher inhaltlicher Dichte.
  • Visuelle Barrierefreiheit für eine diverse Zielgruppe.


Auf Grundlage der wissenschaftlichen Zielsetzung galt es, komplexe Prozesse in eine intuitive Nutzerführung zu übersetzen, ohne den analytischen Anspruch der Forschung zu verlieren.

Der Prozess: UX-Konzeption, Workshops & iterative Entwicklung

UX-Konzeption & Anforderungsdefinition

Zum Projektstart im Frühjahr 2024 führten wir mehrere UX-Workshops durch. Ziel war es, die Funktionslogik und Nutzerpfade der webbasierten Entscheidungsplattform präzise zu definieren.


In 2 Workshoprunden wurden:


  • User Stories für alle drei Nutzerrollen (Lösungsanbieter, Anwender:innen, Betreiber:innen) erarbeitet.
  • Eine User Flow Map entwickelt, die sämtliche Screens, Funktionen und Entscheidungspunkte visualisiert.
  • Ein Anforderungsprofil für Barrierefreiheit nach WCAG 2.1 erstellt.


Die Workshops bildeten das methodische Fundament des Projekts – sie ermöglichten Transparenz, Priorisierung und eine gemeinsame Sprache zwischen Forschung, Entwicklung und Design.

UI Design, Design System & Prototyping


Basierend auf der vorhandenen Corporate Identity des Projekts entwickelten wir ein modulares UI-System nach den Prinzipien des Atomic Design. Das bestehende visuelle Fundament wurde um digitale Komponenten erweitert für mehr Skalierbarkeit, Konsistenz und Barrierefreiheit.


Das Designsystem umfasst:


  • Typografien, Farbpaletten, Buttons, Eingabefelder, Abstände und Icons
  • adaptive Komponenten für alle Devices
  • kontextbezogene UI-Zustände für drei Rollen (Admin, Anbieter, Anwender)


Alle Elemente wurden in Figma als interaktiver Prototyp umgesetzt. So konnten Layout, Bedienlogik und Interaktionen frühzeitig mit den Stakeholdern getestet werden.

Stakeholder-Feedback, Heuristische Evaluation & Iteration


Bevor das Accessibility Testing begann, wurde der interaktive Prototyp in einem Stakeholder-Workshop mit beteiligten Firmen des Forschungsprojekts präsentiert. Gemeinsam prüften wir, ob die geplanten Interaktionen realitätsnah, verständlich und effizient waren.


Mit Hilfe einer heuristischen Evaluation bewerteten Expert:innen und Vertreter:innen unterschiedlicher Nutzergruppen die Bedienfreundlichkeit anhand definierter Kriterien von Klarheit und Fehlerprävention über Konsistenz bis hin zu Informationssichtbarkeit. Ergänzend kam das MoSCoW-Prinzip zur Priorisierung des Feedbacks zum Einsatz:


  • Must Have: essenzielle UX-Optimierungen (z. B. Filterlogik, Produktvergleich, Feedbackmechanismen)
  • Should Have: Verbesserungen mit Einfluss auf Fluidität & Informationsarchitektur
  • Could Have & Won’t Have: optionale Elemente außerhalb der initialen Projektziele


Im Anschluss an die heuristischen Rückmeldungen erfolgte eine Designiteration, in der sämtliche priorisierten Anpassungen umgesetzt und erneut innerhalb des Projektteams abgestimmt wurden. Diese Zwischenrunde diente dazu, Usability-Schwachstellen gezielt zu adressieren, bevor weiterführende Tests gestartet wurden.

Accessibility, Usability Testing & Iteration


Nach der Überarbeitung des Prototyps folgte die Prüfung der visuellen Barrierefreiheit durch eine externe Expertin. Der Prototyp wurde nach den WCAG 2.1-Richtlinien auf Farbkontrast, Touch Targets, Lesbarkeit und Non-Text-Content bewertet. Die Ergebnisse wurden ebenfalls nach dem MoSCoW-Prinzip bewertet und priorisiert, um die relevantesten Anpassungen zielgerichtet umzusetzen.


Anschließend wurde der überarbeitete Prototyp in einem Usability-Test mit zehn Teilnehmenden evaluiert. Testpersonen aus unterschiedlichen Rollen (Anwender, Anbieter, Betreiber) lösten dabei konkrete Aufgaben im System – von der Produktsuche über das Anlegen von Lösungen bis zur Konfiguration der Plattform.


Die Tests bestätigten: Das neue Interface ermöglicht eine intuitive, zugängliche und barrierearme Navigation über alle Prozessschritte hinweg.


Im Anschluss wurden alle Findings gemeinsam mit den Projektbeteiligten anhand der MoSCoW-Methode überprüft, priorisiert und in einer finalen Designiteration umgesetzt. So entstand ein abgestimmtes UX-Design, das als solide Grundlage für die technische Entwicklung und Übergabe diente.

Lernen im Prozess


Das Projekt RessourcE zeigte erneut, wie sehr sich Forschung und UX-Design gegenseitig befruchten können.


Unsere zentralen Learnings:



  • Frühzeitige Heuristik lohnt sich. Iterative Prüfungen vor dem Accessibility Testing verkürzen Korrekturschleifen deutlich.
  • Accessibility ist kein Add-on, sondern Designgrundlage. Der integrative A11Y-Prozess stärkt langfristig die Nutzerakzeptanz.
  • Workshop-basierte Co-Creation schafft Klarheit. Durch kollaborative Definition der User Flows konnten Entscheidungen faktenbasiert getroffen werden.

Feedback aus erster Hand

Die Meinung unserer Kund:innen zum Projekt

Nils Hendrik Hoppe's avatar

Nils Hendrik Hoppe

Projektmanager - Bremer Institut für Produktion und Logistik GmbH

Im Rahmen des Forschungsprojekts RessourcE haben wir zusammengearbeitet, um ein Tool zur Auswahl ergonomieverbessernder Maßnahmen für die Logistikbranche zu entwickeln. Casimir und Dennis haben uns in der Konzeptphase mit einem Prototypen basierend auf dem vorhandenen Projektdesign unterstützt. Besonders hilfreich war ihre Erfahrung im UI/UX-Design und ihre Fähigkeit, gemeinsam erarbeitete Ideen schnell und flexibel umzusetzen. Die Kommunikation war stets unkompliziert und offen. Ich fühlte mich jederzeit gut informiert und betreut. Die Zusammenarbeit verlief sehr harmonisch, und es gab keine Punkte, die ich anders gewünscht hätte. Das Team hat meine Erwartungen erfüllt und mich rundum gut unterstützt. Insgesamt war die Zusammenarbeit sehr positiv, und ich würde ihre Dienstleistungen ohne Zögern weiterempfehlen.

Weitere Projekte

Du willst mehr über UX Design & Branding erfahren?

UX Design einer HR-Management-App

UX Design einer HR-Management-App

Die Tour zur Neupositionierung einer vielseitigen Fahrradmarke

Die Tour zur Neupositionierung einer vielseitigen Fahrradmarke

Knack den Kern des Erfolgs!

Knack den Kern des Erfolgs!