Erscheinungsbild · 2025
Eigene Marke
Logo, Farben und Schriften für mich selbst — neun Seiten Styleguide
- Auftraggeber
- Eigenes Projekt, als Semesterarbeit an der [Berufsfachschule]
- Jahr
- 2025
- Rolle
- Alles: Recherche, Entwürfe, Zeichnung, Satz des Styleguides. Bewertung durch [Fachlehrperson].
- Werkzeuge
- Adobe Illustrator · Adobe InDesign · Skizzenbuch und Bleistift · Testdrucke auf A3
Ausgangslage
Die Aufgabe hiess: ein eigenes Erscheinungsbild entwickeln und in einem Styleguide festhalten. Ich hatte bis dahin jedes Schulprojekt neu gestaltet — andere Schrift, andere Farben, jedes Mal von vorne. Ich wollte meine Entscheidungen einmal festhalten, statt sie jedes Mal neu zu treffen.
Vorgehen
Von Hand anfangen
Rund vierzig Skizzen mit dem Bleistift, die meisten Varianten meiner Initialen. Erst als ich zwei Schwünge gespiegelt übereinanderlegte, stand die Form: ein Zeichen, das wie ein Schmetterling wirkt, ohne einer zu sein.
Sauber nachzeichnen
Das Zeichen in Illustrator als geschlossene Vektorkurven nachgebaut, Ankerpunkte reduziert, Seitenverhältnis auf 30 × 22 festgelegt. Dazu eine Schutzzone von einer vollen Logobreite ringsum und eine Mindestgrösse, unter der die Haarstriche wegbrechen.
Farben und Schriften begründen
Drei Töne: Mauve als Leitfarbe, Aubergine als Gegengewicht, Creme zum Aufhellen. Ein vierter hätte eine Aufgabe gebraucht, die es nicht gab. Bei den Schriften eine Schreibschrift für die Titel und Roboto für alles andere — die Schreibschrift setzt den Ton, die Groteske hält die Ordnung.
Neun Seiten setzen
Querformat, Schnittmarken an den Ecken, Kolumnentitel oben links, Seitenzahl oben rechts. Jede Sektion nach demselben Muster: Titel in der Schreibschrift, Unterzeile in Roboto Bold, darunter der Inhalt.
Das Zeichen
Zwei gespiegelte kalligrafische Schwünge, die zusammen eine Form ergeben. Reine Vektorkurven, kein Effekt, kein Schriftzug daneben. Die Schutzzone ist ringsum eine volle Logobreite breit, die Mindestgrösse im Druck 30 × 22 mm — darunter brechen die feinen Haarstriche weg.
Die Farben
Abb. 2 — Die drei Farben mit ihren Werten. Anklicken kopiert den HEX-Wert.
| Probe | Kombination | Verhältnis | Verwendung |
|---|---|---|---|
| Aa | Aubergine auf Papier | 11.0:1 | Fliesstext, Titel, alles. |
| Aa | Creme auf Aubergine | 11.1:1 | Dunkle Flächen. |
| Aa | Mauve auf Aubergine | 6.3:1 | Titel auf dunklem Grund. |
| Aa | Mauve auf Papier | 1.8:1 | Nie für Text. Nur Linien, Ringe, Ziffern. |
«Ich habe diese Farben genommen das sie am besten mir entsprechen und zu mir passen.»
Die Schriften
Jennifer Knecht
Titel · Schreibschrift
56–88 px / 1.05
Laufweite normal
Die Groteske hält die Ordnung
Untertitel · Roboto Bold
24–34 px / 1.18
−0.012 em
Zwei Schriften, drei Aufgaben — verwechseln kann man sie nicht. Die Schreibschrift setzt den Ton, die Groteske hält die Ordnung, der Kleinsatz ordnet ein.
Fliesstext · Roboto
16–17 px / 1.55
64 Zeichen Zeilenlänge
Ein Hinweis zur Auslieferung. Im Styleguide steht Snell Roundhand Bold — eine macOS-Systemschrift. Auf Windows und Android gäbe es sie nicht, und der übliche Ersatz wäre eine Pinselschrift. Diese Website liefert deshalb Pinyon Script aus: dieselbe Klasse, dasselbe Buchstabenskelett, nur feiner.
Ergebnis
Neun Seiten, abgegeben und angenommen. Seither benutze ich das System für alles Eigene — die Bewerbungsunterlagen, den Instagram-Auftritt und diese Website. Weil die Regeln aufgeschrieben sind, sehen die drei gleich aus, ohne dass ich sie nebeneinanderlegen muss.
Was ich daraus gelernt habe
Seite neun hiess «Anwendungsbeispiele» und blieb leer — ich hatte damals nichts, worauf ich das System hätte anwenden können. Erst beim Bauen dieser Website habe ich gemerkt, was im Dokument fehlte: eine Regel, dass Mauve nie Text tragen darf. Auf Papier hat es nur 1.8:1 Kontrast. Ein Styleguide, der schön aussieht, aber die unbequemen Fälle nicht regelt, ist nur die halbe Arbeit.