DESIGN REBOOT 2015 Styleguide Version 2.0

Transkript

1 DESIGN REBOOT 2015 Styleguide Version 2.0 September 2016

2 Inhalt Einleitung 3 Logo 4 Farbe 9 Schrift 10 Farbflächen 13 Beispiele 14 Seite 2

3 EINLEITUNG Out with the Old Nicht nur das Redesign der FDP dieses Jahr, sondern auch 13 Jahre mit unserem blau-gelben JuLis-Design haben uns dazu gebracht, ein neues visuelles Kapitel aufzuschlagen. Auch wenn unser altes Design zwischenzeitlich modernisiert wurde, ist nun die Zeit gekommen, alte Zöpfe abzuschneiden. in with the New! Und wir haben die Zöpfe radikal abgeschnitten. Neues Logo, keine Abkürzung mehr als Name und eine andere Farbwelt. Konzentriert, klar und frisch so wie unsere Inhalte und Ideen sind und sein solten. Alle Vorlagen online Die wichtigsten Vorlagen und euer eigenes Logo könnt ihr unter diesem Link abrufen: Seite 3

4 LOGO Schützt das Logo! Wie bisher wird es unser Logo in Varianten für den Bundesverband sowie für alle Untergliederungen geben. Im Einsatz bitte immer darauf achten, dass die Schutzzonen nicht unterschritten werden. D. h. Seitenränder oder andere grafische Elemente sollten nicht näher als hier definiert an das Logo heranrücken. Muster-Bundesland Seite 4

5 LOGO & HINTERGRUND Übliche Anwendung In diesen Kombinationen kann das Logo mit farbigem Hintergrund in jeder Größe und bei jeder Anwendung verwendet werden. Sonderfall auf Magenta Wenn die Farbfläche Magenta nicht dominiert, kann auch diese Variante benutzt werden. Einfarbiger Druck Falls es aus technischen oder Kostengründen nicht anders möglich ist, wird das Logo komplett in Schwarz oder Magenta gedruckt. DONT'S Nur die oben gezeigten Versionen verwenden! Eigenmächtige Kombinationen ohne vorherige Absprache mit dem Bundesverband sind nicht erlaubt. Seite 5

6 LOGO AUF FOTOS Übliche Anwendung Grundsätzlich sollte Logos auf Fotos nur auf einfarbigen Rahmen (Auführliches zum Verfahren siehe Seite 13) verwendet werden. In manchen Fällen, wie beispielsweise bei runden Stickern, ist die Anwendung dieser Vorgabe allerdings nicht optimal umsetzbar. Andere Anwendungsmöglichkeiten Sollte die Platzierung von Rahmen technisch oder gestalterisch nicht möglich sein, so kann die Platzierung des Logos auch direkt auf dem Foto vorgenommen werden. Eine solche Platzierung ist ausschließlich auf relativ uniformen dunklen oder hellen Hintergründen in den abgebildeten Varianten zulässig. Bei dunklen Hintergründen ist die Farbvariante Gelb/ Weiß, bei hellen Hintergründen ist die Farbvariante Gelb/Magenta zu wählen. DONT'S Die Verwendung unseres Logos auf nichteinheitlichem Grund ist nicht gestattet. Auch die Verwendung einer Logovariante auf nicht-farbkonformen Hintergründen ist nicht zulässig. Seite 6

7 LOGO & UNTERZEILE Lokale Anpassung Für alle Untergliederungen besteht die Möglichkeit, das Logo mit einer passenden Unterzeile zu versehen. Mehr als eine Zeile ist nicht erlaubt. Hier steht immer nur der Name der jeweiligen Gebietskörperschaft bzw. Region im überregionalen Kontext kann auch unsere Webadresse eingefügt werden. Die Worte Landesverband, Bezirksverband, Kreisverband, Ortsverband und Stadtverband haben in der Logo-Unterzeile nichts zu suchen. Logo-Generator Ihr könnt ganz einfach euer eigenes Logo in verschieden Formaten mit dem Online-Generator erstellen: LOGO & SOCIAL MEDIA Klein und fein Für die Profil- und Avatar-Icons in den sozialen Medien bereiten wir für euch verschiedene Farbvarianten vor. Aus Gründen der Lesbarkeit verwenden wir hier nur das jl-signet. Seite 7

8 REGIONALISIERUNG DER LOGOVARIANTEN Don't touch my... Die Bildmarke "jl" darf grundsätzlich nicht durch durch angehängte Icons, Tiere, Farben oder ähnliches regionalisiert werden. Eine Regionalisierung ohne Antasten der Bildmarke ist ausschließlich nach Rücksprache mit dem Bundesverband möglich. Seite 8

9 FARBE CMYK / RAL / SONDERFARBEN Wir haben uns entschieden, die Farben der Freien Demokraten zu übernehmen damit besonders bei gemeinsamer Kommunikation die Zusammengehörigkeit für jeden schnell ersichtlich ist. Die Farbwerte sind auch hier die reinen Druckfarben Yellow, Magenta und Cyan. RGB Die RGB-Werte für Bildschirmdarstellung unterscheiden sich geringfügig von den umgewandelten CMYK Werten. Bitte immer daran denken, für welche Ausgabe euer Erzeugnis geplant ist. CMYK CMYK CMYK RGB RGB RGB 0/0/100/0 0/100/0/0 100/0/0/0 255/237/0 229/0/125 0/158/227 RAL RAL RAL Hex-Wert Hex-Wert Hex-Wert RAL 1026 RAL 4010 RAL 5015 #FFED00 #E5007D #009EE3 SONDERFARBE SONDERFARBE SONDERFARBE Pantone Gelb C Pantone Magenta C Pantone Cyan C Seite 9

10 SCHRIFT Montserrat Die Logo-Schrift, für Titel, Headlines, Auszeichnungen eben alles, was hervorstechen soll. Kürzere Texte wie Einleitungen können auch im Regular-Schnitt gesetzt werden. Die Montserrat Black sollte vorerst nur in Großbuchstaben und wenn möglich auf Titel-Balken eingesetzt werden. Merriweather Die Merriweather-Schrift wird grundsätzlich nur in Fließtexten eingesetzt, da sie über längere Strecken lesefreundlicher ist und einen guten Kontrast zur Montserrat bietet. Montserrat Regular abcdefghijklmnopqrstuvwxyzüöäß ABCDEFGHIJKLMNOPQRSTUVWXYZÜÖÄ! Montserrat Bold abcdefghijklmnopqrstuvwxyzüöäß ABCDEFGHIJKLMNOPQRSTUVWXYZÜÖÄ! Merriweather Regular abcdefghijklmnopqrstuvwxyzüöäß ABCDEFGHIJKLMNOPQRSTUVWXYZÜÖÄ! Merriweather Italic abcdefghijklmnopqrstuvwxyzüöäß ABCDEFGHIJKLMNOPQRSTUVWXYZÜÖÄ! Merriweather Bold abcdefghijklmnopqrstuvwxyzüöäß ABCDEFGHIJKLMNOPQRSTUVWXYZÜÖÄ! Open Source! Beide Schriftfamilien sind unter der SIL Open Font License v1.10 veröffentlich worden. Demnach könnt ihr diese Schriften frei erwerben und verwenden. Für Montserrat Bold und Regular sowie Merriweather sind auch Webfonts vorhanden. Montserrat Black ABCDEFGHIJKLMNOPQRSTUVWXYZÜÖÄ! Merriweather Bold Italic abcdefghijklmnopqrstuvwxyzüöäß ABCDEFGHIJKLMNOPQRSTUVWXYZÜÖÄ! Seite 10

11 SCHRIFT / ANWENDUNGSBEISPIEL Montserrat Black Für Schmuckbuttons ganz nach Belieben... mehr Vielfalt! Montserrat Bold Merriweather Regular Montserrat Black DONT'S Nicht erlaubt ist die Verwendung von Magenta Schrift auf blauem Hintergrund und vice versa. Selbiges gilt für die Titelbalken! Merke Dir genau: Magenta nie auf Blau! RIAECUSC RIAECUSC Offici officationem aspernatur aliquos eate nem volutem. Equae et quibus eos eicitae coremporem fugiam este vernam nus soluptatem facepelis estiberum receatem comnisimodi cum Offici officationem aspernatur aliquos eate nem volutem. Equae et quibus eos eicitae coremporem fugiam este vernam nus soluptatem facepelis estiberum receatem comnisimodi cum Seite 11

12 SCHRIFT / TITEL-BALKEN Für knallige Titel setzen wir die Montserrat Black in Versalien auf einen Titelbalken. Dieser ist ein Rechteck, welches um 15 geschert wird. FETTE ANSAGE! 15 DONT'S In Titelbanken sind ausschließlich GROSSBUCHSTABEN zu verwenden. Die Verwendung von Kleinbuchstaben ist hier nicht zulässig. Titelbalken müssen immer mit 15 geschert sein. Damit ist unser Design unverkennbar. Die Verwendung von nicht gescherten Rechtecken ist für zentrale Elemente nicht erlaubt. Fette Ansage! Fette Ansage! FETTE ANSAGE! FETTE ANSAGE! Seite 12

13 FARBFLÄCHEN / HINTERGRÜNDE Das Spitze ins Eckige Die Farbaufteilung der Hintergrundflächen ergibt sich aus dem Verschnitt des spitzen Elements des Logo-Signets mit der darunterliegenden Farbe. Hier gibt es keine besondere Anweisung, wie das Endergebnis aussehen soll, nur den Tip, dass die Flächen möglichst einen dynmischen Eindruck ergeben sollen und die Fläche, die sich aus dem Signet ergibt, den größeren Anteil im Verhältnis hat. Um die Formfindung zu vereinfachen, rotieren wir das Icon in 45 Schritten eine horizontale oder vertikale Spiegelung ist auch möglich. Hier ein paar Beispiele in erlaubten Farbkombinationen: DONT'S Nicht erlaubt ist die großflächige Verwendung von Magenta im Vordergrund. Außerdem merke Dir genau: Magenta nie auf Blau! Seite 13

14 BEISPIEL VISITENKARTE Konstantin Kuhle Bundesvorsitzender Fon Mail junge liberale e.v. / Reinhardtstraße 14 / Berlin Fon / Fax Mail info@julis.de / Web Seite 14

15 BEISPIEL ROLLUP Seite 15

16 BEISPIEL RÜCKWAND Seite 16

17 Bundesgeschäftsstelle Reinhardtstraße Berlin Fon Fax Internet