Ein Design-System für alles, was Sie digital veröffentlichen.

Das hängt vor allem von Größe und Umfang Ihrer Website ab. Bei vielen Seitentypen, mehreren Redakteuren oder regelmäßigen Erweiterungen lohnt sich ein Design-System auch für eine einzelne Website, spätestens mit der zweiten Anwendung deutlich. Für kleinere Websites liefern wir einen Gestaltungsentwurf mit Modulbaukasten, der sich später zum Design-System erweitern lässt. Welcher Weg passt, klären wir im Erstgespräch anhand Ihrer Pläne für die kommenden Jahre.

Storybook ist eine eigene Website, auf der alle Bausteine Ihres Design-Systems übersichtlich gesammelt sind, zum Beispiel Buttons, Formulare, Navigationen oder Teaser. Jede Komponente lässt sich dort einzeln aufrufen, anklicken und in ihren verschiedenen Zuständen ansehen. Man kann es sich wie einen Katalog vorstellen: Wer eine neue Seite plant oder eine Anwendung entwickelt, schaut im Storybook nach, welche Bausteine es bereits gibt, wie sie aussehen und wofür sie gedacht sind. Zu jeder Komponente stehen Hinweise zur Verwendung und die Ergebnisse der Barrierefreiheitsprüfung. Storybook ist ein verbreitetes Werkzeug, mit dem viele Unternehmen und Agenturen ihre Design-Systeme dokumentieren

Ja. Wir sichten Ihre bestehenden Entwürfe und Bibliotheken in Figma, ordnen sie zu Tokens und Komponenten und zeigen Ihnen, was sich übernehmen lässt und was überarbeitet werden sollte.

Ein Design Token ist ein fester Name für einen einzelnen Gestaltungswert, zum Beispiel für eine Farbe, eine Schriftgröße oder einen Abstand. Statt an vielen Stellen den genauen Farbcode Ihres Markenblaus zu hinterlegen, verwenden Website, Portal und App den Namen „Markenfarbe". Welcher Farbton sich dahinter verbirgt, ist an einer zentralen Stelle festgelegt. Man kann sich das wie ein Adressbuch vorstellen: Sie speichern eine Telefonnummer einmal unter einem Namen und wählen danach nur noch den Namen. Ändert sich die Nummer, passen Sie sie an einer Stelle an. Genauso wird eine neue Markenfarbe oder ein geänderter Abstand zentral gepflegt und von dort in die angebundenen Anwendungen übernommen. So bleibt Ihr Auftritt einheitlich, und Änderungen an der Gestaltung lassen sich mit deutlich weniger Aufwand umsetzen.

Der Design-Entwurf zeigt, wie eine Seite oder ein Baustein aussehen soll. Er ist ein Bild der geplanten Gestaltung. Das Storybook zeigt dagegen die fertig entwickelten Komponenten, so wie sie später auf Ihrer Website oder in Ihrer App erscheinen, und zwar direkt im Browser zum Anklicken und Ausprobieren. Ein Beispiel ist ein Kontaktformular. Im Entwurf sehen Sie, wie das Formular gestaltet ist. Im Storybook können Sie es tatsächlich ausfüllen und sehen, was passiert, wenn ein Pflichtfeld leer bleibt, eine E-Mail-Adresse falsch eingegeben wird oder das Formular gerade abgeschickt wird. Auch die Bedienung per Tastatur lässt sich dort direkt testen. Entwicklung, Redaktion und Qualitätssicherung schauen im Storybook auf denselben Stand. Das erleichtert Abstimmungen und macht Fehler früh sichtbar.

Ja. Wir stellen die Komponenten so bereit, dass Ihre Entwickler sie in eigene Anwendungen einbinden können. Im Storybook finden sie zu jeder Komponente Hinweise zur Verwendung, und in einer Schulung zeigen wir, wie sie damit arbeiten.

Sehr viel. Ein großer Teil der Anforderungen betrifft Bedienelemente: Kontraste, Fokuszustände, Tastaturbedienung, Beschriftungen. Wenn diese Punkte einmal je Komponente gelöst sind, erfüllt jede daraus entwickelte Seite sie automatisch mit.

Nach dem Erstgespräch bekommen Sie ein Angebot mit Positionsliste. Die Größe hängt an der Zahl der Komponenten, der Zahl der Marken und daran, wie viel Gestaltung schon vorliegt.

Das hängt vom Umfang ab, etwa von der Anzahl der Seitentypen und Komponenten und davon, wie viel Gestaltung bereits vorhanden ist. Im Erstgespräch schätzen wir den Zeitrahmen für Ihr Projekt ein, und im Angebot stehen die konkreten Termine.

Ändern sich Farben, Schriften oder Abstände, passen wir die Tokens an. Da alle Komponenten auf diese Tokens zugreifen, übernehmen Buttons, Formulare, Teaser und alle weiteren Bausteine den neuen Stand automatisch. Eine neue Markenfarbe wird also einmal gepflegt und wirkt sich auf jede Komponente aus. Über einen Versionssprung wird der neue Stand ausgerollt, und Anwendungen, die das Paket einbinden, übernehmen ihn beim nächsten Update. Bei umfangreicheren Änderungen, etwa neuen Formen, einer neuen Bildsprache oder einer veränderten Seitenaufteilung, überarbeiten wir zusätzlich die betroffenen Komponenten. Im Storybook sehen Sie jede Anpassung vorab und können sie freigeben, bevor sie auf Website, Portal oder App übertragen wird.

Nein. Ein Design-System ist darauf ausgelegt, dass viele Beteiligte mit derselben Grundlage arbeiten, ob interne Entwickler, andere Agenturen oder Dienstleister. Komponenten, Tokens und Dokumentation können wir deshalb jederzeit problemlos übergeben.