121126 Vorlesung Layout - Aktuelles |...

Bauhaus-Universität Weimar Planungsgrundlagen CAAD

Layout und ProportionenVorlesung Planungsgrundlagen-CAAD

16.12.2013


Inhalt▪ Kontext: Der Begriff Layout in verschiedenen Bereichen

▪ Proportionen und Wahrnehmung

▪ Grundlegende Gestaltungsprinzipien

▪ Raster

▪ Rasterelemente

▪ Gestaltgesetze

▪ Ausblick

▪ Literatur


Der Begriff Layout in verschiedenen Bereichen

Die Grundsätze für Layout und Komposition werden über alle vi-suell-kreativen Bereiche hinweg angewandt, auch wenn dies nicht immer sofort ersichtlich ist. Die Vorgabe, Informationen und ver-schiedenen Elemente so zu or-ganisieren, dass beim Betrachter ein harmonischer, interessanter Eindruck entsteht, ist der Aus-gangspunkt für die Anwendung der im Folgenden vorgestellten Grundsätze.

• Typografie

• Musik

• Innenarchitektur

• Möbel

• Architektur

• Zeitungen

• Magazine

• Bücher und Broschüren

• Verpackung

• Websites

• Bebaute Umgebung

• Qualitative Information

• Identity-Programme


Das Layout organisiert den typo-grafischen Inhalt, sodass Buch-staben Wörter bilden, die Sätze bilden, die Textblöcke bilden, die eine bestimmte Ordnung haben. Ohne diese Ordnung wäre die Vermittlung der Information nicht möglich.

Layout und Typografi e


Layout und Typografi e

Ohne diese Ordnung wäre die Vermittlung der Information nicht möglich...

Gmäeß eneir Sutide eneir elgnihcesn Uvinisterät, ist es nchit witihcg in wlecehr Rneflogheie die Bstachuebn in eneim Wrot snid, das ezniige was wcthiig ist, ist daß der estre und der leztte Bstabchue an der ritihcegn Pstoiion snid. Der Rset knan ein ttoaelr Bsinöldn sien, tedztorm knan man ihn onhe Pemoblre lseen. Das ist so, wiel wir nciht jeedn Bstachuebn enzelin leesn, snderon das Wrot als gseatems.


Layout in der Musik

Musiknotation verwendet ein Sys-tem zur Angabe von Höhe, Dauer und Lautstärke von Tönen sowie weiterer Attribute, die zum Spie-len nötig sind. Sie wurde über Jahrhunderte bis zu dem heuti-gen Notensystem aus fünf waag-rechten Linien mit senkrechten Taktstrichen weiterentwickelt.

Abb. aus: Das Schriftbild der Neuen Mu-sik, Erhard Karkoschka.Zeichnung: Cage: Cartridge Music. Blatt 7


Layout nach musikalischen Grundsätzen

Seitendesign kann Elemente aus verschiedenen Disziplinen umfas-sen. Die Gestaltung eines Buchs ähnelt dem Schreiben eines Mu-sikstücks insofern, als beide ein Präludium (Einleitung), diverse Crescendi (Verstärkung) und Di-minuendi (Verringerung) sowie einen Refrain (Wiederkehr) ent-halten.


Layout in der Innenarchitektur und beim Grundrissentwurf

Innenarchitektur formt eine Innen-raumerfahrung durch den Einsatz von Oberflächen und Raumvolu-men. Innenarchitektur strebt da-nach, ein funktionierendes Layout als Teil eines Gesamtkonzepts zu schaffen, und nutzt dazu Elemen-te aus Disziplinen wie Architektur, Möbeldesign und Psychologie.


Layout beim Möbeldesign

Trotz unzähliger Stilvarianten ba-siert Möbeldesign auf Layout, da hier Objekte gestalet werden, die zur menschlichen Gestalt passen sollen und strukturelle Elemente aufweisen, die unterschiedliche physische Belastungen aushal-ten können.


Layout architektonischer Flächen (Fassaden, Wände, Boden)

Architektur hält sich strikt an die Grundsätze des Layouts, sowohl in der Planungsphase als auch beim Bau des Gebäudes. Der Grundraster eines Gebäudes wird durch dessen Grundriss und die tragenden Wände bestimmt und für Fenster, Trennwände und dekorative Elemente weiter un-terteilt.


Layout im Städtebau und in der Stadt- und Raumplanung

Milet New York Luchao, Gerkan, Marg und Partner

Theresienhöhe München,Otto Steidle


Layout bei Zeitungen, Zeitschriften und Büchern


Layout bei Verpackungen, Websites und der bebauten Umgebung


Layout für quantitative Informationen

Der Einsatz von Tabellen und Grafiken zur Darstellung quanti-tativ umfangreicher Informatio-nen ist ein einfaches, effektives und zudem noch visuelles Mittel zur Präsentation und Organisati-on der Information in einem Lay-out.

Otto Neurath: Isotype, die Wie-ner Methode der Bildstatistik


Proportionen

Unter Proportionen versteht man das Verhältnis eines Teilelements zum Ganzen, etwa das Verhältnis von Textkolumnen zur Gesamt-seite. Proportionen sind nützlich zur Gestaltung eines ausgewo-genen Layouts, da sie die Grö-ßenverhältnisse der verschiede-nen Designelemente definieren, etwa ihre relative Größe und die Abstände.


Der Goldene Schnitt (lat. sectio aurea) oder auch die göttliche Teilung (lat. proportio divina) ist ein bestimmtes Verhältnis zweier Zahlen oder Größen:

Zwei Strecken stehen im Ver-hältnis des Goldenen Schnittes, wenn sich die größere zur klei-neren Strecke verhält wie die Summe aus beiden zur größeren Strecke.

Der Goldene Schnitt


Anwendung des Goldenen Schnitts


Drittelregel

Die Drittelregel ist eine Methode, die in der Regel von Fotografen verwendet wird, um interessante Bildkompositionen zu schaffen. Sie kann aber auch auf Kompo-sitionen in den grafischen Küns-ten und selbst beim Textil- und Möbeldesign angewandt werden. Mit der Drittelregel lassen sich Schwerpunkte schaffen, die das Auge auf die Stellen lenken, an denen interessante Elemente po-sitioniert sind.


Das visuelle Zentrum

Das visuelle Zentrum hat nichts mit dem mathematischen Zent-rum eines Bildes oder Designs zu tun. Es ist ein Punkt, der etwas höher und rechts davon liegt. Das visuelle Zentrum bildet einen Schwerpunkt in einem Bild, der genutzt werden kann, um einen Hotspot zu schaffen, an dem der Blick des Betrachters „hängen-bleibt“.


Menschliche Proportionen und der Modulor von Le Corbusier

Der Vitruvische Mensch. Leonardo da Vin-cis Zeichnung über die Proportionen des menschlichen Körpers.

Le Corbusier:Villa Savoye


Modulor


Zahlenfolgen

Es gibt verschiedene Zahlenseri-en, z.B. Primzahlen, bevorzugte Zahlen, Quadratzahlen und Fibo-nacci-Zahlen. Solche Zahlenfol-gen können verwendet werden, um ein Maß schrittweise zu er-höhen und gleichzeitig das Ver-hältnis der Zahlen untereinander zu erhalten. Im Gegensatz dazu steht eine willkürliche Erhöhung von Maßen

0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, 233, 377, 610, 987, 1597, 2584, 4181, 6765, 10946, .......


Anwendung Fibonacci-Zahlen


Wie wir eine Seite lesen I

Jede beliebige Seite hat aufgrund der Natur des Inhalts und der Art wie das Auge natürlicherweise eine Seite auf der Suche nach Information überfliegt, aktive und passive Bereiche.


Wie wir eine Seite lesen II


Wie wir einen Bildschirm lesen I

Leser „scannen“ Webseiten so, wie sie eine gedruckte Seite nach Schlüsselwörtern oder etwas In-teressantem mit den Augen absu-chen. Ein Designer kann diesen Prozess unterstützen und wichti-ge Abschnitte mit Schlüsselwör-tern sowie Aufzählungspunkten hervorheben.


Gestaltungsprinzipien


Vokabular des Layoutdesigns I

Gestalt

Gestalt im Grafikdesign heißt, dass ein Design nicht aus ei-nem einzelnen Element besteht, sondern aus einer Kombination verschiedener Elemente oder Formen, die in einer bestimmten Konfiguration zusammenwirken.

Nähe

Nähe bezieht sich auf die Plat-zierung von Elementen zueinan-der, damit ein Zusammenhang zwischen ihnen hergestellt wird; ein Beispiel: Wird eine Bildunter-schrift in die Nähe einer Illustra-tion gerückt, impliziert das, dass die Bildunterschrift zu dieser Il-lustration gehört.

Geschlossenheit

Dieser Begriff bezieht sich auf die Notwendigkeit, die verschiede-nen Elemente eines Designs zu einem Bild zusammenzufügen, das geschlossener wirkt als die Summe der einzelnen Elemente.Je besser die Elemente zueinan-derpassen, desto stimmiger wirkt das Design. Geschlossenheit lässt sich unter anderem durch Nähe und Wiederholung errei-chen, da so eine Beziehung zwi-schen den verschiedene Objek-ten hergestellt wird.

Ausrichtung

Ausrichtung bezieht sich darauf, dass ein Design eine Struktur ha-ben muss. Die Ausrichtung ergibt die Struktur, über die wir Zugang zu den im Design enthaltenen In-formationen bekommen; ein Bei-spiel: Es wäre schwierig einen Satz ohne Ausrichtung zu lesen, da er lediglich eine Ansammlung von zusammengewürfelten Buch-staben wäre. Die durch die Aus-richtung erzielte Struktur ermög-licht es dem Designer, den Leser oder Betrachter durch das Design zu führen.


Vokabular des Layoutdesigns II

Kontrast

Kontrast bezieht sich auf die Plat-zierung verschiedener Elemente im Design, und zwar so, dass da-durch die Unterschiede zwischen ihnen deutlich werden. Kontrast sorgt für Form und Dynamik in ei-nem Design und kann so erhebli-che Spannung erzeugen.

Hierarchie

Hierarchie bedeutet die Reihen-folge der Designelemente nach Wichtigkeit. Das lässt sich durch Größe, Abstand oder Farbe errei-chen.

Ausgewogenheit

Ob ein Design stimmig ist oder nicht, hängt davon ab, wie aus-gewogen sich die Elemente eines Designs zu einander verhalten. Im Allgemeinen wird ein Designer nach Ausgewogenheit streben, damit Bilder und Schriften zuei-nanderpassen. Dies ist jedoch nicht immer wünschenswert, da sich mit anderen Konzepten ein-dringlichere Aussagen erzielen lassen.

Weißraum

Die Verwendung von Weißraum (oder Leerraum) gibt einem De-sign Platz zum Atmen und wird auch oft als die Lunge eines guten Designs beschrieben. Weißraum lenkt das Auge des Betrachters auf das Element, das er umgibt, und ist häufig ein Indikator dafür, wie wichtig etwas ist.

Juxtaposition

Das Nebeneinanderstellen von Elementen, die für unterschiedli-che Konzepte oder Perspektiven stehen, kann eine starke Verbin-dung zwischen ihnen herstellen, die ansonsten nur schwer zu er-reichen wäre.


Vokabular des Layoutdesigns III

Kontinuität oder Wiederholung

Wiederholung verstärkt die Aus-sage und weist auf die Bedeu-tung hin, Die kontinuierliche Verwendung optischer Elemen-te, z.B. bei einer Beschilderung, dient außerdem zur Verstärkung der Aussage, da der Betrachter sie nicht noch einmal neu inter-pretieren muss. Wenn der Leser ein Bild oder eine Aussage schon kennt, wird er beim Wiedersehen fast immer automatische eine Verbindung herstellen.

Rhetorik

Beeinflussung ist ein grundlegen-des Ziel vieler Designs, z.B. von Plakaten und Werbematerialien. Daher ist die effektive Verwen-dung einer auf die Zielgruppe abgestimmten Sprache ein ent-scheidender Faktor.


Dieser äußere Rand einer Seite oder Doppelseite wird oft als tote Fläche angesehen. Er kann je-doch wirkungsvoll den Inhalt ei-ner Seite einrahmen.

Der Perimenter


Im Design stellt Juxtaposition eine Technik dar, mithilfe derer kontrastierende Bilder nebenein-andergestellt werden.

Juxtaposition


Weißraum oder Weißfläche ist jede leere, unbedruckte und un-genutzte Fläche, die Grafik- und Textelemente in einem Design umgibt.

Weißraum


ISO- und Papierformate


Formen auf einer Seite

Die Komposition eines Designs wird aus Schrift- und Bildele-menten gestaltet, die eine Seite grundlegend formen.


Seitenstruktur

Gruppierung

Querformat

Perimeter

Im Winkel

Horizontal

Axial

Vertikal

Passepartout


Proportion

Mit Proportion kreiert man eine Dynamik zwischen den Design-elementen. Sie kann ausgewo-gen sein oder bestimmte Elemen-te wie Bilder betonen.

Passiv Aktiv


Hierarchie

Designer verwenden das Konzept der Hierarchie, um über Größe und Positionierung die wichtigs-ten Informationen eines Designs zu identifizieren und zu präsen-tieren.

Position, Größe und BetonungPosition und Größe


Netz- und Punktzeichnung

Designer verwenden einfachste Muster wie Netze (etwa Karopa-pier) oder Punkte als „pädago-gische“ Raster zur Anleitung der Platzierung der Elemente.

Das Netz als Raster Der Punkt als Raster


Raster

Ein Designer hat bei seinem Projet die Auswahl zwischen verschie-denen Rastertypen. Der Raster bringt als übliches Strukturele-ment hinter jede Arbeit Ordnung, Übereinstimmung und Effektivi-tät in den Gestaltungsprozess. Unterschiedliche Raster dienen unterschiedlichen Zwecken. Mit manchen Rastern lassen sich besser Bilder oder eine Vielzahl komplexer Informationen, mit an-deren wiederum eher große Text-passagen organisieren.


Symmetrische Raster

Bei diesem Raster, der auf den Doppelseiten einer Publikation verwendet wurde, spiegeln sich Recto- und Versoseite.


Asymmetrische Raster

Dieser Raster ist normalerweise an der linken oder rechten Seite ausgerichtet und liefert eine Dop-pelseite, auf der das Layout bei-der Seiten identisch ist.


Module

Module sind separate Blöcke oder Einheiten in einem Rastersystem für die Aufnahme oder Gruppie-rung bestimmter Text- oder Bild-elemente.


Verbundraster

Die Vorstellungen und Konzepte hinter dem symmetrischen so-wie dem asymmetrischen Raster und den Modulen können bei der Verwendung von Verbundrastern kombiniert werden.


Kombinationen

Wie zuvor gezeigt, ermöglichen Verbundraster das Zusammen-wirken von Modulen und Spalten. Sie werden jedoch oft nur in ein-fachen Kombinationen verwen-det.


Horizontale Bewegung

Diese entsteht, wenn ein Raster das Auge quer über eine Dop-pelseite oder Einzelseite führt, indem die Designelemente ent-sprechend platziert werden.


Diagonal- und Winkelraster

Diese Raster funktionieren nach den gleichen Prinzipien wie die horizontalen, sind aber gekippt oder geneigt und erlauben es, Designelemente ungewöhnlich und weniger orthodox zu präsen-tieren.


RasterelementeSchrift und Bilder


Scribble

Wenn Sie einen exakt ausge-druckten feinen Linienrahmen als Formatbegrenzung erstellen, in den Sie dann Freihand scribblen, sieht das gleich viel professionel-ler aus, als mit einem schiefen Freihandrahmen. Handschriftli-che Texte und dilettantische Bild-darstellungen gehören ebenso wenig ins Scribble wie liniertes oder kariertes Papier.


Schrift ist gewöhnlich das Haup-telement, das ein Raster enthal-ten, formen und strukturieren muss. Nicht nur die Auswahl der Fonts, auch wie Schrift behandelt und bearbeitet wird, beeinflusst maßgeblich das Erscheinungs-bild des Designs.

Schrift

Man teilt Schriften generell in zwei Gruppen ein: Schriften mit Serifen (Antiqua) und Schriften ohne Serifen (Grotesk).


Eine Reihe imaginärer, parallel verlaufender Linien, die die An-ordnung von Textelementen in ei-nem Design lenken.

Die Grundlinie

Der Raster nimmt Bildelemente auf, verbessert und kennzeichnet ihre Positionierung. Bilder und ihre Anordnung beeinflussen das Design einer Publikation.

Bilder


Text kann horizontal zentriert, links- oder rechtsbündig, zugleich im Flatter- oder im Blocksatz aus-gerichtet werden, was eine Viel-zahl von Kombinationen bietet.

Horizontale Ausrichtung


Diese Ausrichtung von Elemen-ten in Textblöcken bietet neue und alternative Arten, Text zu po-sitionieren und zu präsentieren.

Vertikale Ausrichtung


Eine Spalte ist eine senkrechte Struktur in einem Raster, die in einem Design Textelemente ent-hält und formt.

Spalten

Die Anzahl der Spalten auf ei-ner Seite hat großen Einfluss auf das Erscheinungsbild der ganzen Doppelseite und beeinflusst die Lesbarkeit eines Texts.

Anzahl der Spalten


Diese unsichtbare Linie der Aus-gewogenheit oder Akzentuierung eines Designs kann durch Anord-nung von Designelementen ent-stehen und kontrolliert werden.

Achse


Gestaltgesetze


Der dänische Psychologe Edgar John Rubin (1886 - 1951) formu-lierte 1921 drei Erkenntnise zur Figur-Grund-Unterscheidung:

• Die Figur ist begrenzt und er-scheint dabei geformt, der Grund ist unbegrenzt und erscheint da-her ungeformt.

• Die Figur erscheint fest und hat Gegenstandscharakter, der Grund erscheint locker und un-bestimmt.

• Die Figur ist hervortretend und auffallend, der Grund eher zu-rückweichend und unscheinbar. Figuren besitzen deshalb „Ge-stalt“.

Figur und Grund


Kommen in einer Szene mehrere gleichartige Formen vor, so wer-den diejenigen, die näher zuein-ander gelegen sind, als Einheit wahrgenommen, die weiter ent-fernt gelegenen jedoch nicht.

Gesetz der Nähe


Unabhängig von ihrer Entfer-nungszuordnung werden gleich-artige Elemente in Abgrenzung von andersartigen als zusam-mengehörig gesehen.

Gesetz der Gleichartigkeit


Nach der Prägnanztendenz wer-den bevorzugt geschlossene, sinnhaltige Formen wahrgenom-men, insbesondere geometrische Grundformen.

Gesetz der Geschlossenheit


Das Gesetz der guten Fortset-zung bzw. des durchgängigen Linienverlaufs bezieht sich auf die Wahrnehmungspräferenz. Werden abknickende Linien aus nicht allzu unterschiedlichen Ele-menten gebildet, greift nicht das Gesetz der Gleichartigkeit, son-dern das Gesetz der guten Fort-setzung:

Gerade durchlaufende Linien werden bevorzugt wahrgenom-men gegenüber solchen mit Ver-änderungen des Formverlaufs.

Gesetz der guten Fortsetzung


Dem Gesetz der Geschlossen-heit folgend, werden Teilformen einer prägnanten Gestalt in der Wahrnehmung zu geschlossenen sinnhaltigen Formen ergänzt; es entstehen die so genannten virtu-ellen Figuren (auch Scheinbilder oder amodale Figuren).

Virtuelle Figuren


AusblickDavid Carson


Dekonstruktion im Grafi kdesign


Historische Vorläufer

Dada publication Merz, designed by Kurt Schwitters and El Lissitzky, 1924

F.T. Marinetti, Zang Tumb Tumb (Parole in Liberta), 1914


Literatur

121126 Vorlesung Layout - Aktuelles |...

Documents

Transcript of 121126 Vorlesung Layout - Aktuelles |...