Close

Kategorien

Vorlage: Designsystem

von Atlassian

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

Vorlage verwenden
Vorlage: Designsystem

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.

So verwendest du die 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

Atlassian ist ein Enterprise-Software-Unternehmen, das Produkte für Softwareentwickler, Projektmanager und das Content Management herstellt.

  • Content design glossary template

    Atlassian

    Content design glossary

    Teach writers how to use product names, industry terms, and other content with an A-Z guide.

  • Content strategy template

    Atlassian

    Inhaltsstrategie

    Erstelle einen Plan für Inhaltsstrategien und organisiere deinen redaktionellen Kalender.

  • Customer interview report template

    Atlassian

    Bericht zum Kundeninterview

    Aufschlussreiche Erkenntnisse aus Kundeninterviews mit dem Bericht zum Kundeninterview