Veröffentlicht am 18. Juli 2018 von Christian Meyer

Anforderungen an moderne Erscheinungsbilder

Erscheinungsbilder oder Corporate Designs definieren das visuelle Aufreten eines Unternehmens oder einer Organisation.
Dabei unterliegen sie dem stetig wechselnden ästhetischen Empfinden ihrer Zeit. Über Jahrzehnte mussten Erscheinungsbilder ausschließlich für die Verwendung im Druck optimiert sein. Auch wenn seit Jahren ein Web-kompatibles Erscheinungsbild Pflicht sein sollte, begegnen uns heutzutage in der Mehrheit immer noch print-getriebene Corporate Designs. Dabei ist es längst notwendig geworden, Erscheinungsbilder nicht nur crossmedial für Print und Web zu denken, sondern im Zuge des digitalen Wandels auch auf den Bereich Software zu erweitern. Leider haben die meisten Werbeagenturen mit mittelständischen Kunden diese Entwicklung komplett verschlafen.
Worauf Sie als mittelständisches Unternehmen bei einem zukunftssicheren Erscheinungsbild achten müssen, haben wir in diesem Artikel für Sie zusammengefasst.

1. AUSGANGSSITUATION

Schon im Mittelalter gab es, wenn wir an die Familienzeichen von Fürsten und Wappen der Städte denken, so etwas wie eine visuelle Zugehörigkeit die durch Farben, Formen und Muster zum Ausdruck gebracht wurde. Dies sind neben Qualitäts- und Herstellersiegeln, die Handwerker und Manufakturen verwendeten, um ihre Produkte zu kennzeichnen, somit die Wurzeln des heute sogenannten “Corporate Designs”.

Bereits im Mittelalter entstanden erste Corporate Designs mit festgelegten bildhaften Zeichen (Wappen) und definiertem Farbklima.

Heute zählen wir zu den grundlegenden Aufgaben eines Corporate Designs, die Identität eines Unternehmens oder eines Produkts nach innen und außen zu stärken und in Einklang zu bringen mit weiteren Elementen wie Produktdesign, Architektur, Sprache, Kleidung und weiteren branchenabhängigen Komponenten.

Auch kleinere und mittlere Unternehmen haben erkannt, dass ein Corporate Design von grundlegender Relevanz ist, um das Unternehmen nach innen und außen als Einheit erscheinen zu lassen, die sich wiedererkennbar und von Mitbewerbern unterscheidbar darstellt. Hierfür werden Gestaltungskonstanten wie z.B. Logo, Typografie, Hausfarbe etc. in Gestaltungsrichtlinien festgelegt. Außerdem wird ein Regelwerk erstellt, wie diese Gestaltungskonstanten in unterschiedlichen Anwendungsbereichen einzusetzen sind, z.B. auf Briefbögen, Innenarchitektur, Produkt- und Verpackungsgestaltung oder Anzeigen.

Viele Werbe- und Designagenturen arbeiten und denken bei der Erstellung von Corporate Designs auch heute noch immer relativ klassisch und sehr “printlastig”. Auch ältere Corporate Designs, die sich bereits seit mehreren Jahren bewährt haben, sind primär für Printprodukte ausgelegt. Dies stellt Unternehmen bei der Transformation ihrer Erscheinungsbilder für digitale Produkte (ob Webseite oder Software) immer wieder vor Herausforderungen und Probleme.

 

2. EMPFEHLUNG 1 (Web)

Im Gegensatz zu Corporate-Design-Richtlinen für Printprodukte (wie bspw. Geschäftspapiere, Broschüren, Messestände, Verpackungen etc.) gibt es für die Onlinedarstellung andere und erweiterte Erfordernisse, die bei der Erstellung oder Überarbeitung eines Corporate Designs von Anfang an mit Bedacht werden sollten.

Print

Befasste man sich bisher zur der Erstellung eines Erscheinungsbildes bei Fokussierung auf Printprodukte mit der Erstellung eines Logos, der Festlegung der Typografie (Schriften, Satzspiegel, Schriftgrade), der Definition der Hausfarben (CMYK/Sonderfarben) und mit Drucktechniken sowie -veredelungen, der Bildsprache, Papierformaten und -sorten. Jedoch erfordert die Erstellung eines Erscheinungsbildes, dass auch die derzeitigen Anforderungen an Screendesigns erfüllt eine umfassendere Beschäftigung mit dem Thema.

Bildquelle: Pixabay.com

Print- und Online

So sind für die Überarbeitung oder Erstellung eines Erscheinungsbildes für Print- und Screenprodukte folgende Fragen zu stellen und vom Designer bzw. der Agentur zu beantworten:

  • Wie kann man das bestehende Farbklima erweitern oder ein neues Farbset schaffen, das erweiterte Abstufungen für Hoverzustände und dergleichen abbilden kann?

 

  • Liegt die bisherige/vorgesehene Schrift als Webfont vor? Wenn nicht, sollte eine andere Schrift gewählt werden, die als Webfont verfügbar ist. Da die Schrift maßgeblich zum Erscheinungsbild beiträgt sollte sie auch im Web angezeigt werden und nicht durch eine Ersatz- oder Fallbackschrift ausgetauscht werden.
  • Ist die vorgesehene Schrift auch an Bildschirmen gut lesbar? (Nicht jede Schrift, die in Printprodukten gut lesbar ist, ist an Bildschirmen gut lesbar.)

 

Schriften mit größerer x-Höhe (Open Sans links) sind in der Regel besser am Bildschirm zu lesen. Auch Schriften mit Serifen (Times New Roman rechts) sind im Gegensatz zur guten Lesbarkeit bei Printprodukten an Bildschirmen schlechter zu lesen.

  • Wie kann die Typografie (also das System aus Schriftarten, -größen und -schnitten) auf das Web übertragen werden, oder ist hierfür ein neues System zu etablieren?
  • Haben alle Farben auch am Bildschirm ein ähnliche Darstellung wie auf Printprodukten? (Der RGB-Farbraum von Bildschirmen ist zwar deutlich größer als der CMYK-Farbraum für Printprodukte, dennoch ist nicht jede CMYK-Farbe in RGB gut darstellbar. Außerdem gibt es zahlreiche Sonderfarben die überhaupt gar nicht auf Bildschirmen darstellbar sind, wie bspw.  Metallic- oder Neonfarben, die für Printprodukte chemisch chemisch besonders angemischt werden.)

Bildquelle: de.wikipedia.org

 

  • Bietet das Farbset genügend Spielraum für ggf. notwendige barrierearme/-freie Darstellung? Sind also bspw. die Kontrastwerte ausreichend, wenn Text in einer vom Corporate Design festgelegten Farbe auf einer anderen festgelegten Farbe steht? Bleibt die Lesbarkeit auch bei Sehschwächen wie z.B. Farbenblindheit erhalten?
  • Ist das Logo auch in kleinen Darstellungen (also mit wenigen Pixeln) gut erkennbar und die Wortmarke lesbar? Gibt es eine angepasste Logoversion für kleine Darstellungen?

Hat ein Logo oder ein wiederkehrendes Grafikelement zu feine Linenstärken oder ist es sehr kleinteilig, kann es in kleinen Skalierungen zu unerwünschten Darstellungen kommen.

 

  • Kann das Logo  auch in responsiven Ausbaustufen ausgespielt werden? Also bspw. Wortmarke und Leistungsbezeichnung/Claim unter dem Signet, Wortmarke und Leistungsbezeichnung/Claim neben dem Signet, und in responsiver kleiner Ausbaustufe Wortmarke ohne Leistungsbezeichung/Claim neben Logo.

Responsive Logos ermöglichen flexible Darstellungen auf verschiedenen Screengrößen, sodass das Logo immer über alle Geräteklassen gut erkenn- und lesbar ist.

 

  • Sind Gestaltungselemente wie wiederkehrende Grafiken auch auf mobilen Geräten gut darstellbar und vor allem auch von der Datenmenge her optimierbar, sodass sie auch schnell geladen werden können? (Lange Ladezeiten erzeugen hohe Absprungraten  auf Webseiten.)
  • Werden schräge Linien als Gestaltungselement eingesetzt? Verlaufen diese nicht im 0°, 45° oder 90° Winkel, kommt es auf Bildschirmen häufig zu einer hässlichen Treppenbildung. Retina-Displays mit hoher Auflösung haben das Problem nicht, allerdings findet immer noch ein Großteil der Nutzung auf großen Standard-Displays statt und sollte dementsprechend berücksichtigt werden.
  • Ist die Bildsprache auch für responsive Darstellungen im Web geeignet oder gehen bei verschiedenen Geräteklassen eventuell wichtige Bildinhalte verloren?

Bilder, die auf Printprodukten oder dem Desktop gut funktionieren, eignen sich unter Umständen nicht für Smartphone-Darstellungen. Hier sind Anpassungen erforderlich.

 

3. EMPFEHLUNG 2 (Software/App)

  • Bietet die Hausschrift auch einen monospaced Schriftschnitt? Dies kann bei tabellarischen Darstellungen bzw. bei Zahlenreihen von Vorteil sein, da bspw. alle Kommastellen immer untereinander erscheinen.

„Monospaced“ Fonts bieten den Vorteil, dass jedes Zeichen die gleiche Dickte (Breite) besitzt. Somit haben schmale Zeichen, wie die 1 die gleiche Dickte wie breite Zeichen. Die Auswahl einer geeigneten Schrift für eine Software sollte also bereits bei der Erstellungen eines Corporate Designs mit bedacht werden.

 

  • Wie lässt sich das Corporate Design auf wenige Elemente reduzieren (bspw. ohne Bildsprache) und dennoch wiedererkennbar einsetzen?

Wiederkehrende Gestaltungselemente, wie die Dreiecke hier im Beispiel lassen sie sowohl in Printprodukten, Webseiten als auch in Software verwenden. Auch die Farben des Corporate Designs lassen sich auf Software übertragen.

 

  • Wird das Produkportfolio um eine Software oder App erweitert, ist zu prüfen, wie sich die dafür notwendigen Icons harmonisch ins Corporate Design einfügen lassen.

Icons mit identischer Methapher bzw. der gleichen Funktion können ganz unterschiedlich gestaltet werden. Wichtig ist, dass sie sich harmonisch ins bestehende Erscheinungsbild einfügen.

 

4. TAKE-AWAY

Wie detailreich ein Corporate Design zu sein hat, sollte individuell entschieden werden. Sicher ergibt es für einige Unternehmen keinen Sinn, alle Punkte zu berücksichtigen. Insgesamt betrachtet wird es aber immer wichtiger, die eigene Marke im Zuge der Digitalisierung und Industrie 4.0 auch in Softwareprodukte zu transportieren. Bitte fragen Sie hierzu eine Interface-Design-Agentur Ihres Vertrauens.

Best Practice (Wie machen es die großen Unternehmen):