Basics / Illustrationen

Fokus auf das Wesentliche

Der Illustrationsstil von Audi wird genutzt um Services, Prozesse, Funktionen und andere abstrakte Sachverhalte begleitend zu veranschaulichen. Er folgt den Prinzipien der Einfachheit sowie Klarheit und zieht Inspiration aus der Geradlinigkeit und Dynamik von Tape Drawing.

Beispiele

Schwarz-Weiss

Illustrationen enthalten Schwarz, Weiß und Grautöne. Auf Farben wird verzichtet.

Starke Kontraste

Starke Kontraste machen die wesentlichen Elemente einer Illustration zum Blickfang. Die Tonwertspannbreite streckt sich von Vollweiß bis Tiefschwarz. Mittlere Grautöne werden sparsam verwendet.

Hoher Abstraktionsgrad

Einfache Metaphern und der Verzicht auf Details, die für das inhaltliche Verständnis der Illustration nicht wesentlich sind, sorgen für leichte und schnelle Erfassbarkeit der Botschaft.

Schrift wird begleitend, nicht aber als Bestandteil von Illustrationen eingesetzt. So ist gewährleistet, dass die Illustrationen in unterschiedlichen Abbildungsgrößen verwendet werden können.

Gerade, kantige Schnitte überwiegen

Die Formsprache ist geprägt von geraden, kantigen Schnitten.

Ergänzend dazu werden fließende, runde Formen eingesetzt, bspw. für Gesichter, Reifen oder Chassis. Angeschnitten werden Illustrationen immer gerade horizontal oder vertikal.

Volltonflächen - keine Verläufe, keine Konturen

Illustrationen setzen sich aus Volltonflächen zusammen. Verläufe, Konturen und weiche Übergänge treten nicht auf. Objekte werden durch harte Licht- und Schattenkanten modelliert.

Ebenenhierarchie

Falls notwendig, kann eine Illustration in bis zu drei Ebenen gegliedert werden. Die Ebenen sind klar getrennt durch Kontrast. Ebenen im Hintergrund enthalten zunehmend weniger Details.

Helle Illustrationen

Vordergrund: Die Botschaft, die der Betrachter der Illustration entnehmen soll.
Schwarzstufen: 0–100 %
Mittelgrund: Kontext, der dem Verständnis der Botschaft dient und Zusammenhänge herstellen kann. Schwarzstufen: 0–20 %
Hintergrund: Dekorative Szenerie.
Schwarzstufen: 0–10 %

Dunkle Illustrationen

Vordergrund: Die Botschaft, die der Betrachter der Illustration entnehmen soll.
Schwarzstufen: 0–100 %
Mittelgrund: Kontext, der dem Verständnis der Botschaft dient und Zusammenhänge herstellen kann. Schwarzstufen: 60–100 %
Hintergrund: Dekorative Szenerie.
Schwarzstufen: 80–100 %

Illustrationen im Mittel- und Hintergrund

Eine Illustration kann auch komplett im Hintergrund stattfinden, bspw. um den Fokus auf andere Elemente wie Text oder Buttons zu legen.

Fahrzeugdarstellung

Fahrzeuge werden generisch dargestellt. Die Formgebung orientiert sich am Fahrzeugdesign von Audi, ohne dass ein konkretes Modell erkennbar wird.

Bei kleinen Darstellungen entfallen weitere Details.

Darstellung von Menschen

Darstellungen von Menschen werden auf das Wesentliche reduziert. Auf comichafte Mimik  und Gestik wird verzichtet.

Illustrationen für dunkle Hintergründe

Illustrationen werden in zwei Versionen angelegt, wenn sie sowohl auf hellen als auch auf dunklen Hintergründen (später Link zu Dark Theme) eingesetzt werden. Die Übersetzung einer hellen in eine dunkle Illustration erfolgt dabei immer manuell und unter Beachtung der definierten Ebenenhierarchie. Um Darstellungsfehlern wie z. B. schwarzen Scheinwerfern vorzubeugen, wird die ursprüngliche Illustration nie durch einfaches Invertieren umgefärbt.

Illustrationen für dunkle Hintergründe erscheinen mit geringem Weißanteil, um sich harmonisch ihrer Umgebung anzupassen. Eine hell blendende Wirkung wird damit ebenfalls vermieden. Grundsätzlich ist zu beachten, dass ein fließender Übergang gegeben ist zwischen dem Hintergrund der Illustration und dem Hintergrund, auf welchem sie steht.

Kontextrelevante Illustrationen

Eine Illustration mit einem hellen Grauwert kann in seltenen Fällen auf einem dunklen Hintergrund eingesetzt werden, wenn es für die Botschaft der Illustration essenziell ist. Auf einen fließenden Übergang zwischen Illustration und Hintergrund darf in diesem Fall verzichtet werden.

Illustrationen