Dieses Designsystem beschreibt Farben, Typografie, Abstände
und wiederverwendbare Bausteine für neue Bowfire-Seiten.
Aber jedes braucht einen Grund.
Wir gestalten nicht nach einem starren Muster.
Wir schaffen eine gemeinsame Haltung, aus der sich Gestaltung ableiten lässt.
Freiraum gehört zum Design. Große Flächen schaffen Konzentration
und geben Bildern, Sprache und Inhalten Raum.
Die Gestaltung wirkt gemacht, nicht technisch. Materialien,
Bilder, Sprache und Formen bleiben glaubwürdig und nahbar.
Lieber eine starke Aussage als viele gleichzeitige Botschaften.
Bilder schaffen Atmosphäre. Texte führen weiter.
Inhalte erscheinen nicht gleichzeitig, sondern in einer verständlichen
Reihenfolge. Jede Seite führt Schritt für Schritt.
Orange hebt hervor. Türkis führt. Beige beruhigt.
Dunkle Flächen schaffen Tiefe. Farbe ist kein Selbstzweck.
Wir entwickeln wiederverwendbare Werkzeuge. Neue Seiten entstehen
aus bekannten Bausteinen und nicht jedes Mal von vorn.
Wir erklären nichts größer, als es ist. Unsere Sprache bleibt ruhig,
konkret, ehrlich und handwerklich.
Wiederkehrende Strukturen schaffen Orientierung. Besucher sollen
sich auf Inhalte konzentrieren und nicht auf die Bedienung.
Die Farben werden nicht beliebig eingesetzt. Jede Farbe übernimmt
eine feste Rolle innerhalb der Bowfire-Gestaltung.
Hervorhebung und Handlung
#feaf29
Führung und Orientierung
#4fa8ad
Leichte Akzente
#6ac6cb
Grundton und Tiefe
#2b2521
Dunkle Bühnen
#15100c
Ruhige Grundfläche
#f0ece6
Flächenwechsel
#efe9df
Helle Inhalte
#f7f5f1
Eine Schrift für die gesamte Bowfire-Gestaltung.
Unterschiede entstehen durch Größe, Gewicht, Abstand und Farbe –
nicht durch wechselnde Schriftarten.
Für Überschriften, Kicker, Fließtexte, Hinweise und Bedienelemente.
Die Hierarchie entsteht durch Größe, Gewicht, Zeilenhöhe und Farbe.
.bf-display
.bf-heading-1
.bf-heading-2
.bf-heading-2 + bf-color--turquoise
.bf-heading-3
.bf-heading-3 + bf-color--turquoise
bf-kicker
bf-kicker + bf-color--dark
bf-kicker + bf-color--orange
Ein guter Pfeil ist kein Zubehör.
Er ist ein eigenes kleines Handwerk.
.bf-lead
Ein Pfeil muss zum Bogen, zur Auszugslänge und zur Schießtechnik
passen. Erst wenn seine Bestandteile zusammenarbeiten, entsteht
ein ruhiger und verlässlicher Flug.
.bf-text
Änderungen und Ergänzungen werden direkt im Designsystem dokumentiert.
.bf-small
Ohne laut zu werden.
Buttons führen zu einer konkreten Handlung. Farbe und Ausführung
zeigen ihre Bedeutung, nicht ihre Wichtigkeit um jeden Preis.
Ohne zu drängen.
Links laden zum Weiterlesen ein und schaffen Orientierung.
Sie bleiben bewusst ruhiger als Buttons und verändern beim
Darüberfahren lediglich ihre Farbe.
Ein guter Pfeil entsteht nicht zufällig.
In unserer Pfeilwerkstatt zeigen wir, wie Material, Spine und Befiederung zusammenspielen.
Die Abstände folgen einer festen Skala. Dadurch bleiben neue Seiten
ruhig und zusammengehörig.
--bf-space-xs
8 px
--bf-space-sm
16 px
--bf-space-md
24 px
--bf-space-lg
40 px
--bf-space-xl
64 px
--bf-space-2xl
96 px
--bf-space-3xl
128 px