Research

Plan

Josef Muller-Blockmann

What is a Grid?

A grid subdivides a page vertically and horizontally into margins, columns, inter-column spaces, lines of type, and spaces between blocks of type and images. These subdivisions form the basis of a modular and systematic approach to the layout, particularly for multipage documents, making the design process quicker, and ensuring visual consistency between related pages.

At its most basic, the sizes of a grid’s component parts are determined by ease of reading and handling. From the sizes of type to the overall page or sheet size, decision-making is derived from physiology and the psychology of perception as much as by aesthetics. Type sizes are generally determined by hierarchy—captions smaller than body text and so on—column widths by optimum word counts of eight to ten words to the line, and overall layout by the need to group related items. This all sounds rather formulaic, and easy. But designers whose grids produce dynamic or very subtle results take these rules as a starting point only, developing flexible structures in which their sensibility can flourish.

de Stijl, the Bauhaus, and Jan Tschichold

In 1917 Dutch architect, designer, and painter Theo van Doesburg founded de Stijl. The importance of this movement to the grid is that it explored form as determined by function, and placed this in a political context. Arguing that simplicity of form was accessible and democratic, its members advocated minimalism, using only rectilinear forms, and eradicating surface decoration other than as a byproduct of a limited color palette: the primaries plus black and white. The typographers affiliated to de Stijl wanted to apply these ideas in the real world, not just for their artistic cause. Designers like Piet Zwart and Paul Schuitema used these principles to produce commercial advertising and publicity materials.

The Bauhaus opened its doors in Weimar, Germany, in 1919, with the architect Walter Gropius as its Director. His belief that architecture, graphic art, industrial design, painting, sculpture, and so on were all interrelated had a profound impact on the development of typography and graphic design long after the school was forced to close by the Nazis in the 1930s. Within an astonishingly short period of time, graphic artists were marrying analytical skills with abstract form to arrive at mass-produced designs determined as much by political idealism as by a desire for self-expression. In 1925, Herbert Bayer was appointed to run the new printing and advertising work-shop. He paid attention to typographic detail, experimenting with a limited typographic palette in order to achieve greater visual clarity and easily navigable pages.

During the late 1920s and the 1930s, typographer Jan Tschichold set out his typographic principles in two seminal books: The New Typography (1928), and Asymmetric Typography (1935). Tschichold’s work was more refined than much of that which had preceded it. He wrote of typographic consistency as a necessary precursor to understanding, described designers as akin to engineers, and argued compellingly for asymmetry as a central tenet of modernism. It was the logical way to lay out text that is read from left to right, and produced "natural" rather than "formalist" solutions to the new design challenges than classicism, with its enforced central axis. In his work Tschichold explored subtle horizontal and vertical alignments, and used a limited range of fonts, type sizes, and type weights.

The Grid and Swiss Typography

Early modernists had explored layout, space, and scale. They had talked of the democratizing benefits of mass production, and had used the language of science as much as art. They had argued for consistency and minimalism as a mark of design confidence and greater accessibility. During WWII, and in the decades that followed, these ideas coalesced into a coherent design manifesto with a new design device at its core—the grid.

The grid and Swiss typography are synonymous. Switzerland was neutral during the war. Not only did it attract many intellectual refugees, including designers like Jan Tschichold, but also most peacetime activities continued as normal, and supplies of such things as ink and paper weren’t rationed. Added to this, publications had to be set in its three official languages—French, German, and Italian—which called for a modular approach, using multiple column structures.

Several Swiss artist/designers, most notably Max Bill and Richard Paul Lohse, explored systematic forms in their paintings concurrently with graphic design, while the graphic designers Emil Ruder and Josef Müller-Brockmann both wrote educative texts explaining what grids were and how to use them. They approached the subject with great rigor, arguing passionately that "integral design" required structures that would unite all the elements in both 2-D and 3-D design: type, pictures, diagrams, and space itself. Despite their enthusiasm for order and precision, they both understood the value of artistic intuition.

"No system of ratios, however ingenious, can relieve the typographer of deciding how one value should be related to another… He must spare no effort to tutor his feeling for proportion… He must know intuitively when the tension between several things is so great that harmony is endangered. But he must also know how to avoid relationships lacking in tension since these lead to monotony."
Emil Ruder, Typography

The grid and the design philosophy of which it is a part have been criticized for placing the narcissistic designer at the heart of the solution, and generating formulaic solutions that are mechanistic, unyielding, and rigid. But for Ruder, Müller-Brockmann, and many other designers since, the grid was the natural response to a design problem. It was also a metaphor for the human condition, and was found in all areas of human endeavor.

“Just as in nature, systems of order govern the growth and structure of animate and inanimate matter, so human activity itself has, since the earliest times, been distinguished by the quest for order… The desire to bring order to the bewildering confusion of appearances reflects a deep human need.”
Josef Müller-Brockmann, Grid Systems in Graphic Design

The Grid Made Visible

Grids are generally made visible only through use, but some designers have exposed the workings of the graphic design machine to demonstrate that the grid is something not only of utility, but also of beauty. Once visible, the precision of the grid acts as evidence of design credibility, and its purity of form has a mystical draw.

The Dutch designer Wim Crouwel pioneered the application of systematic design in the Netherlands during the 1950s and 1960s. His identity for the Vormgevers exhibition at the Stedelijk Museum in Amsterdam in 1968 used an exposed grid in the layout of posters and catalogs, which was also the basis of the lettering. In 1990, issue 7 of 8vo’s influential journal Octavo ran grids with coordinates, like maps, under each spread. Octavo called their method of working "visual engineering."

"To get things built, you have to be able to describe them… The act of specifying requires one to define the structure of a design very precisely… It places one's design under intense scrutiny in terms of structure and logical process. Very different to the 'drag and drop' computer screen environment, where close enough is often good enough." 

Mark Holt and Hamish Muir, 8vo: On the Outside

source: http://www.graphics.com/article-old/brief-history-grids

Type hierarchy

"Type hierarchy organizes and gives order to the text elements in your design. Just as web designers and developers use header tags – h1, h2, h3 and so on – to organize the importance of text, visual hierarchy uses visual cues. In addition, type hierarchy helps readers scan text, reading bits of type faster in chunks that look alike.

Generally, English language readers start at the top left and read across and down. Type is often organized to mirror this behavior. But what if the biggest and boldest text is midway down the page? Often a reader will start there and then go back to the top of the page and continue with normal reading behavior.

Hierarchy is important because it allows the designer to determine what someone will likely read first, second and so on. Because of this, the designer can create type in such a way that he or she knows what information is likely to be received and in what order."

source: http://designshack.net/articles/typography/creating-visual-hierarchy-with-typography/

Modernism

With the advances of technology Modernism began to break through at the end of the 19th century into the beginning to the 20th century. Western society began to develop new ways to shape human culture and improve the constructed environment.

Modernism covered many creative disciplines from design and art to influencing architecture, music and literature. The power of machines forced artists to strategically re-think their practice, the results were revolutionary and still influences designers to this very day. This new technology provided the opportunity for mass production, and the machine itself became a theme in modernism.

Influential designers of this period range from Walter Gropius from the Bauhaus to the modern architect Le Corbusier, both men were fascinated with all disciplines of design and it reflected greatly in their work.

source: http://www.creativebloq.com/graphic-design/easy-guide-design-movements-modernism-10134971

Online sources:

http://studenttheses.cbs.dk/bitstream/handle/10417/2956/%20astrid_regout.pdf?sequence=1

http://www.eyemagazine.com/feature/article/reputations-josef-muller-brockmann

Interview 

http://www.noupe.com/design/josef-muller-brockmann-principal-of-the-swiss-school.html

http://typophile.com/files/How%20you%20make%20a%20grid.pdf

http://archive.bridgesmathart.org/2012/bridges2012-417.pdf

http://designshack.net/articles/typography/creating-visual-hierarchy-with-typography/

http://www.creativebloq.com/graphic-design/easy-guide-design-movements-modernism-10134971

http://www.citrinitas.com/history_of_viscom/modernists.html

http://www.dhub.org/postmodernism-the-movement-we-love-to-hate/

http://www.dezeen.com/2015/07/23/guide-to-postmodern-architecture-design-glenn-adamson/

http://www.theartstory.org/definition-postmodernism.htm

http://isites.harvard.edu/fs/docs/icb.topic1050153.files/Grids_Rosalind%20Krauss.pdf

http://digitalcommons.calpoly.edu/cgi/viewcontent.cgi?article=1113&context=grcsp