View
218
Download
2
Category
Preview:
Citation preview
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Layout und ProportionenVorlesung Planungsgrundlagen-CAAD
16.12.2013
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Inhalt▪ Kontext: Der Begriff Layout in verschiedenen Bereichen
▪ Proportionen und Wahrnehmung
▪ Grundlegende Gestaltungsprinzipien
▪ Raster
▪ Rasterelemente
▪ Gestaltgesetze
▪ Ausblick
▪ Literatur
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Layout im Städtebau und in der Stadt- und Raumplanung
Milet New York Luchao, Gerkan, Marg und Partner
Theresienhöhe München,Otto Steidle
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Layout bei Zeitungen, Zeitschriften und Büchern
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Layout bei Verpackungen, Websites und der bebauten Umgebung
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Anwendung des Goldenen Schnitts
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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“.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Modulor
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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, .......
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Anwendung Fibonacci-Zahlen
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Wie wir eine Seite lesen II
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Gestaltungsprinzipien
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Im Design stellt Juxtaposition eine Technik dar, mithilfe derer kontrastierende Bilder nebenein-andergestellt werden.
Juxtaposition
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
ISO- und Papierformate
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Formen auf einer Seite
Die Komposition eines Designs wird aus Schrift- und Bildele-menten gestaltet, die eine Seite grundlegend formen.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Seitenstruktur
Gruppierung
Querformat
Perimeter
Im Winkel
Horizontal
Axial
Vertikal
Passepartout
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Symmetrische Raster
Bei diesem Raster, der auf den Doppelseiten einer Publikation verwendet wurde, spiegeln sich Recto- und Versoseite.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Module
Module sind separate Blöcke oder Einheiten in einem Rastersystem für die Aufnahme oder Gruppie-rung bestimmter Text- oder Bild-elemente.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
RasterelementeSchrift und Bilder
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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.
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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).
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Diese Ausrichtung von Elemen-ten in Textblöcken bietet neue und alternative Arten, Text zu po-sitionieren und zu präsentieren.
Vertikale Ausrichtung
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Diese unsichtbare Linie der Aus-gewogenheit oder Akzentuierung eines Designs kann durch Anord-nung von Designelementen ent-stehen und kontrolliert werden.
Achse
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Gestaltgesetze
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Unabhängig von ihrer Entfer-nungszuordnung werden gleich-artige Elemente in Abgrenzung von andersartigen als zusam-mengehörig gesehen.
Gesetz der Gleichartigkeit
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Nach der Prägnanztendenz wer-den bevorzugt geschlossene, sinnhaltige Formen wahrgenom-men, insbesondere geometrische Grundformen.
Gesetz der Geschlossenheit
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
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
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
AusblickDavid Carson
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Dekonstruktion im Grafi kdesign
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Historische Vorläufer
Dada publication Merz, designed by Kurt Schwitters and El Lissitzky, 1924
F.T. Marinetti, Zang Tumb Tumb (Parole in Liberta), 1914
Bauhaus-Universität Weimar Planungsgrundlagen CAAD
Literatur
Recommended