4.9
(138)

Grafikdesign lernen:

Die Design-Grundlagen verstehen und sofort loslegen

Egal ob Logo, Website, Visitenkarte, Flyer oder App – dieser Artikel hilt dir, die Design-Grundlagen zu verstehen, damit du sofort loslegen kannst und eigene Designs gestalten kannst.

Es gibt viele Wege zu kommunizieren.

Neben der geschriebenen und gesprochenen Sprache, der Körpersprache wie Mimik und Gestik gibt es auch die visuelle Sprache: die Gestaltung.

Über Gestaltungselemente und Design transportieren wir genauso eine Botschaft wie mit geschriebenen und gesprochenen Worten. Doch damit ankommt, was wir sagen möchten, ist die richtige Ausgestaltung des Designs wichtig.

„Design ist der Plan, Elemente so anzuordnen, dass man eine bestimmte Aufgabe durchführen kann“.

Charles Eames (Designer und Architekt)

Was ist eigentlich Design?

Im kreativen Umfeld ist oft von Design die Rede, wenn wir über das optische Erscheinungsbild verschiedenster Dinge sprechen. Doch was versteht man eigentlich genau unter dem Begriff?

Das Design bezeichnet grundlegend den Entwurf oder die Darstellung von Objekten. Damit ist aber nicht nur die reine Optik gemeint, sondern auch die Funktionalität. Dieser Aspekt unterscheidet das Design von der Kunst und zeigt, dass weitaus mehr als die ästhetische Erscheinung für gutes Design wichtig ist.

Wenn von Design die Rede ist, geht es konkret um die Anordnung von Elementen zur Erfüllung eines bestimmten Zwecks, Bedürfnisses oder Ziels. Das Design oder die Gestaltung beschäftigt sich also damit, bestimmte Informationen zu strukturieren und darzustellen. Damit findet das Design Anwendung in der industriellen Fertigung, im Produktdesign, im Grafikdesign, im Webdesign, im Mediendesign, in der Architektur und in vielen weiteren Bereichen, die Gestaltung und Funktion verknüpfen.

Die Aufgabe des Designs ist es, Botschaften an bestimmte Empfänger zu kommunizieren. Deshalb ist es unabdingbar, sich zunächst mit der Zielgruppe zu beschäftigen, die mit dem Design angesprochen werden soll. Nur so lässt sich sicherstellen, die Bedürfnisse der Zielpersonen mithilfe des Designs richtig zu adressieren und zu erfüllen. Damit ist das Design ein Kommunikationsmittel, welches die Fragen „was“, „warum“, „wie“, und „für wen“ beantwortet.

Und was ist Grafikdesign?

Das Grafikdesign findet seine Anwendung bei der Gestaltung jeglicher Medien und wird deshalb gerne auch mit dem Begriff der visuellen Kommunikation gleichgesetzt. Im Grafikdesign werden visuelle Objekte wie Typografie und Bilder sowie interaktive Elemente eingesetzt, um die Informationsverarbeitung des Betrachters zu verbessern und um Botschaften visuell zu transportieren. Wie das Design im Allgemeinen verfolgt also auch das Grafikdesign nicht nur einen künstlerischen, sondern auch einen funktionellen Anspruch.

Grafikdesign ist die Kunst, Informationen auf eine verständliche Weise darzustellen.

Früher beschäftigte sich das Grafikdesign vor allem mit der Gestaltung analoger Kommunikationsmittel. Das sind beispielsweise Flyer, Magazine, Produktverpackungen oder Werbeplakate. Heutzutage muss ein Grafikdesigner sich allerdings genauso mit den digitalen Medien auskennen und Aufgaben wie das Design von Websites, digitalen Produkten, Brandings und Logos stehen auf der Tagesordnung.

 

Eine kurze Geschichte des Grafikdesigns

Die Kunst, Informationen in Form von Bildern und Illustrationen auszudrücken, ist altbewährt: Bereits ab dem 12. Jahrhundert erschienen erste Zeitungen und Broschüren mit handgefertigten Zeichnungen. Mit der Erfindung der Drucktechnik und der Typografie konnten derartige Werke später leichter vervielfältigt werden. Angefangen hat dies mit der Holz- und Kupferstich-Technik im 15. Jahrhundert.

Anschließend folgten chemotechnische Verfahren wie die Verwendung von Ätzplatten und später die Aquatinta-Technik und die Lithografie. Der Begriff des Grafikdesigns geht auf William Addison Dwiggins zurück, der mit seinen Arbeiten als Schriftdesigner und Kalligraph Anfang des 20. Jahrhunderts bis heute gültige Standards setzte. Mit der Entwicklung der modernen Medien wurde das Grafikdesign immer stärker etabliert: angefangen von Zeitungen und Printwerbung bis hin zum Einsatz grafischer Elemente im Fernsehen.

Die schnelllebige Online-Welt führte seit der professionellen Nutzung von Computern zu zahlreichen neuen Möglichkeiten im Design. Botschaften und Inhalte werden nicht mehr nur mit Drucksachen verbreitet, sondern vor allem digital. Und ein ansprechender optischer Auftritt wird auch für Unternehmen immer wichtiger, wodurch sich Begriffe wie Corporate Design und Corporate Identity gerade in den letzten Jahren im Design etabliert haben.

Deschichte des Grafikdesigns

Grafikdesign kann jeder lernen: Die Design-Basics

Grafikdesign kann jeder lernen. Wichtig ist nur, einige Grundlagen und Prinzipien der Gestaltung zu kennen und zu verstehen. Alles, was du an Designgrundlagen wissen musst, habe ich dir zusammengefasst – ganz gleich, ob du ein Print- oder Web-Projekt vor dir hast. Die Gestaltungsgrundlagen lassen sich nämlich auf jegliche Art des Kommunikationsdesigns anwenden.

Es geht in diesem Artikel gar nicht darum, ein Experte für Design zu werden. Ich möchte dir zunächst die Basics näherbringen und dir einige Inhalte vermitteln, die dir den Start in die Design-Welt deutlich erleichtern werden. Wenn du tiefer in die Materie eintauchen willst, habe ich dir zahlreiche weitere Artikel aus dem Webdesign Journal zwischendurch verlinkt.

Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 1

Der Beginn jedes Designs:
Das Konzept

Zu Beginn eines jeden Designprozesses steht ein Konzept. Dabei ist es ganz egal, ob es sich um ein gesamtes Magazin, eine Website oder um ein Branding oder Logo handelt – wenn zu Beginn alle Anforderungen definiert und klar sind, lassen sich die einzelnen Elemente viel leichter mit der gewünschten Wirkung zusammensetzen.

Das Konzept fasst alle relevanten Bestandteile deines Designprojektes zusammen. Diese sind beispielsweise:

  • Ausgangssituation & Rahmenbedingungen
  • Zielsetzung & Botschaft
  • Zielgruppe
  • Ideen
  • Zeitplan
  • Strategie

Jeder Designer muss klar im Blick behalten, was er für wen wie und mit welcher Absicht gestalten möchte. Denn nur so kann das Design am Ende seinen Sinn und Zweck erfüllen und das widerspiegeln, was transportiert werden soll.

Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 2
Eine – zumindest kleine – schriftliche Analyse und Konzeption hilft dir vor dem Gestalten.

Die Erstellung des Designs:
Der Designprozess

Eine klare Abfolge von Schritten ist notwendig, um auch wirklich nichts zu vergessen. Ein strukturierter Prozess hilft dir, ein wirklich wirksames Design zu entwickeln.

Der Ablauf eines professionellen Designprojektes sieht im besten Fall wie folgt aus:

1. Brainstorming & Konzepterstellung:
Du sammelst alle Ideen, die dir in den Sinn kommen und lässt dich von verschiedenen Quellen inspirieren. In dieser Phase eignen sich Moodboards und Stylescapes, um deine Ideen zu visualisieren.

2. Skizzierung / Sketching:
Du fertigst verschiedene Skizzen oder Mockups mit Alternativen der Designs an.So erhältst du ein erstes Gefühl, in welche Richtung es gehen kann.

3. Ausarbeitung:
Du entwirfst das Design aufbauend auf dem, was dir in der Sketching-Phase gefallen hat.

4. Korrekturphase:
Du verbesserst deine Entwürfe, bis du vollständig zufrieden bist. Am besten holst du dir dazu Feedback von anderen Personen ein.

5. Finale Anpassungen:
Aufbauend auf das Feedback kümmerst du dich um die finale Überarbeitung.

6. Produktion:
Je nachdem, um welche Art von Design oder Produkt es sich handelt, ist es nun an der Zeit für den Druck des Printdesigns oder Go-Live des Webdesigns.

Der Designprozess
Der Designprozess

Die wichtigsten Gestaltungselemente im Grafikdesign

Wenn du Grafikdesign lernen möchtest, habe ich eine gute Nachricht: Design erfindet sich nicht ständig neu. Im Gegenteil, einige Grundelemente der Gestaltung finden sich in nahezu jedem Design wieder. Daher zeige ich dir nun im Folgenden, welche Gestaltungselemente du auf jeden Fall kennen solltest.

Design lernen:

Die (Grund-)Formen – alles in …

Alles, was wir wahrnehmen, hat im Grunde irgendeine Form. Selbst die Natur zeigt uns die vielfältigsten Formen und Linien und genauso erzeugen wir diese künstlich, wie in der Architektur, in der Kunst oder im Design. Und jede Form vermittelt schon eine Botschaft und Assoziationen.

Quadrat

Die Quadratform (zusammen mit der Rechteckform) kommt häufig  in menschlich geschaffenen Umgebungen und Designs vor: Gebäude, Wände und Möbel, Bücher oder Bildschirme, Handys und Kameras sowie viele andere alltägliche Dinge haben quadratische oder rechteckige Formen. Aufgrund der geraden Linien und rechten Winkel wirken sie statisch und ausgeglichen.

Häufige Assoziationen und Emotionen beim Quadrat:
Vertrauen, Zuverlässigkeit Sicherheit, Autorität, Stärke, Stabilität.

Grafikdesign Quadrat & Rechteck Formen
Quadrate und rechteckige Formen vermitten Stabilität und Konstanz.

Kreis

Ohne Anfang , ohne Ende – Die Kreisform entspricht einem Kreislauf. Sonne, Mond und Erde – der Kreis ist ein Ursymbol mit tiefer Bedeutung und fast schon Mystik.

Die Kreisform wirkt weich und milde, aber auch nicht so stabil. Sie wird in Designs eher zurückhaltend, zum Beispiel als eine Art Banner oder aufmerksamkeitsstarkes Element eingesetzt.

Häufige Assoziationen und Emotionen beim Kreis:
Vollkommenheit, Unendlichkeit, Ganzheit, Harmonie, Ausgewogenheit.

Grafikdesign Kreisform
Kreisrunde Formen machen ein Design lebendig.

Dreieck

Das Dreieck ist eine energiegeladene und dynamische Form, die immer mit Bewegung und Richtung assoziiert wird. Die Linien sind so angeordnet, dass sich unsere Augen automatisch zur Spitze eines Dreiecks oder in die Richtung bewegen, in der es angeordnet ist.

Dreiecke können verschiedene Bedeutungen haben. Ein aufrechtes Dreieck vermittelt ein Gefühl der Stabilität und des Gleichgewichts, während ein umgedrehtes Dreieck riskant und sturzgefährdet wirkt und  ein Gefühl der Anspannung vermittelt.

Das Dreieck hat auch eine große theologische und esoterische Bedeutung und ist hier oft zu finden wie bspw. als Symbol für die christliche Dreifaltigkeit.

Häufige Assoziationen und Emotionen beim Dreieck
(die je nach Lage des Dreiecks variieren können):
Gleichgewicht, Stabilität, Dynamik, Wachstum, Aufregung, Risiko, Gefahr, Entwicklung, Richtung, Fortschritt.

Grafikdesign Dreieck Formen
Dreiecksformen geben einem Design Dynamik.

Linie

Man versteht unter einer Linie eine Form, die mindestens zwei Punkte miteinander verbindet. Sie kann unterschiedlich stark (also dick oder dünn) gestaltet sein und muss nicht immer gerade verlaufen. Genauso existieren wellige oder zackige Linien.

Du kannst Linien individuell hinsichtlich Farbe, Stärke, Textur und Stil gestalten. Je nachdem, welche Art von Linie du verwendest, erzeugst du damit eine unterschiedliche Optik.

Verwendete Linien sollten immer zur übergeordneten Formsprache passen:
Wenn du also viele Kreise als Gestaltungselemente verwendest, passt eine wellige Linie besser als eine zackige Linie.

Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 3
Eine Linie ist nicht gleich eine Linie.
Grafikdesign Linien
Eine Linie ist nicht gleich eine Linie.

Natürliche, weiche Formen

Nebden den drei oben genannten Grundformen – Quadrat, Kreis und Dreieck – gibt es natürlich noch weitere Formen. Eine Möglichkeiten zur Unterscheidung zwischen Formen bietet der Grad der Härte. Manche Formen erscheinen eher weich, manche eher hart je nachdem, wie viele Ecken und Kanten das Objekt aufweist.

Weiche formen wirken wie organische und damit natürliche Formen. Blätter, Blumen, Bäume, Tiere und viele andere Vertreter der Flora und Fauna sind die Inspirationsquelle für Künstler und Designer.

Häufige Assoziationen und Emotionen bei weichen Formen:
Organisch, Weichheit, Originalität, Harmonie, Bewegung, Freundlichkeit, Verspieltheit.

Grafikdesign weiche Formen
Weiche Formen wirken harmonisch.

Harte Formen

Im Gegensatz zu den weichen Formen strahlen harte Formen hingegen  eine größere Stärke und Dynamik aus und wirken emotionsloser.

Sie stehen eher für abstrakte Ideen oder vereinfachte Versionen von natürlichen Formen. Sie sind stilisierter, damit aber auch klarer. Sie werden häufig im Grafikdesign verwendet, insbesondere für Logos und Icons. Abstrakte Formen sind ein wirksames Mittel, um eine Botschaft schnell und ohne Text zu vermitteln.

Häufige Assoziationen und Emotionen bei harten Formen:
Klarheit, Robustheit, Stärke, Härte, Unflexibilität.

Grafikdesign harte Formen
Harte Formen zeigen klare Kante und Kontrast.

Design lernen:

Farbgestaltung

Darauf solltest du bei der Auswahl der Farben für dein Design achten:

  • Farbwirkung: Erzielt die Farbe die gewünschte Wirkung?
  • Benutzerfreundlichkeit: Kann man die Darstellungen gut lesen und sehen?
  • Corporate Design: Passt die farbliche Gestaltung zu deinem Branding?
  • Wettbewerb: Hebst du dich mit deinem Design vom Wettbewerb ab?
  • Zielgruppe: Erzielt dein Design die gewünschte Assoziation bei deiner Zielgruppe?

Was es bei den einzelnen Punkten zu beachten gilt, insbesondere beim Design einer Website, habe ich dir in meinem Beitrag Farbschema finden zusammengefasst.

Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 4

Farben lassen sich nicht nur nach grün, rot, blau oder gelb unterscheiden, sondern genauso sind Helligkeit, Sättigung und Kontrast für das Farbspiel ebenso von Bedeutung.

  • Farbton: Der Farbton ist die Eigenschaft, in der eine Farbempfindung von einer anderen Farbe unterschieden wird.
  • Sättigung: Die Sättigung gibt an, wie das Verhältnis zwischen Farbe und Grau- bzw. Weißanteil ist. Desto mehr Farbanteil vorherrscht, desto satter ist die Farbe.
  • Helligkeit: Die Helligkeit einer Farbe beschreibt, wie hell oder dunkel diese erscheint.
Einstellungsebene in Adobe Photoshop. Die drei Farbwerte Farbton, Sättigung und Helligkeit lassen sich per Regler verändern.
Einstellungsebene in Adobe Photoshop:
Die drei Farbwerte Farbton, Sättigung und Helligkeit lassen sich per Regler verändern.

Farben spielen übrigens nicht nur bewusst, sondern auch unbewusst eine Rolle. Die psychologische Wirkung von Farben solltest du also bei deinen Designs unbedingt beachten, wenn du die Gestaltung zielgerichtet und strategisch angehen willst.

Beispiele für die Wirkung von Farben:

  • Rot: stimulierend, aktivierend, belebend
  • Gelb: anregend, heiter
  • Blau: beruhigend, symbolisiert Vertrauen und Sicherheit
  • Schwarz: einschüchternd, symbolisiert Macht und Dominanz
Kostenlose Infografik Farbwirkung
Farbwirkung
Farben erzielen psychologische Wirkungen.

Genauso erzielen Farbkontraste, also die Wechselwirkung zwischen zwei Farbtönen, eine bestimmte Wirkung. Werden mehrere Farben gleichzeitig oder nebeneinander eingesetzt, so beeinflusst dies das gesamte Erscheinungsbild. Es ist also von Bedeutung, nicht nur die einzelnen Farben und ihre Wirkung für sich zu betrachten, sondern das Zusammenspiel mehrerer Farben, der Farbkontrast. Die acht Arten von Farbkontrasten habe ich dir in einem eigenen Beitrag vorgestellt.

Die Möglichkeiten der Farbgestaltung sind grenzenlos. Die Aufgabe, die richtige Farbe für das eigene Design zu finden, kann schon einmal überfordern. Zur Inspiration und Unterstützung gibt es einige Tools, die dir dabei helfen, Farbpaletten und Farbverläufe zu entdecken. In einem weiteren Artikel habe ich dir 30 Farb-Tools vorgestellt, mit denen du passende Farben für dich findest.

Wenn du einmal die richtigen Farben gefunden hast, kannst du sie in einem Styleguide festhalten. Dort trägst du alle Farben ein, an denen sich dein Design orientiert. Das erspart dir später die Suche nach den Farbcodes und erleichtert dir die Arbeit bei weiteren Designs mit deinem Branding.

Design-Styleguide
Ein Design-Styleguide definiert genaue Designmaße und -werte.

Design lernen:

Typografie

Nicht nur der Inhalt zählt, sondern auch seine Verpackung. Deshalb sind die gewählten Schriftarten für das Aussehen deines Designs von enormer Bedeutung.

„(Web-)Design ist zu 95 % Typografie“

Oliver Reichenstein

Hier gibt es einiges zu beachten:

1. Auswahl
Es gibt mittlerweile unzählige Schriftarten, die du für die Typografie deines Designs nutzen kannst. Um dir bei der Wahl zu helfen, habe ich in meinem Beitrag Über 95 Typo- und Fonts-Tools für deinen Webdesign-Alltag jede Menge Typo- und Fonts-Tools vorgestellt, mit denen du die perfekte Schriftart für dein Design findest.

2. Kombinationen
Nur eine einzige Schriftart für alles zu verwenden, wäre fast langweilig. Mit dem Einsatz mehrerer unterschiedlicher Schriftarten (die aber dennoch zueinander passen!) kannst du die Aufmerksamkeit der Leser lenken und ansprechendere Designs erstellen. Damit die Schriften aber miteinander harmonieren, gibt es verschiedene Methoden für die Auswahl von Schriftkombinationen. Doch auch hier gilt: Weniger ist mehr.

3. Schriftgrößen
Um die Lesbarkeit deiner Texte und Designs zu gewährleisten, ist die Schriftgröße sehr wichtig. Dabei solltest du im Webdesign auf die verschiedenen Endgeräte und deren Viewports achten. Fließtext und die verschiedenen Überschriften sollten sich in ihrer Größe unterscheiden, um den Text grafisch zu strukturieren. Durch die Nutzung verschiedener Schriftgrößen schaffst du somit eine visuelle Hierarchie und Kontraste, die den Blick des Nutzers lenken.

4. Schriftschnitt
Als Schriftschnitt bezeichnet man eine Variation einer Schriftart hinsichtlich ihrer Stärke, Laufweite und Lage. Mehrere verwandte Schriftschnitte werden als Schriftfamilie bezeichnet.

Serifen-Schriften wirken seriös, geschwungene Schriftarten vermitteln eine Dynamik. Wer ein zeitloses Design kreieren will, sollte auf gerade Schriften setzen, die zudem den Vorteil mit sich bringen, auf jedem Endgerät gut lesbar zu sein.

Grafikdesign Typografie
Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 10
Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 11
Im Typography Handbook gibt es viele tiefgehende Einblicke in die typografische Gestaltung.

Design lernen:

Bilder

Um Designs ästhetisch und aufmerksamkeitsstark zu gestalten, ist Bildmaterial unverzichtbar. Wenn du kein Budget oder keine Zeit für ein eigenes Shooting hast, eignen sich sogenannte Stock-Photos. In meinem Beitrag zeige ich dir, wo du kostenlose Fotos finden kannst.

Im Webdesign sind Bilder eine tolle Möglichkeit, um Texte zwischendurch aufzulockern.
Wer Bilder auf Websites einpflegt und nutzt, muss jedoch die Bildoptimierung für das Web beachten, um keine Ladezeit-Einbußen und somit ein schlechteres SEO-Ranking zu riskieren.

Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 17
Die Fotoportale bieten jede Menge Auswahl an hochwertigen Bildern.

Design lernen:

Texturen & Muster

Wenn dein Design besonders auffallen soll oder sich abheben soll, kannst du auch zu besonderen Texturen greifen. Gerade als Hintergrund für dein Design sind die ansprechenden Muster geeignet, um eine einprägsame Wirkung zu erzielen.

Man unterscheidet verschiedene Arten von Texturen, zum Beispiel:

1. Geometrische Texturen

Bei geometrischen Texturen besteht der Hintergrund aus einer Komposition geometrischer Elemente. Die verschiedenen Formen hast du ja bereits kennengelernt. So lassen sich bei dieser Art von Textur beispielsweise Streifen, Rauten, Quadrate, Kreise und einiges mehr zu einem auffallenden Muster anordnen. Zu viele Elemente können den Blick des Betrachters jedoch ablenken, weshalb du trotzdem die Lesbarkeit deines Designs im Hinterkopf behalten solltest.

2. Pixeltextur

Sogenannte Pixeltexturen bestehen aus geometrischen Mustern, die wiederum aus einzelnen Pixeln bestehen. Optisch entsteht somit ein heterogenes Bild, das schon fast „rau“ wirkt. Die verschiedenen Pixel lassen sich nicht einzeln erkennen, wodurch ein einzigartiges Erscheinungsbild kreiert wird. Gerade im Webdesign ist eine Pixeltextur beliebt und sorgt für stilvolle Auftritte.

3. Dekorative Textur

Eine dekorative Textur verwendet verschiedene komplexe Elemente. Das erzeugt eine besonders verspielte Optik, die dein Design auffallend gestaltet. Die dabei eingesetzten Ornamente lassen das Design in einem Vintage-Charakter erscheinen, bei dem jedoch Vorsicht geboten ist:
Wenn die verwendeten Elemente zu groß sind, kann das Design etwas langweilig wirken. Achte also bei der dekorativen Textur darauf, eher kleine Formen zu nutzen.

Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 23
Geometrische Muster wirken sehr markant.
Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 24
Muster und Texturen bieten sich als Hintergründe im Design an, um Stimmungen zu erzeugen.

Was du als Design-Anfänger wissen musst:

Die Grundlagen effektiven Designs

Gerade als Design-Anfänger können die vielen Anforderungen von gutem Design sicherlich überfordern. Die Möglichkeiten in der Gestaltung sowie im Grafik- oder Webdesign sind beinahe grenzenlos. Dennoch gibt es einige Gestaltungsgrundlagen, deren Verständnis dir dabei helfen wird, ansprechende Designs zu entwickeln.

Grundlagen Grafikdesign

Designprinzipien

Um ein wirklich effektives Design – also ein Design, das einen Zweck und ein Ziel verfolgt – zu gestalten, gibt es verschiedene Prinzipien, die du dir zunutze machen solltest.

Designprinipien Übersichtlichkeit

Übersichtlichkeit

Achte darauf, dass du den Betrachter nicht überforderst. Stelle die einzelnen Designelemente übersichtlich dar. Der Fokus sollte dabei auf den wichtigsten Elementen liegen, sodass die Aufmerksamkeit nicht abgelenkt wird.

Designprinipien Lesbarkeit

Lesbarkeit

Stelle sicher, dass dein Design gut lesbar ist. Im Web ist hier insbesondere das responsive Design wichtig, also, dass die Gestaltung sich an die unterschiedlichen Viewports und Endgeräte anpasst. So kann eine zu helle oder zu verschnörkelte Schrift die Lesbarkeit beeinträchtigen.

Designprinipien Ästhetik

Ästhetik

Ästhetische Designs überzeugen und begeistern. Schönheit liegt zwar bekanntlich im Auge des Betrachters, aber dennoch gibt es gewisse Kriterien, die schöne Designs aufweisen. Beispielsweise, dass die Farben und Schriften miteinander harmonieren oder dass das Design besonders modern gestaltet ist.

Designprinipien Emotion

Emotionen

Einzigartige Designs, die begeistern und Emotionen wecken, bleiben länger in Erinnerung. Auch der Inhalt, der transportiert wird, wird vom Gehirn stärker verarbeitet, wenn Gefühle im Spiel sind. Emotionen kannst du in deinem Design gut über Bilder oder ansprechende Texte ansprechen.

Grundlagen Grafikdesign​

Anordnung und Raster

Damit wir die einzelnen Gestaltungselemente übersichtlich anordnen können, hilft uns ein Raster.

Du kennst sicher das typische Raster einer Zeitung: Die einzelnen Elemente wie Headline, Subline, Text, Inhaltsverzeichnis, Bilder usw. sind so angeordnet, dass wir uns zurechtfinden. Denn sie sind jeden Tag gleich.

Dank eines Rasters fällt es uns leichter, die Informationen wahrzunehmen oder gezielt nach etwas zu suchen. Gerade bei der Gestaltung von umfangreichen Inhalten ist ein Raster enorm wichtig, an welchem wir als Designer die einzelnen Gestaltungselemente ausrichten.

Um ein Raster zu erstellen, helfen Grundlinien und Hilfslinien. Auch eine Tabelle bzw. Spalten oder Zeilen können als Raster dienen.

Manchmal ist es aber gerade interessant das Raster aufzubrechen. Wenn einzelne Elemente bewusst aus dem Raster ragen, verschafft es dem Design eine Dynamik. Denn wenn alle Elemente starr am Raster „kleben“, kann es aus Harmonie schnell Langeweile werden…

Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 25
Ein Raster hilft, die Elemente anzuordnen.
Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 26
Grafikdesigns können natürlich auch gerade dann spannend sein, wenn sie das Raster brechen.

Grundlagen Grafikdesign​

Kontrast

Ohne Kontrast sind Elemente nicht unterscheidbar und kein Design erkennbar. So ist beispielsweise ohne einen Helligkeitskontrast zwischen Vorder- und Hintergrundfarbe ein Text nicht lesbar.

Ein Kontrast bedeutet also, das zwei Elemente visuell klar unterscheidbare Merkmale haben.  Dann kann neben der Farbe auch die Größe betreffen oder die Anordnung/Positionierung, die Form und die (Animations-)Geschwindigkeit.

Je größer die Kontraste, umso spannungsreicher ist das Design – und umgekehrt.

Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 27
Der größtmögliche Farbkontrast: Schwarz und weiß – wirkt sehr markant und aufmerksamkeitsstark

Grundlagen Grafikdesign​

Größen

Neben der Farbgebung sind die Größenverhältnisse wohl das markanste Gestaltungsmittel. Die Größe eines Elements spiegelt seine Bedeutung wieder – allgemein gesprochen: je größer, umso gewichtiger. Im Einzelnen hängt es dann natürlich noch von anderen visuellen Eigenschaften ab.

 

Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 28
Die Größenunterschiede machen die Design spannungsreich.

Grundlagen Grafikdesign​

Weißraum

Weißraum bezeichnet die freie Fläche zwischen den einzelnen Elementen. Er ist wichtig, damit die einzelnen Gestaltungsformen ihre Wirkung entfalten können. Denn durch die weiße bzw. freie Umgebung wird unser Auge nicht abgelenkt und kann sich auf das Designelement fokussieren.

Achte bei deinen Designs darauf, genügend Platz zwischen den einzelnen Elementen und Inhalten zu lassen, sodass du den Betrachter nicht überforderst.

Grafikdesign Weißraum
Viel Weißraum lässt die Elemente atmen und zur Wirkung kommen.

Grundlagen Grafikdesign​

Hierarchie

Alle Elemente des Gestaltungsrasters folgen einer bestimmten Hierarchie. Diese wird dem Betrachter zum Beispiel dadurch vermittelt, dass verschiedene Größen und Farben für die einzelnen Elemente verwendet werden. Gerade bei Inhalten wie Text ist das besonders wichtig, denn so kann der Leser die einzelnen Passagen besser scannen und eine Orientierung erhalten.

Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 29
Farben, Größen, Abstände unterstützen die visuelle Hierarchie einer Website und lenken die Blicke des Betrachters.

Grundlagen Grafikdesign​

Symmetrie

Die Symmetrie hilft dem Betrachter dabei, das Wahrgenommene leichter zu verarbeiten. Von Symmetrie spricht man, wenn die Elemente entlang einer Achse gleich angeordnet sind. Perfekt symmetrisch sind die Objekte genau dann, wenn man sie entlang einer Achse spiegeln kann.

Mit einer symmetrischen Anordnung sorgst du für Harmonie und Balance in deinem Design. Stell dir mal vor, die Apps auf dem Smartphone-Bildschirm wären unsymmetrisch angeordnet – du würdest dich nicht mehr zurechtfinden, oder? Und genau deshalb hilft die Symmetrie dabei, das Layout in jede Richtung leicht zu lesen.

Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 30
Ein symmetrisches Layout wirkt harmonisch.

Grundlagen Grafikdesign​

Perspektive

Durch die Perspektive stellen wir dar, welche Wichtigkeit die einzelnen Elemente aufweisen. Durch Größe und Kontrast lassen sich die einzelnen Objekte voneinander abgrenzen. Durch die so entstehenden Gegensätze schaffen wir eine grafische oder räumliche Komposition und lenken den Blickwinkel des Betrachters.

Auf den Blickwinkel kommt es an:
Was siehst du im Bild: Kopf oder Vase?

Du siehst: wenn einzelne Elemente nicht kontrastreich voneinander abgegrenzt werden, fällt es uns schwer, das Design zu interpretieren. Deshalb ist es hilfreich, Elemente im Vordergrund größer und dunkler darzustellen und die Objekte im Hintergrund hingegen kleiner und mit weniger Kontrast (vergraut).

Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 31

Grundlagen Grafikdesign​

Rhythmus

Als Rhythmus bezeichnet man die Bewegung, die durch ein sich wiederholendes Muster von Formen entsteht. Das gesamte Design besteht somit aus einer Sequenz von Elementen in gleicher Reihenfolge, die sich aneinanderreihen.

Ähnlich wie in der Musik hilft uns bei der Betrachtung eines Designs ein Rhythmus, um mit der Gestaltung vertraut zu werden. Es fällt dem Betrachter leichter, das Gesehene zu verarbeiten und zu erinnern.

Genauso kann aber durch eine Unterbrechung des Rhythmus ein besonderer Akzent gesetzt werden: Wenn sich die Reihenfolge plötzlich ändert, wird ein Kontrast geschaffen, der die Aufmerksamkeit der Betrachter weckt. Es hilft also, wichtige Elemente optisch durch ein Aufbrechen des Rhythmus hervorzuheben.

Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 32

Grundlagen Grafikdesign​

Bewegung & Animation

Der gezielte Einsatz von bewegten oder animierten Elementen wird als Motion Design bezeichnet. Derartige Elemente sind besonders aufmerksamkeitsstark.

Als Designer kannst du hier mit verschiedenen Eigenschaften wie Farben, Effekten und Geschwindigkeiten spielen und damit gezielt den Leser bzw. Nutzer steuern.

Die eingesetzten Elemente der Bewegungsgestaltung haben Einfluss auf die User Experience. Als Beispiel hierfür kann man sich eine häufig verwendete „Back-to-top“-Schaltfläche ansehen, mit der man im Web zurück zum Hauptmenü springen kann.

Je nachdem, wie die Bewegung gestaltet wird, kann ein solcher Button eine unterschwellige Funktion bereitstellen oder zu einer Ablenkung vom Inhalt führen.

Design Animation
Animationen schaffen Aufmerksamkeit im Design.

Grundlagen Grafikdesign​

Gestaltgesetze

Egal ob Screen- oder Printdesign: Verschiedene Gesetze und Gestaltprinzipien erleichtern uns das Layout. Außerdem führt ihre Anwendung zu einer besseren User Experience. Denn sie erklären, wie die menschliche Wahrnehmung beeinflusst wird und geben uns dadurch hilfreiche Rückschlüsse für die Gestaltung.

Diese Gestaltgesetze solltest du unbedingt kennen:

UX-Prinzipien: Gesetz der Prägnanz – Logodesign

Das Gesetz der Prägnanz

Weniger ist mehr – das beschreibt im Kern den Gedanken des Gesetzes der Prägnanz, oder Gesetz der einfachen Gestalt genannt. Wir nehmen Elemente und Formen stets auf ihre einfachste Weise wahr, um die kognitive Anstrengung für unser Gehirn so gering wie möglich zu halten.

Deshalb sollten Designs nicht zu verkünstelt sein, sondern möglichst mit einfachen Strukturen auskommen. Man sagt daher: Gutes Design ist so wenig Design wie möglich.

UX-Prinzipien: Gesetz der Nähe

Das Gesetz der Nähe

Laut dem Gesetz der Nähe nehmen wir nahe beieinander liegende Elemente als zusammengehörig wahr.

Deshalb ist es so wichtig, Leerraum und Weißflächen strategisch einzusetzen: Grenze ab, was nicht zueinander gehört und schaffe so eine übersichtlichere Struktur. So können die Augen des Betrachters leichter wahrnehmen, wo ein inhaltlicher Abschnitt beginnt und wo er endet.

UX-Prinzip: Der Goldene Schnitt
Der Goldene Schnitt Im Webdesign ist der Goldene Schnitt ein bewährtes Gestaltungsraster, das hilft, die richtigen Proportionen zu finden. Er beschreibt das ideale Seitenverhältnis zweier Teile zueinander. Der Goldene Schnitt verwendet ein mathematisch berechnetes Teilungsverhältnis von 1 : 1,618, um ein harmonisches Bild zu schaffen. Damit du nicht rechnen musst, kannst du dir einfach merken, Abschnitte in Drittel einzuteilen. So kannst du dich an diesem Verhältnis wie an einem Gestaltungsraster orientieren.

So kommst du auf neue Ideen:

Inspiration für deine Designs

Auch im Design wird das Rad nicht immer neu erfunden. Wer viel gestaltet, benötigt daher viel Inspiration. Um deiner Kreativität auf die Sprünge zu helfen, habe ich einige Quellen gesammelt, wie du auf neue Design-Ideen kommen kannst.

Design-Inspirationen

Blogs & Podcasts für Designer

Blogs sind eine tolle Möglichkeit, um sich (kostenlos) weiterzubilden. Der viele Wissens- und Erfahrungsschatz, der im Internet vorzufinden ist, lässt sich auf diese Weise ansprechend aufbereiten und du findest mittlerweile Artikel zu sämtlichen Design-Themen. Bei größeren Blogs kannst du dich oft für einen Newsletter eintragen und wirst so bei neuen Blogbeiträgen benachrichtigt.

Wer lieber zuhört statt liest, für den sind sicher Podcasts die bessere Wahl. Audioformate lassen sich beispielsweise super unterwegs hören, was Zeit spart und unterhaltsam ist.

In meinem Beitrag Design- & Webdesign-Blogs & -Podcasts zur Weiterbildung präsentiere ich dir aktuelle (Web)design-Blogs und Podcasts, die dir bei der Weiterbildung und Inspiration helfen.

Design-Inspirationen

Trends: Das ist im Design in diesem Jahr modern

Auch im Design ändert sich das Empfinden über Modernität und Ästhetik immer wieder. Jedes Jahr kann man bestimmte Gestaltelemente häufiger vorfinden, die den Nerv der Zeit bestimmen. Das ist wichtig, getreu dem Motto: Wer nicht mit der Zeit geht, geht mit der Zeit. Ansprechende Inhalte laden die Betrachter ein, sich länger mit dem Design zu beschäftigen – im Web gleichermaßen wie Offline. Deshalb darfst du dich gerne bei der Gestaltung deiner Designs von aktuellen Trends und Stilen im Grafikdesign inspirieren lassen.

Trendfarben

Zur Trendfarbe des Jahres wurde die Pantone-Farbe „Very Peri“ gekürt. Laut Pantone steht der Farbton, der eine Mischung aus Blau und Rot ist, für hoffnungsvolle Verändungen. Gerade in Zeiten von Krisen also ein positiver Wegweiser, der sich da in die Farbwelt eingeschlichen hat.

Mehr über Farbtrends im Webdesign

Webdesign Trends

Da im Webdesign neben ästhetischen Ansprüchen vor allem technische Feinheiten von Bedeutung sind, fokussieren Trends im Webdesign die Gestaltung sowie die Technik gleichermaßen.

Ein Beispiel sind hier die sog. One-Pager. Wer bei seinem Webauftritt auf eine solche Seite setzt, verortet lieber viele Inhalte auf einer langen Seite anstelle über mehrere Unterseiten verteilt. Das passt auch gut zum modernen Marketing-Ansatz des Storytellings, bei dem der Inhalt eine Geschichte abbildet und einen roten Faden behält.

Mehr über Webdesign Trends

Was ist der Unterschied?

Mediendesign, Kommunikationsdesign, UX Design und Grafikdesign

Wenn du Grafikdesign lernen willst, wirst du vermutlich auf einige fachverwandte Themen stoßen: Die Disziplinen Mediendesign, Kommunikationsdesign, UX Design und Grafikdesign ähneln sich zwar in einigen Inhalten, unterscheiden sich aber in verschiedenen Aufgabenbereichen voneinander.

Sämtliche Tätigkeitsbereiche im Design beschäftigen sich damit, Informationen zu vermitteln, Emotionen zu erzeugen und Farben und Formen zu verwenden, um ein bestimmtes Ziel zu erreichen. Deshalb sind viele der Fachdisziplinen nicht unbedingt trennscharf voneinander zu unterscheiden, sondern zeigen Überschneidungen.

Das Kommunikationsdesign und das Grafikdesign beispielsweise liegen recht eng beieinander. In einigen Ausbildungen und Studiengängen behandelt das Kommunikationsdesign neben den Grafikdesign Grundlagen noch einige weitere Bereiche, wie beispielsweise Marketing, Werbung, Film und Fotografie – es ist also noch etwas breiter gefasst. Manchmal werden beide Fachrichtungen jedoch synonym verwendet.

Der Unterschied zum Mediendesign hingegen ist größer: Während Grafiker die Kommunikationsmittel lediglich gestalten, setzen Mediendesigner die Designs technisch um. Das Mediendesign fokussiert sich damit noch stärker auf digitale Anwendungen wie beispielsweise die Gestaltung von Bewegtbild- oder Audioformaten, während das Grafikdesign sich klassischerweise auf die rein visuelle Gestaltung statischer Formate bezieht.

Das User Experience Design (UX Design) geht noch einen Schritt tiefer und beschäftigt sich mit der Analyse, Kreation und Optimierung der Nutzererfahrung bei der Interaktion des Nutzers mit einer digitalen Anwendung. Im Gegensatz zu einem Grafikdesigner, der sehr spezialisiert arbeitet und sich um die Gestaltung kümmert, ist ein UX Designer interdisziplinär aufgestellt und vereint verschiedenste Themengebiete, die stärker auf die Technik abzielen.

Wie wird man Grafikdesigner?

Die Berufsbezeichnung des Grafikdesigners ist gesetzlich nicht geschützt. Das bedeutet, dass keine spezifische Lehre als Grafikdesigner erforderlich ist, um in diesem Job zu arbeiten. Wenn du möchtest, kannst du dir die notwendigen Inhalte sogar selbst beibringen.

Das Angebot an möglichen Ausbildungen ist vielfältig – Bedarf für Grafikdesigner gibt es in jeder Branche. Eine Ausbildung zum Designer, Grafikdesigner oder Mediengestalter wird in sämtlichen Unternehmen angeboten. Du findest ausgeschriebene Stellen sowohl in kleinen Agenturen als auch in öffentlichen Einrichtungen und großen Konzernen.

Einige Unternehmen verlangen einen Hochschulabschluss, den du beispielsweise an einer Universität oder (Fach-)Hochschule erwerben kannst. Dafür gibt es einige geeignete Bachelor- und Masterstudiengänge wie beispielsweise:

  • Grafikdesign
  • Mediendesign
  • Visuelle Gestaltung
  • Design
  • Kommunikationsdesign

Wenn dir das kreative Arbeiten liegt und du dich beruflich umorientieren möchtest, ist ein Quereinstieg in das Grafikdesign ebenso möglich. Mit etwas Recherche findest du passende Weiterbildungen oder Lehrgänge, die dir wichtige Grafikdesign Grundlagen vermitteln, damit du dir ein Portfolio aufbauen kannst. Das ist wichtig, um potenziellen Auftraggebern oder Arbeitgebern deine Expertise zu zeigen.

Der Beruf des Grafikdesigners

Die Tätigkeit eines Grafikdesigners ist sehr abwechslungsreich. Die Aufgaben umfassen den Print- sowie Online-Bereich und reichen von der Gestaltung von Drucksachen bis zur Gestaltung von digitalen Medien.

Konkret macht ein Grafikdesigner beispielsweise folgendes:

  • Gestaltung von Broschüren, Flyern, Magazinen, Visitenkarten, Zeitschriften, Anzeigen und sonstigen Drucksachen
  • Entwerfen von Produktdesigns und Verpackungsgestaltungen
  • Gestaltung von digitalen Produkten und Websites
  • Umgang mit verschiedener Design- und Gestaltungssoftware (z. B. Adobe Creative Suite)
  • Konzeption und Design von Brandings
  • Kundenberatung inkl. Entwicklung von Entwürfen, Designvorschlägen und Prototypen

Für all diese Aufgaben braucht ein Grafikdesigner sowohl das nötige Wissen über die Grafikdesign Grundlagen als auch über verschiedenste Anwendungen und Software-Programme. Außerdem bedarf es eines besonderen Gespürs für Farbe und Form, um ansprechende Designs zu erstellen.

Die meisten Grafikdesigner sind auf bestimmte Bereiche spezialisiert, in denen sie ihr Talent und ihre Kreativität unter Beweis stellen können. Da sich die digitalen Möglichkeiten heutzutage sehr schnell verändern und stets weiterentwickeln, ist der Beruf des Grafikdesigners sicherlich nicht langweilig.

Design lernen leicht gemacht:

Grafikdesign in a Nutshell

Wie ich bereits gesagt habe, möchte ich dir mit diesem Blogbeitrag dabei helfen, die Designgrundlagen von gutem Design kennenzulernen. Die wichtigsten Prinzipien fasse ich dir zum Schluss noch einmal zusammen. Wenn du Grafikdesign lernen willst, behalte diese abschließenden Tipps im Hinterkopf.

1. Design ist ein Prozess

Bei manchen Projekten wird es schwierig sein, bereits zu Beginn zu wissen, wie das finale Produkt aussehen soll. Denn Design ist vielmehr ein iterativer Prozess, der an vielen Punkten neue Wege einschlägt, Wiederholungsschleifen durchläuft, Ideen verwirft und wieder neu entwickelt. Sogar Fehler zu machen, gehört dazu. (Die häufigsten Design-Fehler habe ich dir übrigens in einem weiteren Beitrag vorgestellt.)

2. Gutes Design benötigt Zeit

Ein wirklich gutes Design oder besser gesagt ein Design, das seinen Zweck erfüllt, benötigt Zeit. Deshalb darfst du dich für deine Projekte schon einmal in Geduld üben: Die vielen Schritte und Prozesse kosten dich Zeit, Geld und Nerven. Oft sind Variablen von außen bestimmt, zum Beispiel von Vorgaben des Kunden oder durch Einschränkungen in deiner Software.

3. Es macht einen Unterschied, für wen du designst

Wenn du ein Projekt für dich selbst gestaltest, ist das eine ganz andere Situation, als wenn du für einen Kunden oder Auftraggeber etwas entwirfst. Bestimmte Prozesse, wie Korrekturrunden und Feedbackrunden mit dem Kunden fallen bei deinen eigenen Projekten zum Beispiel weg – so können sich eben sowohl Zeitplan als auch Kalkulation je nach Auftraggeber ändern.

4. Design darf sich weiterentwickeln

Ein Design zu erstellen ist keine starre Aufgabe. Selbst wenn das Projekt einmal fertiggestellt ist, wird es nicht unbedingt für die Ewigkeit bestimmt sein. Gerade im schnelllebigen Internet werden digitale Designs ständig weiterentwickelt. So beispielsweise im Webdesign, welches sich ständig fortentwickelt und immer wieder von neuen Trends bestimmt wird.

Egal, für welches Design du dich am Ende entscheidest, denke daran, dass die Gestaltung authentisch ist und zu dir beziehungsweise zum Ziel der Aufgabenstellung passt. Es gibt im Design wie in so vielen Bereichen nicht immer den einen Weg.

Probiere dich aus und mache dich zu Beginn mit den dargestellten Designgrundlagen vertraut, um dein Gestaltungsprojekt ganzheitlich und erfolgreich anzugehen.

Und jetzt du:
Wie hast du Grafikdesign gelernt? Welches Wissen brauchst du noch, um selber im Design durchzustarten? Lasse es uns unten in den Kommentaren wissen:

Grafik-Design lernen: Die Design-Grundlagen verstehen und sofort loslegen 38

Über 8.250 sind schon dabei:

Exklusive Webdesign-Inhalte

Kostenfreie Templates + regelmäßig Webdesign-Links & -tipps

Deine Daten sind sicher. Mehr Infos: Beispiele, Datenschutz, Analyse und Widerruf

Optimiere Websites und
deinen Webdesign-Workflow:

Über den Autor

Martin Hahn ist Webdesigner, Dozent, Fachbuchautor und dreifacher Papa. Seit vielen Jahren hilft er anderen effektivere Webdesigns zu erstellen – in Schulungen und mit Artikeln auf dieser Website.
Mehr über diese Website und den Autor erfahren   →

Die Inhalte des Webdesign Journals wurden mit Sorgfalt, Engagement und Liebe erstellt – so auch dieser Artikel. Wenn du Ergänzungen oder Anmerkungen hast, kannst du dich gerne bei mir melden. Ebenso wenn du Ideen oder Wünsche für weitere Themen hast.

Wenn du Ausschnitte oder Zitate in wissenschaftlichen Arbeiten zitieren möchtest, kann du dies gerne machen. Was gar nicht geht: Inhalte klauen oder kopieren! Sollte aber selbstverständlich sein…

Bewertungsergebnis: 4.9 / 5. | Anzahl der Bewertungen: 138

Nach oben scrollen

Über 8.250 sind schon dabei!

Exklusive Webdesign-Inhalte

Bleibe up to date mit den kostenlosen Templates und den wöchentlichen Links & Tipps: