Die Gestaltungsprinzipien und ihre Bedeutung

Veröffentlicht: 2022-03-11

Hören Sie sich die Audioversion dieses Artikels an

Einer der schwierigsten Teile beim Reden über Designprinzipien ist herauszufinden, wie viele Prinzipien es tatsächlich gibt (sind es fünf? Sieben? Zehn?). Und wenn das geklärt ist, welche dieser vermeintlichen Designgrundlagen sollten enthalten sein?

Suchen Sie nach „Principles of Design“ und Google gibt Ergebnisse für Artikel zurück, die fünf bis mehr als ein Dutzend einzelner Prinzipien enthalten. Selbst die Artikel, die sich auf die Nummer einigen, stimmen nicht unbedingt darin überein, welche in dieser Nummer enthalten sein sollten.

In Wirklichkeit gibt es ungefähr ein Dutzend Grundprinzipien des Designs, die sowohl Anfänger als auch erfahrene Designer bei der Arbeit an ihren Projekten berücksichtigen sollten. Darüber hinaus gibt es etwa ein Dutzend weitere „sekundäre“ Designprinzipien, die manchmal als Grundlagen enthalten sind (z. B. die Gestaltprinzipien, Typografie, Farbe und Rahmung). Die wichtigsten Konstruktionsprinzipien werden im Folgenden erklärt und illustriert.

Grundlegende Gestaltungsprinzipien

Wie bereits erwähnt, gibt es in der Design-Community keinen wirklichen Konsens darüber, was die Hauptprinzipien des Designs tatsächlich sind. Die folgenden zwölf Prinzipien werden jedoch am häufigsten in Artikeln und Büchern zu diesem Thema erwähnt.

Kontrast

Eine der häufigsten Beschwerden von Designern über Kundenfeedback dreht sich oft um Kunden, die sagen, dass ein Design mehr „auffallen“ muss. Während das wie ein völlig willkürlicher Begriff klingt, meint der Kunde im Allgemeinen, dass das Design mehr Kontrast braucht.

Kontrast bezieht sich darauf, wie unterschiedlich Elemente in einem Design sind, insbesondere benachbarte Elemente. Diese Unterschiede heben verschiedene Elemente hervor. Kontrast ist auch ein sehr wichtiger Aspekt bei der Erstellung barrierefreier Designs. Ein unzureichender Kontrast kann insbesondere Textinhalte sehr schwer lesbar machen, insbesondere für Menschen mit Sehbehinderungen.

Kontrast ist eines der grundlegenden Gestaltungsprinzipien
Die Website von Parabola ist ein hervorragendes Beispiel für ein kontrastreiches Design.

Balance

Jedes Element eines Designs – Typografie, Farben, Bilder, Formen, Muster usw. – hat ein visuelles Gewicht. Einige Elemente sind schwer und ziehen die Aufmerksamkeit auf sich, während andere Elemente leichter sind. Die Art und Weise, wie diese Elemente auf einer Seite angeordnet sind, sollte ein Gefühl der Ausgewogenheit erzeugen.

Es gibt zwei grundlegende Arten von Balance: symmetrisch und asymmetrisch. Symmetrische Designs legen Elemente mit gleichem Gewicht auf beiden Seiten einer imaginären Mittellinie an. Beim asymmetrischen Gleichgewicht werden Elemente mit unterschiedlichen Gewichten verwendet, die oft in Bezug auf eine Linie angeordnet sind, die nicht innerhalb des Gesamtdesigns zentriert ist.

Designgrundlagen: Balance
Ein leicht außermittiges Layout verleiht der Website von The Nue Co ein Gleichgewicht zwischen dem kühnen Bild und der minimalistischen Typografie.

Hervorhebung

Die Betonung bezieht sich auf die Teile eines Designs, die hervorstechen sollen. In den meisten Fällen sind dies die wichtigsten Informationen, die das Design vermitteln soll.

Die Betonung grundlegendes Designprinzip in Aktion
Die übergroße Typografie von Clique betont deutlich den Slogan.

Die Betonung kann auch verwendet werden, um die Wirkung bestimmter Informationen zu verringern. Dies wird am deutlichsten in Fällen, in denen „Kleingedrucktes“ für ergänzende Informationen in einem Design verwendet wird. Winzige Typografie, die am Ende einer Seite versteckt ist, hat viel weniger Gewicht als fast alles andere in einem Design und wird daher weniger betont.

Anteil

Proportionen sind eines der leichter zu verstehenden Designprinzipien. Einfach ausgedrückt ist es die Größe der Elemente im Verhältnis zueinander. Proportionen signalisieren, was in einem Design wichtig ist und was nicht. Größere Elemente sind wichtiger, kleinere Elemente weniger.

Proportionen sind ein wesentlicher Bestandteil von Designelementen und -prinzipien
Die proportionalen Unterschiede zwischen der winzigen Schrift und den großen Bildern zeigen deutlich, welche Elemente auf der Website von Collin Hughes am wichtigsten sind.

Hierarchie

Hierarchie ist ein weiteres Gestaltungsprinzip, das sich direkt darauf bezieht, wie gut Inhalte von Personen verarbeitet werden können, die eine Website verwenden. Es bezieht sich auf die Bedeutung von Elementen innerhalb eines Designs. Die wichtigsten Elemente (oder Inhalte) sollten als die wichtigsten erscheinen .

Designgrundlagen: Hierarchie
Die Website von Grafill schafft Hierarchien durch die Verwendung von Layout (der wichtigste Teil befindet sich oben), Größe (wichtiger Inhalt ist größer) und Typografie (Überschriften sind größer als Fließtext).

Hierarchie lässt sich am einfachsten durch die Verwendung von Titeln und Überschriften in einem Design veranschaulichen. Dem Titel einer Seite sollte die größte Bedeutung beigemessen werden und daher sofort als wichtigstes Element auf einer Seite erkennbar sein. Überschriften und Unterüberschriften sollten so formatiert sein, dass ihre Bedeutung im Verhältnis zueinander sowie zu Titel und Fließtext deutlich wird.

Abonnieren Sie den Design-Blog von Toptal und erhalten Sie unser eBook

Wiederholung

Wiederholung ist eine großartige Möglichkeit, eine Idee zu verstärken. Es ist auch eine großartige Möglichkeit, ein Design zu vereinheitlichen, das viele verschiedene Elemente zusammenbringt. Wiederholungen können auf verschiedene Weise erfolgen: durch Wiederholung derselben Farben, Schriftarten, Formen oder anderer Elemente eines Designs.

Dieser Artikel verwendet beispielsweise Wiederholungen im Format der Überschriften. Jedes Designprinzip ist genauso formatiert wie die anderen in diesem Abschnitt, was den Lesern signalisiert, dass sie alle gleich wichtig und miteinander verwandt sind. Konsistente Überschriften vereinheitlichen diese Elemente auf der Seite.

Wiederholung ist ein wichtiges Gestaltungsprinzip
Die Bilder auf der linken Seite der Website von Type and Pixel sind ein großartiges Beispiel für Wiederholungen im Design.

Rhythmus

Die Abstände zwischen sich wiederholenden Elementen können ein Rhythmusgefühl hervorrufen, ähnlich wie der Abstand zwischen Noten in einer Musikkomposition einen Rhythmus erzeugt. Es gibt fünf grundlegende Arten von visuellen Rhythmen, die Designer erstellen können: zufällig, regelmäßig, alternierend, fließend und progressiv.

Zufällige Rhythmen haben kein erkennbares Muster. Regelmäßige Rhythmen folgen dem gleichen Abstand zwischen jedem Element ohne Variation. Wechselnde Rhythmen folgen einem festgelegten Muster, das sich wiederholt, aber es gibt Variationen zwischen den eigentlichen Elementen (z. B. ein 1-2-3-1-2-3-Muster). Fließende Rhythmen folgen Biegungen und Kurven, ähnlich wie sich Sanddünen wellen oder Wellen fließen. Progressive Rhythmen ändern sich im Verlauf, wobei jede Änderung zu den vorherigen Iterationen beiträgt.

Grundlegendes Gestaltungsprinzip: Rhythmus
Der unregelmäßige Abstand zwischen den Formen im Hintergrund der Website von TheArtCenter erzeugt einen zufälligen Rhythmus.

Rhythmen können verwendet werden, um eine Reihe von Gefühlen zu erzeugen. Sie können Aufregung erzeugen (insbesondere fließende und progressive Rhythmen) oder Sicherheit und Beständigkeit erzeugen. Es hängt alles davon ab, wie sie implementiert werden.

Muster

Muster sind nichts anderes als eine Wiederholung mehrerer Designelemente, die zusammenarbeiten. Tapetenmuster sind das allgegenwärtigste Beispiel für Muster, mit denen praktisch jeder vertraut ist.

Im Design können sich Muster aber auch auf festgelegte Standards für die Gestaltung bestimmter Elemente beziehen. Beispielsweise ist die Top-Navigation ein Designmuster, mit dem die Mehrheit der Internetnutzer interagiert hat.

Gestaltungsprinzipien: Muster
Die Top-Navigation ist eines der allgegenwärtigsten Designmuster im Internet, das hier auf der Website von Isabelle Fox veranschaulicht wird.

Weißer Raum

Weißraum – auch als „Negativraum“ bezeichnet – sind die Bereiche eines Designs, die keine Designelemente enthalten. Der Raum ist praktisch leer.

Viele angehende Designer haben das Bedürfnis, jedes Pixel mit einer Art „Design“ zu packen und übersehen den Wert von Weißraum. Aber weißer Raum dient vielen wichtigen Zwecken in einem Design, vor allem, um Elementen des Designs Raum zum Atmen zu geben . Negativraum kann auch dazu beitragen, bestimmte Inhalte oder bestimmte Teile eines Designs hervorzuheben.

Es kann auch Elemente eines Designs leichter erkennbar machen. Aus diesem Grund ist Typografie besser lesbar, wenn Groß- und Kleinbuchstaben verwendet werden, da der Negativraum um Kleinbuchstaben herum vielfältiger ist, was es den Menschen ermöglicht, sie schneller zu interpretieren.

White Space ist eines der wichtigsten grundlegenden Gestaltungsprinzipien
Weißraum gibt dem einfachen Text und den illustrierten Inhalten der Website von Jan Behne Raum zum „Atmen“ und trägt gleichzeitig zu einer minimalistischen Ästhetik bei.

In einigen Fällen wird negativer Raum verwendet, um sekundäre Bilder zu erzeugen, die für den Betrachter möglicherweise nicht sofort erkennbar sind. Dies kann ein wertvoller Teil des Brandings sein, der Kunden begeistern kann. Nehmen Sie zum Beispiel den versteckten Pfeil im FedEx-Logo.

Das FedEx-Logo nutzt den grundlegenden weißen Raum des Designs, um einen versteckten Pfeil zu erzeugen.

Bewegung

Bewegung bezieht sich auf die Art und Weise, wie das Auge über ein Design wandert. Das wichtigste Element sollte zum zweitwichtigsten führen und so weiter. Dies geschieht durch Positionierung (das Auge fällt natürlich zuerst auf bestimmte Bereiche eines Designs), Hervorhebungen und andere bereits erwähnte Gestaltungselemente.

Bewegung ist eine Designgrundlage
Die schrägen Bilder und Zahlen tragen zum Bewegungsprinzip auf der Website von Abby Stolfo bei.

Vielfalt

Vielfalt im Design wird verwendet, um visuelles Interesse zu wecken. Ohne Abwechslung kann ein Design sehr schnell eintönig werden und der Nutzer das Interesse verlieren. Abwechslung kann auf vielfältige Weise geschaffen werden, durch Farbe, Typografie, Bilder, Formen und praktisch jedes andere Gestaltungselement.

Abwechslung um der Abwechslung willen ist jedoch sinnlos. Vielfalt sollte die anderen Elemente eines Designs verstärken und neben ihnen verwendet werden, um ein interessanteres und ästhetisch ansprechenderes Ergebnis zu schaffen, das die Erfahrung des Benutzers verbessert.

Vielfalt ist ein wichtiges Gestaltungsgrundprinzip
Der Website-Hintergrund von Kennard Lilly verwendet eine Vielzahl von Farben und Formen, um Interesse zu wecken und gleichzeitig den primären Textinhalt hervorzuheben.

Einheit

Jeder hat da draußen eine Website oder ein anderes Design gesehen, das scheinbar nur Elemente auf eine Seite geworfen hat, ohne Rücksicht darauf, wie sie zusammengearbeitet haben. Zeitungsanzeigen, die zehn verschiedene Schriftarten verwenden, kommen einem fast sofort in den Sinn.

Einheit bezieht sich darauf, wie gut die Elemente eines Designs zusammenarbeiten. Visuelle Elemente sollten in einem Design klare Beziehungen zueinander haben. Unity trägt auch dazu bei, dass Konzepte klar und zusammenhängend kommuniziert werden. Designs mit guter Einheit scheinen auch organisierter und von höherer Qualität und Autorität zu sein als Designs mit schlechter Einheit.

Gestaltungsprinzipien: Einheit
Die Verwendung von Blau im gesamten Design (einschließlich der blauen Überlagerungen auf den Bildern) zusammen mit konsistenter Typografie und Proportionen schafft ein Gefühl der Einheit im Design.

Andere Gestaltungsprinzipien

Auch andere Gestaltungsprinzipien werden in verschiedenen Artikeln zu diesem Thema angesprochen. Dazu gehören Typografie, Farbe, Gestaltprinzipien, Raster und Ausrichtung, Rahmen und Form. Einige passen definitiv zur Definition von „Prinzipien“, während andere eher Designelemente sind.

Typografie bezieht sich auf die Art und Weise, wie Text in einem Design angeordnet ist. Dazu gehören die verwendeten Schriftarten, deren Abstand, Größe und Gewicht sowie die Art und Weise, wie verschiedene Textelemente zueinander in Beziehung stehen. Gutes typografisches Design wird stark von all den anderen Designprinzipien beeinflusst, die zuvor in diesem Artikel erwähnt wurden.

Die Verwendung von Farbe im Design ist einer der psychologisch wichtigsten Teile eines Designs und hat einen großen Einfluss auf die Benutzererfahrung. Farbpsychologie und -theorie beeinflussen einige der anderen zuvor erwähnten Prinzipien stark.

Zu den Gestaltprinzipien gehören Ähnlichkeit, Fortsetzung, Geschlossenheit, Nähe, Figur/Grund und Symmetrie & Ordnung (auch Pragnanz genannt). Einige dieser Prinzipien sind eng mit den oben erwähnten Prinzipien verbunden.

Raster und Ausrichtung sind eng mit Balance verbunden und beziehen sich auf die Art und Weise, wie Elemente in Bezug auf ein unsichtbares Raster auf der Seite angeordnet sind.

Framing bezieht sich darauf, wie das primäre Thema eines Designs in Relation zu anderen Elementen auf der Seite platziert wird. Es wird am häufigsten in der Kinematographie oder Fotografie erwähnt, wie der Schwerpunkt eines Bildes innerhalb des Gesamtbildes platziert wird. Aber das Prinzip überträgt sich auf das Design.

Form ist auch ein wichtiger Bestandteil jedes Designs, sowohl in Bezug auf bestimmte Formen, die als Elemente innerhalb des Designs verwendet werden, als auch auf die Gesamtform des Designs selbst. Unterschiedliche Formen können unterschiedliche Gefühle hervorrufen, dh Kreise sind organisch und fließend, während Quadrate starrer und formaler sind und Dreiecke ein Gefühl von Energie oder Bewegung vermitteln.

Diese Design-„Prinzipien“ oder -Elemente sind wichtige Aspekte eines guten Designs und sollten zusammen mit den anderen Grundprinzipien berücksichtigt werden, um die besten Benutzererlebnisse zu schaffen.

Fazit

Was die „Grundprinzipien“ des Designs ausmacht, steht sicherlich zur Debatte. Aber das Verständnis und die Umsetzung der oben behandelten Prinzipien ist entscheidend für den Erfolg eines jeden Designprojekts.

Designer sollten versuchen zu verstehen, wie sich jedes dieser Designprinzipien tatsächlich auf ihre Arbeit auswirkt. Zu studieren, wie andere Designer diese Ideen umgesetzt haben, um ihre eigenen Designs zu strukturieren, ist auch ein unglaublich wertvolles Werkzeug, um zu lernen, bessere Designs zu erstellen.

Es ist durchaus möglich, ein gutes Design zu erstellen, ohne diese Elemente und Designprinzipien gründlich zu verstehen. Allerdings geschieht dies in der Regel durch die „Intuition des Designers“ und kann viel Versuch und Irrtum erfordern, um etwas zu schaffen, das tatsächlich gut aussieht und eine optimale Benutzererfahrung schafft. Designer könnten viel Zeit und Energie sparen, indem sie die Prinzipien, die wir besprochen haben, üben, bis sie zur zweiten Natur werden.

•••

Weiterführende Literatur im Toptal Design Blog:

  • Designprinzipien: Einführung in die Hierarchie
  • Steigern Sie Ihre UX mit diesen erfolgreichen Prinzipien des Interaktionsdesigns
  • Erforschung der Gestaltungsprinzipien des Designs
  • Überzeugendes Design: Fortgeschrittene Psychologie effektiv nutzen
  • Der ultimative UX-Hook – Vorausschauendes, überzeugendes und emotionales Design in UX