Case Study: Sonepar Kombitool
Sonepar Suisse-Kunden verlangen eine nahtlose Bestellung von Teilen ohne eigene Lager. Das Replattformierungsprojekt bietet ein flexibles System, das sich an individuelle Kundenbedürfnisse anpassen lässt. Der Fokus liegt darauf, die Benutzerfreundlichkeit der B2B-Plattform zu verbessern, indem das Kombitool optimiert wird.
Herausforderung
Ich erweiterte das Designsystem, um sowohl die mobile als auch die Desktop-Version einzubeziehen, während ich das verbesserte UI des Kombitools entwickelte. Dadurch wurde die Benutzererfahrung für Sonepars Nutzer erheblich verbessert. Dies beinhaltete die Optimierung des Bestellvorgangs und die Verfeinerung der Drag-and-Drop-Funktion zur Definition von Schalterkombinationen sowie die Verbesserung der Merkliste für effizientes Bestellspeichern.
Lösung
Als UX-Designerin folgte ich dem Styleguide der Sonepar-CI, arbeitete mit Projektmanagern, Produkt Ownern, Lead Designern und Frontend-Entwicklern, zusammen und gestaltete den UX-Flow sowie das High-Fidelity-Prototyping des Combitools über mehrere Sprints.
Meine Rolle
Tools
Sketch, Adobe XD
Bronze, Best Swiss Web 2020
Award
Prozess
Mein Ansatz umfasste die kontinuierliche Anpassung des Designsystems und die Integration von Feedback während der mehrstufigen Entwicklung des Kombitools. Dabei arbeitete ich eng mit dem Projektteam zusammen, um sicherzustellen, dass die Lösungen den höchsten Standards in Benutzerfreundlichkeit und Ästhetik entsprachen.
Das Ergebnis
Mit dem Kombitool können Kund*innen beliebige Schalterkombinationen per Klick oder Drag & Drop individuell zusammenstellen und bestellen.
Vorteile des verbesserten Kombitools:
usability: schnelle und effiziente Bestellung für Techniker*innen
grenzenlose Individualisierungsmöglichkeiten: Spezielle Anforderungen können im Handumdrehen visualisiert werden.
volle Preistransparenz: Kund*innen wissen jederzeit, was die individuelle Produktkonfiguration kostet.
Reflektion
Als ich das Projekt übernahm, gestaltete ich zunächst die UI mit Sketch, noch bevor das Rebranding von Sonepar stattfand. In dieser Phase gab es keinen klaren Styleguide, was die Erstellung von Design-Komponenten anspruchsvoll gestaltete, da unterschiedliche Teammitglieder (Projektmanager, Frontend-Entwickler) unterschiedliche Vorstellungen hatten. Nach dem Rebranding wurde der Styleguide deutlich klarer und moderner, was unsere Designentscheidungen vereinfachte. In dieser Phase nutzte ich Adobe XD für das Design, was den Arbeitsablauf zwischen mir und dem Lead-Designer optimierte.