Designer haben ihr ganz eigenes Vokabular. Wenn du mit einem Designer arbeitest, wird dir das Wissen um die richtigen Fachausdrücke dabei helfen, miteinander zu kommunizieren und die Ergebnisse zu erzielen, die du dir vorstellst. (Wir versprechen, es wird wesentlich einfacher als der Französisch-Unterricht in der Oberstufe.)
Schau dir diese Designbegriffe an. Präge sie dir ein. Lerne sie auswendig. Ähm… das ist viel zu viel Arbeit. Speichere einfach diese Seite als Lesezeichen und nutze sie als Design-Spickzettel.
Design-Grundlagen
—
Komposition und Layout
Die Komposition ist die Anordnung von Designelementen, die ein ganzes Bild ergeben. Eine erfolgreiche Komposition fesselt den Betrachter und führt seinen Blick über das Design. In der bildenden Kunst hörst du eventuell den Begriff „Form“. Im Grafikdesign nennt man es oftmals Layout. Die Komposition besteht aus einer Anzahl verschiedener visueller Designelemente, einschließlich Gleichgewicht, Nähe, Ausrichtung, Wiederholung, Kontrast und Weißraum.
Gleichgewicht
Hier geht es nicht darum, ob du nach drei Bier noch gerade auf einer Linie laufen kannst. Im Designbereich bedeutet Gleichgewicht die Platzierung von Elementen auf der Seite, sodass Text und Grafik gleichmäßig verteilt sind. Es gibt drei Wege, um Gleichgewicht zu erreichen: symmetrisch, asymmetrisch und radial.
Symmetrisch
Symmetrie erreicht man, wenn alle Designelemente auf beiden Seiten einer mittigen Linie gleichmäßig sind.
Asymmetrisch
Wenn Grafiken und Texte nicht gleichmäßig auf beiden Seiten einer mittigen Linie sind, spricht man von einem asymmetrischen Design. Im obigen, mittleren Beispiel gibt es immer noch eine Balance, aber auf der einen Seite befinden sich Grafiken und auf der anderen Text.
Radial
Ein radiales Design ist eines, in dem die Elemente sich von einem mittigen Punkt aus verbreiten und so Gleichgewicht erzeugen.
Nähe
Die Art, wie Designelemente auf einer Seite gruppiert oder in Abständen platziert sind, nennt man Nähe.
Ausrichtung
Ausrichtung ist die Position des Textes oder der Grafiken, ob linksbündig, rechtsbündig, zentriert oder Blocksatz.
Wiederholung
Um einen einheitlichen Look zu erhalten, wiederholen Designer Elemente durch das gesamte Design hindurch. (Wiederholung definiert man auch als die Anzahl der Male, die dein Kind dich nach noch einem Keks fragt.)
Kontrast
Kontrast wird erzielt, indem man Elemente in das Designs einfügt, die sich deutlich voneinander unterscheiden. Ein Designer kann Farbe, Form, Textur, Größe oder Schrift verwenden, um Kontrast zu erzeugen.
Leerraum
Leerraum – manchmal auch Negativraum genannt – ist der Teil eines Designs, der unberührt von Bildern oder Text ist.
Drittel-Regel
Die Drittel-Regel ist eine Technik, die Designer nutzen, um Fokuspunkte zu setzen. Wenn man ein Raster bestehend aus drei Spalten und Zeilen benutzt, liegen die Fokuspunkte dort, wo sich die Linien berühren. Designer benutzen dies als Hilfe, um festzulegen, an welcher Stelle wichtige Elemente in ihrem Design platziert werden müssen.
Raster
Ein Raster ist eine Reihe sich kreuzender, vertikaler, horizontaler, schräger oder gekrümmter Linien, die dazu benutzt werden, grafische Elemente auf einer Seite und in Bezug zueinander anzuordnen.
Hierarchie
Im Design ist die Hierarchie die Anordnung von Elementen ihrer Wichtigkeit nach. Das Design von Zeitungen, Magazinen oder Filmplakaten ist ein gutes Beispiel für die Verwendung von Designhierarchie. Überschriften (auch Auszeichnungsschrift genannt) sind üblicherweise oben, während Zwischenüberschriften und Textkörper darunter kommen.
Maßstab
Der Maßstab ist die Größe eines Objekts in Relation zu einem anderen Objekt. Maßstab kann dazu verwendet werden, Interesse zu wecken und die Aufmerksamkeit eines Betrachters zu erregen.
Aufriss-Skizze
Während sie ein Konzept entwerfen, erstellen Designer oftmals kleine, grobe Zeichnungen – Aufrisse, auch Sketch oder Abriss genannt – um Ideen zu erkunden.
Mock-up
Ein Mock-up ist ein echtes oder digitales Modell, das dazu verwendet wird, frühe Designideen zu testen und darzustellen, wie sie in echt aussehen werden.
Fotografie & künstlerische Arbeit
—
Auflösung
Das Detail eines Bildes, basierend auf der Anzahl der Pixel, ist die Auflösung. Ein Bild sieht schärfer aus, wenn es eine höhere Auflösung hat.
DPI
DPI steht für „dots per inch“. Damit misst man die Qualität eines Druckers. Für hochwertige Drucke werden 300dpi empfohlen. Ein Bild mit 300dpi bei 1200×1800 Pixeln wird beispielsweise zu einem 10x15cm Druck.
PPI
PPI steht für „pixels per inch“. Es ist eine Maßeinheit für die Pixeldichte bei elektronischen Bildgeräten. Du wirst es bei Scannern, Kameras, Fernsehgeräten oder Monitoren finden. Erfahre mehr über den Unterschied zwischen DPI und PPI.
Anschnitt
Der Anschnitt (auch Bleed genannt) ist, wenn ein Design eigentlich über seine gedruckten Ecken hinausreicht, damit es keine Möglichkeit für weiße Ränder gibt, wenn es nach dem Druck beschnitten wird.
Beschnitt
Die Beschnittgröße ist die finale Größe eines gedruckten Werks, nachdem es zurechtgeschnitten wurde. Der Beschnitt (auch Trim genannt) erfolgt entlang von Beschnittzeichen, die zeigen, wo geschnitten werden soll.
Pixel
Pixel sind quadratische Punkte, die ein digitales Rasterbild ergeben (nicht zu verwechseln mit „Pixels“, einem wirklich schlechten Film mit Adam Sandler.) Je mehr Pixel ein Bild hat, umso höher ist die Auflösung.
Crop / Zuschnitt
Ein Designer kann unnötige Teile eines Bildes zuschneiden, um die Bildeinstellung zu verbessern, einen bestimmten Gegenstand hervorzuheben oder das Seitenverhältnis zu ändern.
Stock-Fotos
Stock-Fotos sind lizenzierte Bilder, die durch Dritte erzeugt wurden. Die Verwendung von Stock-Material spart die Kosten für ein professionelles Fotoshooting. Schau dir einige unserer Lieblingsseiten für gute, kostenlose Stock-Fotos an.
Typographie
—
Schriftarten
Die meisten Schriften fallen in eine von vier Kategorien von Schriftarten.
Serifen-Schriften
Serifen sind kleine Linien und Haken am Ende eines Strichs in einigen Buchstaben.
Serifenlose Schriften
Eine serifenlose Schrift hat keine Serifen.
Handschrift (Script)
Handschriften haben einen fließenden, kursiven Strich.
Blockserifen (Egyptienne)
Blockserifen-Schriften (auch Egyptienne oder serifenbetonte Linear-Antiqua genannt) haben betonte, blockartige Serifen.
Bestandteile von Schrift
Alle Schriftarten bestehen aus den gleichen grundsätzlichen Bestandteilen.
Oberlänge
Die Oberlänge (auch Ascender genannt) ist der Teil eines Kleinbuchstaben, der über den Hauptteil des Buchstabens hinausragt. Denke zum Beispiel an das „b“ oder „h“.
Grundlinie
Alle Buchstaben sitzen auf einer Grundlinie, der niedrigste Punkt aller Großbuchstaben und der meisten Kleinbuchstaben.
Unterlänge
Die Unterlänge (auch Descender genannt) ist der Teil eines Kleinbuchstabens, der unter den Hauptteil eines Buchstabens abfällt. Denke an „g“ oder „p“.
Mittellänge / x-Höhe
Die Mittellänge oder x-Höhe ist die Stelle, an der die meisten Kleinbuchstaben ihre Maximalhöhe erreichen sollen. Sie wird von der Höhe eines x in einer Schriftart abhängig gemacht.
Schriftabstand
Der vertikale und horizontale Abstand einer Schriftart wird oftmals verändert, um ihre Erscheinung zu ändern.
Unterschneidung
Als Unterschneidung bezeichnet man den Raum zwischen Paaren von Buchstaben im selben Wort. Bestimmte Paare von Buchstaben erzeugen einen ungünstigen Raum und Unterschneidung hilft, Raum zwischen ihnen hinzuzufügen oder wegzunehmen, um einen visuell ansprechenderen und besser lesbaren Text zu erzeugen.
Zeilenabstand
Der Zeilenabstand, auch Zeilenhöhe genannt, bezeichnet den Raum zwischen zwei Textzeilen.
Laufweite
Nicht zu verwechseln mit Unterschneidung, ist die Laufweite die Anpassung von Abständen für Gruppen von Buchstaben und ganzen Textblöcken. Die Laufweite beeinflusst jedes Zeichen im ausgewählten Text und wird verwendet, um die ganzheitliche Erscheinung zu verändern.
Buchstabengröße
In der Regel gibt es Buchstaben in zwei Formen.
Majuskel (Großbuchstaben)
Die Großbuchstaben einer Schrift. Sie werden auch von deiner Mutter verwendet, um DICH VERSEHENTLICH ANZUSCHREIEN, WENN SIE DIR SCHREIBT.
Minuskel (Kleinbuchstaben)
Minuskel sind die Kleinbuchstaben einer Schrift.
Kapitälchen
Kapitälchen sind Großbuchstaben, welche dieselbe Größe wie Kleinbuchstaben haben. Sie werden verwendet, um zu verhindern, dass großgeschriebene Wörter auf einer Seite zu groß wirken. Beispiel gefällig? In vielen Büchern findest du sie bei den ersten Wörtern eines Kapitels.
Schriftstil
Neben Laufweite und Größe, können Schriftarten auch in ihrem Maßstab, ihrer Stärke und ihrem Stil verändert werden.
Schriftgröße
Die Schriftgröße ist die Größe eines Textes nach Punkten (pt). Es gibt ungefähr 28 (28,35) Punkte in einem Zentimeter.
Schriftstärke
Die Schriftstärke beschreibt die Dicke bzw. Stärke der Schrift.
Kursiv
Wenn Buchstaben sich nach rechts neigen sind sie kursiv, eine visuelle Technik, die dazu verwendet wird, Aufmerksamkeit auf bestimmte Wörter oder Sätze innerhalb eines Absatzes zu lenken.
Witwen & Schusterjungen
Witwen und Schusterjungen machen Designer sehr traurig. Das rührt daher, dass sie arme, einsame Wörter am Anfang oder Ende eines Absatzes sind, die vom Rest des Textes getrennt sind.
Witwen
Eine Zeile am Ende eines Paragraphs, die an den Beginn der folgenden Seite oder Spalte fällt und dadurch vom Rest des Textes getrennt ist.
Schusterjungen
Eine Zeile am Beginn eines Paragraphs, die ans Ende einer Seite oder Spalte fällt und dadurch vom Rest des Textes getrennt ist.
Lorem ipsum
Lorem ipsum (auch bekannt als Leertext) wird als Platzhalter verwendet, der später durch den eigentlichen Text ersetzt wird. Der Lorem-ipsum-Text kommt von Ciceros Werk „Vom höchsten Gut und vom größten Übel“, geschrieben im Jahr 45 v. Chr.
Farbe
—
Farblehre
Die Lehre darüber, wie Farben Menschen beeinflussen und ihre Auswirkungen auf ein Design, ist bekannt als Farbenlehre. Farbenlehre wird verwendet, um herauszufinden, welche Farben am besten für welches Design funktionieren. Beispielsweise nutzt man sie, wenn man ein Pastell-Schema für eine Website wählt, die sich zart anfühlen soll, oder Rot und Gelb für eine Magazinwerbung, die Energie vermitteln soll.
Farbton, Tönung, Ton und Schattierung
Der Farbton ist reine Farbe. Die Tönung ist eine Farbe mit beigemischtem Weiß. Der Ton ist eine Farbe mit beigemischtem Grau. Die Schattierung ist eine Farbe mit beigemischtem Schwarz.
Sättigung
Sättigung definiert die Intensität einer Farbe.
Palette
Eine Palette ist die Bandbreite von Farben, die im Design verwendet werden. Dies sind Farben, die gut zusammen funktionieren und oftmals ästhetisch ansprechend sind. Designer definieren eine Palette für ein Projekt, um Konsistenz und ein bestimmtes Gefühl zu erzeugen.
Warme und kalte Farben
Warme Farben findet man in der einen Hälfte des Farbkreises (Rot, Orange, Gelb und Pink). Kalte Farben belegen die andere Hälfte (Blau, Grün und Violett).
Monochromatisch
Eine monochromatische Farbpalette oder einfarbige Palette verwendet nur eine einzige Farbe.
Graustufe
Eine monochromatische Farbpalette, welche auf Grau basiert, nennt man Graustufe.
Analog
Farben, die im Farbkreis nebeneinander liegen, (z. B. Rot-Violett, Rot und Rot-Orange) sind analog.
Komplementär
Komplementärfarben liegen sich im Farbkreis gegenüber. Diese Beziehung erzeugt visuelle Spannung und Überraschung.
Triadisch
Triadische Farben sind drei Farben, die gleichmäßig verteilt im Farbkreis liegen. Eine Farbe dominiert, die zweite unterstützt und die dritte akzentuiert.
Farbverlauf
Der Farbverlauf ist eine stufenweise Veränderung von einer Farbe zur nächsten. (Zum Beispiel geht Blau nach und nach zu Grün über).
Deckkraft
Deckkraft ist gleichbedeutend mit Undurchsichtigkeit. Je transparenter ein Bild, umso niedriger die Deckkraft.
CMYK
CMYK ist ein 4-Farb-Druckprozess, bestehend aus Cyan, Magenta, Gelb und Schwarz (auch Key Black genannt). CMYK-Farben im Druck werden niemals so kräftig erscheinen wie RGB-Farben auf dem Bildschirm, da das CMYK-Prinzip dadurch Farbe erzeugt, dass es Farben zusammen mischt (und das Bild dunkler macht), während RGB-Farben durch Licht entstehen.
RGB
RGB steht für Rot, Grün und Blau, die drei Farben des Lichts, die normalerweise verwendet werden, um Bilder auf Bildschirmen darzustellen.
Pantone
Entwickelt von der Pantone Corporation, einer professionellen Farbfirma, ist Pantone das am weitesten verbreitete, proprietäre Farbsystem für Mischfarben. Das System beinhaltet Farben, die nicht in CMYK gemischt werden können.
Web & Digital
—
Webseitenelemente
Die meisten Website-Designs beinhalten eine Kombination dieser Elemente.
Header (Kopfzeile)
Designelemente, die sich oben auf jeder Seite wiederfinden, werden Header oder Kopfzeile genannt.
Navigation & Navigationsleiste
Die Navigation ist der Wegweiser zu den wichtigsten Teilen einer Website und sollte visuell gleichmäßig durch alle Seiten hinweg sein. Eine Navigationsleiste ist eine Reihe von Links, die auf jeder Seite wiederkehrt und oftmals auf Seiten wie „Über uns“, „Produkte“, „Kontakt“ und „Referenzen“ verlinkt.
Breadcrumb Trail (Brotkrümelnavigation)
Breadcrumb Trails sind Navigationselemente, die üblicherweise in der Nähe des Seitenkopfes erscheinen, um dem Benutzer zu zeigen, wo die aktuelle Seite sich in der Hierarchie der Seiten befindet.
Body Text (Textkörper)
Der Textkörper ist der Hauptteil des geschriebenen Inhalts auf einer Seite.
Links
Jedes Wort oder Bild kann ein Link sein, der den User zu einer anderen Seite führt.
Sidebar (Seitenleiste)
Eine Sidebar ist die links- oder rechtsseitige Spalte einer Seite und wird in der Regel entweder für vertikale Navigationslinks oder Werbung verwendet. Sie kann auch die Seitensuche, Abo-Links (RSS, Newsletter, etc.) oder Social-Network-Buttons enthalten.
Banner
Befinden sich üblicherweise oben auf der Seite oder in einer Sidebar. Banner sind Werbungen, die auf andere Webseiten verlinken.
Footer (Fußzeile)
Designelemente, die sich am Ende jeder Seite wiederholen, nennt man Footer.
HTML
HTML steht für Hypertext Markup Language. Dies ist die Standardprogrammiersprache für Webseiten, die sämtliche Schriften, Farben, Grafiken und Links, die du online siehst, erzeugt.
Landingpage
Eine Landingpage ist eine einzelne Seite, die als Antwort auf eine Suche in einer Suchmaschine erscheint. Landingpages werden zur Leadgenerierung verwendet.
User interface (UI / Benutzeroberfläche)
User Interface ist das Design von Anwendungen für Computer, Mobilgeräte und andere Geräte, um ihre Benutzerfreundlichkeit und das Nutzererlebnis zu maximieren.
Wireframe (Gitternetzmodell)
Grundlegende Bilder, welche die essenziellen Funktionen einer Website darstellen, werden Wireframe genannt. Designer nutzen diese Gitternetzmodelle, um zu zeigen, wie eine Seite funktioniert.
Bilddateiformate
—
Ein Bilddateiformat ist ein standardisierter Weg, um Grafiken und Fotos digital zu kodieren.
Vektorgrafiken
Vektorgrafiken sind kleine Grafiken, welche Mathematik verwenden, um Bilder darzustellen. Sie können vergrößert werden, ohne an Qualität zu verlieren und sind essenziell für plattformübergreifende Designs (z. B. Werbetafeln, Visitenkarten, etc.).
AI
AI steht für Adobe Illustrator Document. Dies ist ein Dateiformat, welches von Adobe Systems entwickelt wurde, um einseitige Vektordesigns darzustellen.
EPS
EPS steht für Encapsulated Post Script. Dies ist ein größenveränderbares Dateiformat, welches üblicherweise für Vektordesigns verwendet wird. Aufgrund seiner hohen Qualität wird es in der Regel für Druckelemente wie Logos, Visitenkarten oder Broschüren verwendet.
PDF bedeutet Portable Document Format und wurde von Adobe entwickelt. Es kann auf jedem Computer heruntergeladen und betrachtet werden. PDFs eignen sich am besten für die Vorschau einer Arbeit und lassen sich universell öffnen und anschauen.
Rastergrafiken
Rastergrafiken bestehen aus Pixeln auf einem Gitternetz, wo jedem Pixel ein Farbwert zugewiesen ist. Sie eignen sich gut, um Spezialeffekte festzulegen, für Farbkorrekturen und um Fotos zu manipulieren. Sie sind abhängig von der Auflösung, was bedeutet, dass sie nicht vergrößert werden können, ohne an Qualität zu verlieren.
GIF
GIF oder Graphics Interchange Format ist ein Rasterformat, welches Animationen und Transparenz unterstützt. GIFs können nur bis zu 256 Farben anzeigen und ermöglichen nur geringe Dateigrößen. (PS: Laut GIF-Erfinder Steve Wilhite spricht man es „JIF“ aus, im Gegensatz zur weit verbreiteten Meinung.)
JPEG
Joint Photographic Electronic Group, auch bekannt als JPEG, das am weitesten verbreitete Rasterformat für webbasierte Designs. JPEGs sind komprimierte Dateien, die schnell laden. Man findet sie üblicherweise in E-Mails, Banner-Ads, Onlinefotos und überhaupt so ziemlich überall. Im Gegensatz zu GIFs, können sie keinen transparenten Hintergrund haben (es wird automatisch ein weißer Hintergrund hinzugefügt).
PNG
PNG steht für Portable Network Graphics, einem webbasierten Format, welches keine Qualität verliert, wenn es komprimiert wird. PNG-Dateien wurden erfunden, um die Qualität von GIF-Dateien zu verbessern.
PSD
PSD (oder Photoshop Document) ist die unkomprimierte Rasterbilddatei, die in Adobe Photoshop erzeugt wird.
TIFF
TIFF steht für Tagged Image File Format, einem geläufigen Format, um Rasterbilder zwischen Anwendungen auszutauschen. TIFF erzeugt Bilder mit einer höheren Qualität als JPEG oder PNG und ist unter Verlegern und Fotografen weit verbreitet.
Logotypen
—
Alle Logos bestehen aus Typografie, Formen und/oder Bildern und passen in der Regel in eine dieser sechs Standardkategorien für Logotypen. Jedes wird deiner Marke oder deinem Unternehmen ein anderes Feeling verpassen. Diese sechs Logotypen können auch miteinander kombiniert werden, um ein noch einzigartigeres Logo zu erzeugen.
Abstraktes Logo
Ein abstraktes Logo ist ein Logo, welches gefühlsbedingte Qualitäten von Farbe und Form verwendet, um deine Marke zu vermitteln. Statt eines wiedererkennbaren Bildes wie ein Apfel oder ein Huhn, nutzen abstrakte Logos Formen, um dein Unternehmen zu verkörpern.
Emblem
Embleme nutzen Rahmen und Formen, um den Namen des Unternehmens oder der Organisation zu umschließen. Denk dabei an Plaketten, Siegel oder Wappen.
Lettermark-Logo
Lettermark-Logos haben einen oder mehrere stilisierte Buchstaben (beispielsweise die Initialen eines Unternehmens), um eine Marke zu identifizieren. Zu den berühmten Lettermark-Logos gehören die von IBM, CNN, HP und H&M.
Bildmarken oder Symbole
Bildmarken und Symbole sind nicht-abstrakte, visuelle Bilder, welche deinen Unternehmensnamen oder deine Dienstleistung repräsentieren. Du siehst das beispielsweise beim Apple-Logo und dem Twitter-Vögelchen.
Maskottchen
Maskottchen-Logos bauen auf einen Charakter oder einen Firmensprecher, um ein Unternehmen zu repräsentieren. Zu den berühmten Maskottchen gehören der McDonalds-Clown, der Frosties-Tiger und Mr. Peanut.
Wortmarke
Eine Wortmarke setzt auf maßgeschneiderte Typographie des Textes, um eine Marke darzustellen. Denke nur mal an VISA, Google oder Coca Cola.
Bereit, deinen eigenen Designwettbewerb zu starten?
Unsere Designer warten darauf, mit dir gemeinsam an tollen Entwürfen zu arbeiten.
—
Dieser Artikel wurde ursprünglich von Alex Bigman verfasst und 2014 veröffentlicht. Die aktuelle Version wurde überarbeitet und um neue Informationen und Beispiele ergänzt.
