Johannes Klein
MenüSchließen

Scopevisio

Product Design System (UX/UI): ERP-Software „Scopevisio“

Projektumfang

  • Senior Product Designer & Design Engineer: UX/UI
  • Design System
  • Token-Architektur
  • Leitung Design-Team

Laufzeit

Seit 2018

Werkzeuge

Figma, Tokens Studio, FigJam, Miro

Eine ERP-Produktlinie, die Fachleute schneller macht, statt sie auszubremsen: ein Design System für Desktop, Mobile und Add-ons.

Scopevisio ist eine Cloud-Unternehmenssoftware für die Kernprozesse im Mittelstand – von Rechnungseingang und Reisekosten über Warenwirtschaft bis zu Personal, Dokumenten und Berichtswesen.

Seit 2018 verantworte ich Redesign und Neukonzeption der gesamten Produktlinie: Design System von Grund auf, UI, (Mikro-)Interaktionen, Nutzerführung, Service-Design-Sprache und Markenelemente.

01

Zielsetzung

Ziel des Unternehmens und der Nutzer – und mein Beitrag dazu.

Unternehmen
Eine gewachsene Produktlinie soll als ein konsistentes Produkt auftreten – wartbar, ohne dass jedes Team die Grundlagen neu erfindet.
Nutzer
Fachanwender mit großen Datenmengen erledigen Aufgaben schneller und fehlerärmer und finden sich in jedem Modul sofort zurecht.
02

Herausforderung

Daten, Erkenntnisse und Schmerzpunkte, auf denen die Lösung aufbaut.

Eine Bestandsaufnahme der Bestandssysteme zeigte viele Datentypen, Rollen und Prozesse, aber keine gemeinsame Gestaltungsgrundlage.

  • Gleiche Aufgaben wurden je Modul anders bedient.
  • Formulare, Tabellen und Dashboards waren dicht, aber schwer zu überblicken.
  • Desktop, Mobile und Add-ons folgten eigenen Mustern.
03

Lösung

Ansatz, Interaktionsmuster, Oberflächen und Vorgehen.

Ansatz & Interaktionsmuster

Ich habe die Produktlinie als System gedacht: eine Informationsarchitektur für alle Module, wiederverwendbare Muster für Listen, Detailmasken, Formulare und Dashboards und Design Tokens, die in Figma und im Code gleich sind.

Product Design System (UX/UI): ERP-Software „Scopevisio“
Informationsarchitektur der Produktlinie.
Product Design System (UX/UI): ERP-Software „Scopevisio“
Grundlagen des Design Systems.

Oberflächen, Abläufe & Vorgehen

Vom Low-Fi-Wireflow über ausgearbeitete Boards zu dokumentierten Komponenten und Patterns, die die Entwicklung direkt übernimmt. Jeder Screen folgt denselben Regeln: Inhalt vor Dekoration, klare Hierarchie in dichten Daten.

Product Design System (UX/UI): ERP-Software „Scopevisio“
Wireflows: erst grob, dann ausgearbeitet.
Product Design System (UX/UI): ERP-Software „Scopevisio“
Product Design System (UX/UI): ERP-Software „Scopevisio“
Product Design System (UX/UI): ERP-Software „Scopevisio“
Mehrere Clients, eine Oberflächenlogik.
Product Design System (UX/UI): ERP-Software „Scopevisio“
Mobile App mit denselben Mustern.
Product Design System (UX/UI): ERP-Software „Scopevisio“
Komponenten im Überblick.
Product Design System (UX/UI): ERP-Software „Scopevisio“
Pattern-Dokumentation.
04

Wirkung & Validierung

Ergebnis und Validierung.

Ergebnis
Ein gemeinsames Design System verbindet Design und Code über Tokens; Desktop, Mobile und Add-ons teilen ein Oberflächenkonzept, neue Module nutzen dieselben Bausteine.
Validierung (geplant)
Messung von Bearbeitungszeit und Fehlerquote in Kernabläufen, Nutzertests neuer Muster vor der Einführung.

Alle Projekte →

Lassen Sie uns Ihr Projekt angehen.

Projekt besprechen →