Inhaltsbereich Navigation Navigation Fußzeile

Was Sie vom Design System erwarten können

Das Visual-, User Interface- & Interaction-Design, die Barrierefreiheit und der zur Umsetzung der Komponenten benötigte Frontend-Code werden in der Komponenten-Bibliothek des Design Systems musterhaft spezifiziert und beschrieben. Dies unterstützt die schnelle Erstellung und Iteration von Prototypen zur Überprüfung und Abnahme durch die jeweiligen Fachseiten und beschleunigt den Übergang in die Entwicklung.

Die modularen Muster der Komponenten-Bibliothek werden in denselben Web-Technologien erstellt, die sie selbst beschreiben (d. h. HTML, CSS und JavaScript sowie alle Aspekte der Oberflächen-Designs) und zeigen beispielhafte Umsetzungen sämtlicher Komponenten. Die Muster können damit in ihrer dokumentierten Form unmittelbar in die Implementierung übernommen werden. Dies vereinfacht auch das Testen, da Komponenten bereits auf ihre Browser-Kompatibilität und Barrierefreiheit geprüft sind.

Wichtig ist die Vereinbarung zwischen allen Projektbeteiligten, dass das Design System immer führend ist. Hierdurch stellen wir sicher, dass für den Projekterfolg essentielle Anforderungen an die allgemeine Code-Qualität, die Barrierefreiheit, die Geräte- und Browser-Kompatibilität und die Frontend-Performance sowie die nachhaltige Wartbarkeit zum frühestmöglichen Zeitpunkt beschrieben, qualitätsgesichert und umgesetzt sind und nicht erst nach der Implementierung berücksichtigt werden.

Alle Inhalte des Design Systems werden im laufenden Prozess anhand konkreter Bedarfe entwickelt. Das heißt initial werden die fachlichen Anforderungen mit den Fachbereichen ausgetauscht: Was muss das Verfahren leisten? Welche Informationen sollen dargestellt werden? Welche Aktivitäten sollen Nutzende mit der Anwendung durchführen? Was sind die gestalterischen Anforderungen an die neue Oberfläche? Diese Anforderungen werden durch die beteiligten Experten mit dem Design System abgeglichen, um möglichst früh kritische Punkte zu identifizieren und zu beseitigen.

Somit liefern wir

  • Unterstützung der Umsetzung innerhalb des geschaffenen Funktionsrahmens, fortlaufende Bewertung der Umsetzbarkeit innerhalb der durch die verwendeten Frameworks gesetzten technischen Grenzen und auch Validierung der Umsetzbarkeit von Anforderungen im Sinne der Gebrauchstauglichkeit und Barrierefreiheit.
  • Konsistenz in Inhalten, Funktionalitäten, deren Darstellung und Verhalten über alle beteiligten Verfahren hinweg, dadurch auch leichtere Skalierbarkeit durch die vorgefertigte Komponente, wodurch auch unnötige parallele Aktivitäten vermieden werden.
  • Lieferung von der User Interface- & Visual Designs, Interaction Designs und Frontend-Codes auch über den bisher bekannten Umfang hinaus zur stetigen Weiterentwicklung der digitalen Angebote des Zolls.
  • Sicherstellung der erwarteten Barrierefreiheit nach BITV 2 in der jeweils gültigen Fassung, Festlegung der Verantwortlichkeiten in Konzept, Redaktion, Design, und Entwicklung inklusive klarer Lösungswege und Akzeptanzkriterien. Festlegung des zu berücksichtigenden Endgeräte & Browser inkl. assistiver Hilfsmittel wie z. B. Screenreader.
  • Messkriterien und Handreichungen für Performance, Suchmaschinen-Optimierung, Geräte- und Browser- Kompatibilität, inkl. Festlegung der Abnahmekriterien.
  • Testkonzept Barrierefreiheit & Usability (Automatisierte Tests, Geräte- und Browser-Tests inkl. assistiven Hilfsmitteln, Nutzertests nach anerkannten Usability-Heuristiken). Unterstützung bei den Nutzertests, Begleitung von Vorbereitung und Durchführung der Tests, sowie Auswertung, Rückschlüsse & Empfehlungen.
  • Beratung und Unterstützung bei der Umsetzung zusätzlicher User Stories, die sich aus den Anforderungen des angepassten Designs ergeben.
  • Wichtige Abgrenzung: Rein fachliche Anforderungen werden im Design System nicht behandelt.

Herausforderung?

Mehr, besser, schneller

Um skalierbare komplexe Lösungen mit hoher gestalterischer und technischer Qualität liefern zu können benötigen alle Beteiligten integrierte Prozesse, angefangen bei Anforderungen und Konzept über Design und Entwicklung bis zu QA.

Wert?

Weniger Aufwand für Anpassung, mehr Zeit, um Nutzerprobleme zu lösen

Das Design System hilft bei Organisation und Management aller Anwendungen, die auf ihm basieren und unterstützt bei der Fehlervermeidung in UI & Code.

Ansatz?

Design System als Methodik

Lieferung wiederverwertbarer Komponenten für den Bau von Masken zur Erreichung visueller Konsistenz über Dienste hinweg, verbunden mit Einsparungen in der Implementierung.

Versprechen?

Solider Governance-Prozess

Wir bilden gemeinsam eine Gruppe von Experten mit der Erfahrung in großen Design Systemen, Abstimmungsprozessen und Design Management, Versionierung, Testen und Integration in laufende Entwicklungsprozesse.

Vorteile?

Ein System, viele Dienste

  • Qualität des Codes und Konsistenz im Design
  • Dokumentation und Wissenstransfer
  • Verbesserte Gebrauchstauglichkeit und Barrierefreiheit
  • Von Natur aus skalierbar.

Ist es effizient?

Ja.

Auch wenn die initiale Spezifizierung aller Komponenten sicher Zeit in Anspruch nimmt, so zahlt sich diese Investition schnell aus, wenn es um zentral verwaltete Aktualisierungen und Fehlervermeidung oder -behebungen geht.