Designsystem-Vorlage

von Atlassian

Entwickle zusammen mit den Profis ein einheitliches Designsystem, um dein Designteam zu erweitern.

Wichtige Features
Dokumentation
Abstimmung im Team
Wissensdatenbank

KATEGORIEN

Design
Seite-Vorlage

Während dein Unternehmen wächst, musst du wahrscheinlich auch deine Marke und dein Design weiterentwickeln. Mit einem Designsystem beschleunigst du nicht nur den Designprozess, sondern beseitigst auch Unstimmigkeiten und reduzierst unternehmensweit die Designschuld. Die Vorlage für Designsysteme gibt dir Hilfsmittel an die Hand, um Designprinzipien und Dokumentkomponenten zu definieren sowie Regeln und Best Practices für Design, Schreiben und mehr zu erklären. Das ist der perfekte Ausgangspunkt für jedes Designsystem.

Verwendung der Vorlage "Designsystem"

Schritt 1. Designprinzipien definieren

Dein Designsystem basiert auf deinen Designprinzipien. An diesen Werten kannst du dich orientieren, wenn du neue Produkte, Funktionen und Funktionalitäten entwickelst. Sie interagieren miteinander und erschaffen dein einzigartiges Erscheinungsbild. Entscheide dich für konkrete Prinzipien, die die einmalige Perspektive deines Unternehmens zeigen und mit denen Designer Spannungen oder Konflikte lösen können.

Schritt 2: Visuelle Sprache beschreiben

Nach den Designprinzipien geht es nun um die visuelle Sprache. Dazu gehören deine Farbpalette, Typographie, Regeln zu Größe und Abstand sowie deine Bibliotheken für Symbole und Abbildungen. Jetzt musst du für jedes Designelement die Regeln festlegen, die Designer anwenden sollen. Vergiss aber auch nicht, einige Verhaltensregeln hinzuzufügen, um zu zeigen, wie die Elemente in der Praxis verwendet werden.

Schritt 3: Schreibregeln verfassen

Nach der visuellen Ebene geht es weiter zum Text. Jede Organisation hat einen anderen Schreibstil und eine andere Stimme. Selbst Regeln für Groß- und Kleinschreibung Interpunktion und Zahlen können von einem Designteam zum nächsten variieren. Notiere die wichtigsten Schreibregeln, füge Markenbegriffe zu deinem Lexikon hinzu und erstelle am Seitenanfang einen Spickzettel, um die wichtigsten Fragen zu beantworten oder das Designteam an wichtige Schreibkonventionen zu erinnern.

Schritt 3: Schreibregeln verfassen

Schritt 4: Best Practices ausbauen

Du weißt, was für dein Designteam funktioniert und was nicht. Notiere im nächsten Abschnitt unter anderem deine Best Practices für Zugänglichkeit, Browser-Support und mobiles Design. Damit haben Designer einen kleinen Spickzettel, mit dem sie bewährte Designs entwickeln können, die sowohl wunderschön als auch integrativ sind.

Schritt 5: Komponenten dokumentieren

Jetzt kann es losgehen. Füge für jede Komponente in deinem Designsystem ein Code Snippet ein und beschreibe anhand der Tabellen in diesem Abschnitt die Möglichkeiten, wie es in verschiedenen Designkontexten bearbeitet werden kann. Mit diesem Abschnitt gewährleistest du, dass die Entwickler in deiner Organisation deine Designs korrekt und einheitlich implementieren – er hat also deine volle Aufmerksamkeit verdient.

Schritt 5: Komponenten dokumentieren

Related Templates

Glossar zum Inhaltsdesign

Glossar zum Inhaltsdesign

Bringe Autoren mit einem umfassenden Leitfaden bei, wie sie Produktnamen, Branchenbegriffe und andere Inhalte richtig nutzen.

von Atlassian
Weitere Informationen
Inhaltsstrategie

Inhaltsstrategie

Erstelle deine Inhaltsstrategie und organisiere deinen redaktionellen Kalender

von Atlassian
Weitere Informationen
Glossar zum Inhaltsdesign

Glossar zum Inhaltsdesign

Bringe Autoren mit einem umfassenden Leitfaden bei, wie sie Produktnamen, Branchenbegriffe und andere Inhalte richtig nutzen.

von Atlassian
Weitere Informationen
Inhaltsstrategie

Inhaltsstrategie

Erstelle deine Inhaltsstrategie und organisiere deinen redaktionellen Kalender

von Atlassian
Weitere Informationen
Bericht zum Kundeninterview

Bericht zum Kundeninterview

Aufschlussreiche Erkenntnisse aus Kundeninterviews mit dem Bericht zum Kundeninterview

von Atlassian
Weitere Informationen