Vorm & Interactie, 2013 Making and Breaking the Grid. Robert Crain Zsa Zsa Linnemann

Transcriptie

1 Vorm & Interactie, 2013 Making and Breaking the Grid Robert Crain Zsa Zsa Linnemann

2 Grids. Historie. Anatomie. Communicatie

3 Grids - Historie

4 Inkepingen op kleitabletten Mesopotamië 3300 v.chr.

5 Original 13th Century Medieval Illuminated Bible Leaf, Paris Original 13th Century Medieval Illuminated Bible Leaf, Paris

6 Gutenberg 1455: Gutenberg 1455 uitvinder boekdrukkunst uitvinder boekdrukkunst

7 Gutenberg

8 19e eeuwse boeken zijn slecht - vakmanschap vervangen door opzieners en assistenten - slecht papier - typografisch verval, , medische autoriteiten klagen over slechte leesbaarheid - saaie of juist kakafonie van lettertypes - barokletters en renaissanceletters zijn bijna verdwenen

9 William Morris ( ) ontwerper denker socialist schrijver ambachtsman You cannot educate, you cannot civilise man, unless you give him a share in art

10

11 Jugendstil Art Noveau Nieuwe kunst Theo Nieuwenhuis

12 S.H. de Roos

13 Roland Holst 1928

14 Theo van Doesburg 1922

15 Theo van Doesburg Het kapitalenalfabet opgebouwd uit rechthoeken door is gebaseerd op een rechthoek van 5 x 5 raster zodat het in elkaar gedrukt of uitgerekt kan worden. Leesbaarheid en esthetiek waren van ondergeschikt belang t.o.v. de toepasbaarheid.

16 De Stijl, tijdschrift 1917 De Wendingen tijdschrift,1929 Vilmos Huszár

17

18 Piet Zwart Constructivisme Catalogus voor kabelfabrikant

19 Zwitserse school gebaseerd op principes van Bauhaus (functionaliteit) ontwerp door Moholy-Nagy i.s.m. Walter Grophius

20 Modernisme Jurriaan Schroffer

21 Wim Crouwel, methodisch, systematisch met een persoonlijke kleur

22 Wim Crouwel, gebaseerd op de strenge Zwitserse typografie

23 Grids - Anatomie

24 Grids: ruimte, orde en communicatie = leesbaarheid

25 Analyse let op. marges. let op de vouw. wat valt je verder op?

26 modulair gridgrid.

27 marges: negatieve ruimte tussen bladspiegel en inhoud, definiëren/omvatten het veld waar typografie en beeld worden geordend. Proporties behoren goed overwogen: bepalend voor uitstraling. Zorgen voor rust of juist focus. flowlines: uitlijing die de ruimte in horizontalen breekt. Helpen het oog het formaat te overzien. Worden oa gebruikt om blokken tekst te creëren ruimtelijke zone: groep van modules. Vormen verscheidene velden. Velden kunnen verschillende soorten informatie bevatten, p.e. beeld. kolommen: verticale uitlijning van typografie. Kunnen er zoveel als je wilt en eventueel variëren in breedte afhankelijk van info en doelgroep. module: aparte eenheid, gescheiden door regelmatige witruimtes. Door herhaling worden het kolommen en rijen.

28 Vouw, of rug. Breder dan de linker of rechter kant! Let op beeld dat in de rug verdwijnt marker, voor terugkerende info, zoals paginanummers.

29 Ordering Disorder: Manuscriptgrid 1tekstblok o.a. boeken, kunst, wetenschap. Leesbaarheid is lastig(er). Order ing Dis or der is a book by Khoi Vinh that deliv ers a defin Grid Principles for Web Design Order ing Dis or der is a book by Khoi Vinh that deliv ers a defin i tive take on grids and the Web and pro vides both the big ideas and tech niques of grid-based design. Order ing Dis or der is a book by Khoi Vinh that deliv ers a defin i tive take on grids and the Web and pro vides both the big ideas and tech niques of grid-based design. Order ing Dis or der is a book by Khoi Vinh that deliv ers a defin i tive take on grids and the Web and pro vides both the big ideas and tech niques of grid-based design. Order ing Dis or der is a book by Khoi Vinh that deliv ers a defin i tive take on grids and the Web and pro vides both the big ideas and tech niques of grid-based design. of Design. Uni ver sal Prin ci ples of Design is the first com pre hen sive, cross-disciplinary ency clo pe dia of design. of DesignUni ver sal Prin ci ples of Design is the first com prehen sive, cross-disciplinary ency clo pe dia of design. and pro vides both the big ideas and tech niques of grid-based design. of Design. Uni ver sal Prin ci ples of Design is the first com pre hen sive, cross-disciplinary ency clo pe dia of design. of DesignUni ver sal Prin ci ples of Design is the first com pre hen sive let op, allemaal belangrijk: - marges - ruimte tussen letters, witregels - experimenteer met letterbeeld voor esthetiek en leesbaarheid. - letter hoge of juist lage x-as?

30 Ordering Disorder: Grid Principles for Web Design Ordering Disorder: Grid Principles for Web Design Order ing Dis or der is a book by Khoi Vinh that deliv ers a defin Order ing Dis or der is a book by Khoi Vinh that deliv ers a defin i tive take on gridsand the Web and pro vides both the big ideas and tech niques of grid-based design. Order ing Dis or der is a book by Khoi Vinh that deliv ers a defin i tive takeon grids and the Web and pro vides both the big ideas and tech niques of gridbased design. Order ing Dis or der is a book by Khoi Vinh that deliv ers a defini tive take on grids and the Web and pro vides both the big ideas and tech niques of grid based design. Order ing Dis or der is a bookby Khoi Vinh that deliv ers a defin i tive take on grids and the Weband pro vides both the big ideas and tech niques of grid based design. Order ing Dis or der is a book by Khoi Vinh that deliv ers a defin i tive take on grids and the Web and pro vides both the big ideas and tech niques of grid-based design. Order ing Dis order is a book by Khoi Vinh that deliv ers a defin i tive take on grids and the Web and pro videsboth the big ideas and tech niques of grid-based design. of Design. Uni ver sal Prin ci ples of Design is the first com pre hen sive, cross-disciplinary ency clo pe dia of design. of DesignUniver sal Prin ci ples of Design is the first com pre hen sive, cross-disciplinary ency clo pe dia ofdesign. and pro vides both the big ideas and tech niques of grid-based design. of Design. Uni ver sal Prin ci ples of Design is the first com pre hen sive, cross-disciplinary ency clo pe dia ofdesign. of DesignUni ver sal Prin ci ples of Design is the first com pre hen sive Order ing Dis or der is a book by Khoi Vinh that deliv ers a defin i tive take on grids and the Web andpro vides both the big ideas and tech niques of grid-based design. Order ing Dis or der is a book by Khoi Vinh that deliv ers a defin i tive take on grids and the Web and pro vides both the big ideas andtech niques of grid-based design. of Design. Uni ver sal Prin ci ples of Design is the first com pre hensive, cross-disciplinary ency clo pe dia of design. of DesignUni ver sal Prin ci ples of Design is the firstcom pre hen sive, cross-disciplinary ency clo pe dia of design. and pro vides both the big ideas andtech niques of grid-based design. of Design. Uni ver sal Prin ci ples of Design is the first com pre hensive, cross-disciplinary ency clo pe dia of design. of DesignUni ver sal Prin ci ples of Design is the firstcom pre hen sive. Khoi Vinh that deliv ers a defin i tive take on grids and the Web and pro vides both the big ideas and tech niques of grid-based design. Order ing Dis or der is a book by Khoi Vinh that deliv ers a defin- Order ing Dis or der is a book by Khoi Vinh that deliv ers a definletterbeeld letter hoge of juist lage x-as witregel serif of sans serif

31 Kolomgrid toepassingen tijdschriften etc. Smallere kolommen verhogen de leesbaarheid. ideale kolombreedte: 10 à 12 woorden - Streamers? - Chapeaus?

32 Modulairgrid kranten etc. Smallere kolommen verhogen de leesbaarheid Zeer flexibel

33 Hiërargisch grid Internet

34 Oefening1 Zoek twee verschillende grids op het web Een bijzonder en een slecht voorbeeld Analyseer het grid en maak het na in InDesign

35 Eisen Laat de kolommen en de hulplijnen zien Geef alle vaste onderdelen aan.

36

37 Oefening 2 Vul een van de grids met tekst en beeld Let op het letterbeeld!

38 Oefening 3 laat dezelfde pagina zien maar nu met andere plaatjes en een ander letterbeeld laat dezelfde pagina zien en speel met de plekken van de plaatjes en tekst.

39 Opdrachten Ontwerp 2 grids naar keuze met typografie en abstracte vormen. Ontwerp 1 grid met letters en vormen die uit de computer komen. Ontwerp 1 grid met letters en vormen die niet uit de computer komen.

40 Eisen Kies twee grids. Zoek bij elk grid een passend grafsich voorbeeld. Maak gebruik van de letters en vormen uit week 1 en week 2. Ontwerp bij elk grid een passende compositie. Gebruik een spiegelreflexcamera bij het grid wat gebruik maakt van letters en vormen die niet uit de computer komen.

41 Opleveren Je levert je ontwerpen op in een Booklet. Dubbelgevouwen A3. Zwart-wit of kleur is aan jullie. Vergeet ook niet de opdrachten die zijn beproken tijdens de les.