05/2021 – Heute
Anonymer Industriekunde: Konzeption, Gestaltung und Developer-Handoff einer zentralen UI-Plattform für industrielle Mikroskopie
Mit der Unterstützung von Shapefield wurde im Rahmen eines Projekts für ein international tätiges Unternehmen im Bereich der Mikroskopie die konzeptionelle und visuelle Weiterentwicklung einer bestehenden Softwareplattform vorangetrieben. Anwendung findet die Software in diversen Szenarien der industriellen Qualitätssicherung sowie Forschung und basiert auf einem modularen UI-System, das eine konsistente und skalierbare Nutzererfahrung über unterschiedliche Produkttypen hinweg gewährleistet.
Teil des Projekts war die Entwicklung konzeptioneller Lösungsansätze für neue und bestehende Funktionalitäten, die anschließend visuell anhand des kundenseitigen Styleguides ausgestaltet wurden. Tiefgreifend wurden für zentrale Anwendungsbereiche klickbare Prototypen erstellt, welche zur internen Validierung und im Dialog mit Endnutzer:innen eingesetzt wurden.
Hinsichtlich der visuellen Umsetzung entstanden neue UI-Komponenten, die spezifiziert und im Rahmen des Design-Handoffs mit Zustandsdefinitionen und Interaktionsverhalten an die Entwicklung übergeben wurden. Im Zuge eines agilen Scrum-Prozesses erfolgte die Umsetzung in enger Zusammenarbeit mit cross-funktionalen Teams sowie regelmäßiger Abstimmung im Projektverlauf. Als Basis für die Entwicklung diente ein modular aufgebautes UI-System, das Skalierbarkeit und Konsistenz sicherstellt.
Shapefield begleitete das Projekt mit Fokus auf nutzerzentrierte Gestaltung und technische Integration über alle Phasen hinweg.
Rollen
UX Designer, UI Designer, Concept Designer, Interaction Designer, Usability Engineer, Requirements Engineer, UX Researcher, Developer Handoff
Aufgaben und Verantwortungen
- Projektleitung und Durchführung von Designaufgaben
- Zusammenarbeit im agilen Scrum-Team
- Projektübergreifende Zusammenarbeit mit Design- und Entwicklungsteams
- Weiterentwicklung des Bedienkonzepts
- Anwendung des visuellen Designs auf Basis des Styleguides
- Prototyping in Figma zur Visualisierung von Konzepten
- Erstellung von Spezifikationen für die Entwicklung
- Durchführung von Usability-Tests
- Regelmäßige Reviews der Designstände im agilen Entwicklungsprozess
Schlagworte
UX, User Experience, UX Design, UI Design, User Interface, UI, Usability, Mikroskopie, Design System, Figma, Prototyping, Skalierbarkeit, Konsistenz, Handoff, Spezifikation, UX Guidelines, Visuelles Design, Agile, Scrum, High-Tech, Industrie, Forschung, Nutzerzentrierte Gestaltung
07/18 – 09/22
Anonymer Enterprise-Kunde: Gestaltung der neuen Produktgeneration einer Immobilienverwaltungssoftware
Für die neue Produktgeneration eines marktführenden Immobilien-ERP-Systems wurde ein modernes UI Design auf Basis vorhandener UX-Konzepte entwickelt. Ziel war es, die komplexen Funktionen – darunter Immobilien- und Vertragsverwaltung, Instandhaltungsplanung, Rechnungswesen und Prozessüberwachung – in einer klar strukturierten und intuitiv bedienbaren Oberfläche zu vereinen.
Das UI wurde im Rahmen eines iterativen Designprozesses regelmäßig in Fokusgruppen vorgestellt und weiterentwickelt. Zusätzlich wurde ein zentrales Design System in Figma aufgebaut, das als Grundlage für Wireframes, klickbare Prototypen sowie die Erstellung von Spezifikationen für die Entwicklung diente.
Ein weiterer Fokus lag auf der Einführung von drei unterschiedlichen UI-Themes, um eine flexible Anpassung an individuelle Nutzerbedürfnisse zu ermöglichen. Ergänzend wurden individuelle Icons gestaltet und die enge Zusammenarbeit mit UX- und Entwicklungsteams unterstützt, um eine konsistente und qualitativ hochwertige Umsetzung sicherzustellen.
Rollen
UI Designer, UX Designer, Interaction Designer, Usability Engineer
Aufgaben & Verantwortungen
- Gestaltung des UI Designs auf Basis bestehender UX-Konzepte
- Regelmäßige Vorstellung und Validierung der Designs in Fokusgruppen
- Anwendung des visuellen Designs unter Berücksichtigung von Konsistenz und Nutzerfreundlichkeit
- Aufbau und kontinuierliche Pflege des Design Systems in Figma
- Erstellung und Pflege einer Wireframe- und Komponentenbibliothek in Figma
- Prototyping in Figma zur Visualisierung von Konzepten
- Erstellung von Spezifikationen für die Entwicklung
- Gestaltung individueller Icons für die Software
- Einführung und Gestaltung von drei unterschiedlichen UI-Themes
- Gelegentliche Ausarbeitung eigener UX-Konzepte
- Enge Zusammenarbeit mit Konzept- und Entwicklungsteams
- Ansprechpartner für UI-Themen innerhalb des Teams
- Regelmäßige Reviews der Designstände im agilen Entwicklungsprozess
Schlagworte
UI Design, UX Design, Design System, Figma, Prototyping, Fokusgruppen, Visual Design, Icons, Theming, Immobilien-Software, Developer Handoff, kollaboratives Arbeiten, iterative Gestaltung