Digitaler Styleguide der VHS Mönchengladbach
Hier können Sie die wichtigsten Elemente des Corporate Designs in allen relevanten Formaten und Definitionen nachschlagen und herunterladen.
Zum besseren Verständnis der Verwendung des Corporate Designs werden Anwendungsbeispiele aufgeführt – die Sammlung ist noch jung und wächst kontinuierlich.
Einen lebendigen Eindruck bekommen Sie jederzeit auf der Website vhs-mg.de und im dort verfügbaren halbjährlichen Magazin.
Das Logo
Das Logopaket »Basic« enthält eine schwarze und eine weiße Variante des Logos. Dateiformat (PNG) und Größe (2.000px) taugen für viele Zwecke im Web und Druck. Durch den transparenten Hintergrund ist es auf diversen Hintergründen platzierbar.
Das Logopaket »Complete« enthält viele weitere Varianten für den spezielleren Einsatz, mit denen sich Grafikprofis gut auskennen. Vektorformate: EPS und SVG. Pixeldaten: PNGs in verschiedenen Größen.
Idee und Eigenschaften des Logos
Das Logo funktioniert in groß und – das ist besonders wichtig – auch in sehr klein, z.B. als »Avatar« im Internet oder als Sponsoren-Logo auf Flyern und Karten. Lesbarkeit im Kleinen bedeutet zugleich Lesbarkeit aus der Ferne. Man kann das Logo sowohl schwarz/dunkel (positiv) als auch weiß/hell einsetzen, das ist ein wichtiges Qualitätsmerkmal eines jeden Logos.
»MG« als Abkürzung für Mönchengladbach ist unmittelbar in das Logo integriert, wie Stadt und VHS also strukturell verbunden. Durch das Ausschreiben des Wortes (»Volkshochschule« statt »VHS«) wird der Wortsinn absichtlich betont: (1) Die VHS ist eine Hochschule, (2) die Zielgruppe ist die breite Bevölkerung.
Die Abtrennung des »S« unterstreicht, mittels Irritation, zusätzlich das »VOLK«, also die Zielgruppe, die Bürger*innen der Stadt. Der Pfeil symbolisiert Begegnung und Kommunikation untereinander.
Positiv – Schwarz auf Weiß
Negativ – Weiß auf Schwarz
Empfohlen – Weiß auf Farbverlauf
Farbwelt
Farben
Das Erscheingsbild der VHS umfasst sieben Farben, von denen nur drei (Farbakkord: Blau/Orange/Pink) regelmäßig zum Einsatz kommen und eine einzige (Blau) als Hauptfarbe definiert ist. Im nächsten Abschnitt der Website finden Sie die Definitionen der Farbwerte für Druck, Web und andere Gebiete.
Verläufe
Die eigentliche Farbwelt kommt erst in den Farbverläufen zum Vorschein. Es gibt 15 Varianten: Je 5 basieren auf Hellblau, Pink und Orange und sollen zu Lebendigkeit und Abwechslung in der Anwendung führen. Die auf Hellblau basierenden Verläufe sind die wichtigsten.
Im Downloadpaket »Basic« finden Sie je zwei Varianten der Verläufe, basierend auf einer der drei Farben aus dem Farbakkord der VHS als JPG (3.000px) in RGB (Für Web und Bildschirme).
Im Paket »Complete« finden Sie (und Grafikprofis) noch mehr Varianten der Verläufe als JPG und ein einzelnes PDF, das alle 15 Verläufe im Farbraum CMYK (Für Drucksachen) umfasst.
Einsatz und Bedeutung der Farben und Verläufe
Die Farben der VHS kommen an sehr unterschiedlichen Stellen zum Einsatz: auf Papier und im Web, auf Schildern, Tragetaschen, Kulis uvm. Um eine möglichst große Ähnlichkeit der Farbtöne in allen Einsatzbereichen (Druckfarben, Lacke, Kunststoffe etc.) zu gewährleisten, stammen sie aus der genormten RAL-Skala.
Als Akkord erzeugen sie einen farbenfrohen Eindruck, ohne »quietschig« bunt zu sein. Durch das Ineinanderfließen der Farben in den Verläufen entstehen unzählige weitere Farbtöne. Diese Mischung ist nicht nur ästhetisch harmonisch, sondern widerspiegelt auch die Buntheit, Vielfalt und den Charakter von Angebot, Team und Publikum der Volkshochschule.
Das Erscheinungsbild der VHS kommt am besten zur Geltung (Drucksachen, Social Media etc.), wenn Schrift und Grafik in weiß oder schwarz auf den farbigen Verläufen stehen. Die Hauptfarbe »Lichtblau« ist immer dann eine gute Alternative, wenn ein Verlauf aus verfahrenstechnischen Gründen unmöglich ist, oder wenn die Buntheit nicht zur Aussage oder der Umgebung passt.
Eine gute Referenz für die vielfältigen Einsatzmöglichkeiten des Corporate Designs sind die Website der VHS (vhs-mg.de) und das Magazin – in aktueller Version auf der Website zu finden. Wenn Sie Inspiration für die Gestaltung im Erscheinungsbild brauchen, gucken Sie sich am besten dort um.
VHS BLAU
RAL (Folie, Lack, etc.)
5012 »Lichtblau«
CMYK (Drucksachen)
85/30/0/0
RGB (Bildschirme/Web)
0/140/200
HEX (Shortcode/Web)
#008CC8
VHS ORANGE
RAL (Folie, Lack, etc.)
1033 »Dahliengelb«
CMYK (Drucksachen)
0/35/90/0
RGB (Bildschirme/Web)
250/160/0
HEX (Shortcode/Web)
#FAA000
VHS PINK
RAL (Folie, Lack, etc.)
4003 »Erikaviolett«
CMYK (Drucksachen)
0/85/0/0
RGB (Bildschirme/Web)
230/90/170
HEX (Shortcode/Web)
#E65AAA
Grafiken
Die Sammlung/Bibliothek für Piktogramme ist schlicht, zeitlos und sehr gut ausgebaut und damit langfristig und vielseitig einsetzbar. Zu Beginn stellen wir einen kleinen Pool von naheliegenden Icons zur Verfügung. Bei Bedarf können einzelne Themenfelder (immer 20 Icons) für wenige Euro hinzu gekauft werden. Link zur Sammlung bei Adobe Stock
Schriften
Die Hausschrift der VHS heißt »Plex«. Sie wurde von IBM entwickelt und ist kostenfrei verwendbar. Die Schriftfamilie umfasst diverse Schriftschnitte. Fünf davon kommen bei der VHS vorrangig zum Einsatz.
Plex Sans Text
Verwenden Sie oft die »Text« und selten die anderen Schnitte. Betonen Sie mittels Unterstreichungen. Überschriften funktionieren gut in VERSALIEN. Für erkennbare Unterschiede im Schriftbild nur die folgenden Schriftgrößen verwenden: 6pt, 9pt, 12pt, 15pt, 18pt, 21pt, 24pt … 30, 45, 60, 75, 90 …
Plex Sans Italic
»Italic« ist eine andere Bezeichnung für kursiv. Verwenden Sie kursive Schrift, um einzelne Absätze besonders zu markieren, oder um einzelne Passagen innerhalb von Absätzen hervorzuheben, und für die wörtliche Rede.
Plex Sans Semibold
Die »Semibold« dient wie jeder fette Schriftschnitt zur Auszeichnung oder für Überschriften. Auf Schildern, die von weitem lesbar sein sollen, sorgt sie für einen guten Kontrast. Gehen Sie sparsam mit der »Semibold« um.
Plex Mono
»Mono« steht für »Monospace«. Alle Zeichen, auch das Leerzeichen, sind exakt gleich breit: Prima für die Übersichtlichkeit von Zahlen und Bündigkeit von Text.
Plex Condensed
»Condensed« bezeichnet schmaler laufende Schriftschnitte. Mit diesen können Sie mehr Text auf wenig Platz unterbringen. Verwenden Sie die »Condensed« dann wenn mangelnder Platz Sie dazu nötigt.
Das Downloadpaket »Basic« enthält die fünf aufgezeigten Schriftschnitte in zwei Dateiformaten. OTF (Open Type Font) ist das neuere und globalere. Verwenden Sie TTF (True Type Font) nur, falls OTF nicht funktioniert. Auf PC und Mac kann man Schriften in der Regel per Doppelklick installieren.
Das Komplettpaket mit allen denkbaren Formaten finden Sie auf dem aktuellsten Stand immer auf der Developer Plattform »GitHub«.
Weitere Informationen zur Schriftart »IBM Plex«
Die »Plex« wurde von IBM für den eigenen Gebrauch entwickelt. Darüber hinaus steht sie allen, die sie einsetzen möchten, zur kostenfreien Benutzung zur Verfügung.
Alle Informationen und einen vollständigen Eindruck von Konzept und Potential der Schrift und ihrer Schnitte erhalten Sie auf der eigens eingerichteten Website ibm.com/plex
