The Organic Grid

Modern Grid Systems and Shift to Post-Modern Organic Grid Systems

The standard rectilinear grid system is closely associated with early and late modernist perceptions whereby this type of rigid grid was imposed on nature. Modernist actions and theories that imposed control over nature. Today, natural organizing systems, organic natural structures (post-structuralist systems), continue to be identified, mapped and quantifiable. Based on nature, new grid systems continue to be identified that follow organic pathways and trajectories. Identifying these intelligent and self-organizing systems and structures based on a plethora of macro to microscopic biological and quantum levels, they integrate, interconnect, and overlay one another demonstrating interdependence. This interdependence constructs the world and reality as we know it, expanding into areas we do not understand. Areas such as paranormal and mystical events and experiences, areas of human consciousness that are proving to be quantum related. The organic grid is a progression away from the rigid modernist grid, though its organizing applications are useful when needed. Organic grids are mapping system that flow and mimic our being an organism, a product of nature, a reflection of the environment, enhancing or pronouncing our need to protect, preserve, and lead sustainable lives.

Theories of Contemporary Art, Second Edition, by Richard Hertz, 1993
Farewell to Modernism by Kim Levin

If the grid is an emblem of modernism, as Rosalind Krauss has proposed – formal, abstract, repetitive, flattening, ordering, literal – a symbol of the modernist preoccupation with form and style, then perhaps the map should serve as  a preliminary emblem of post-modernism: indicating territories beyond the surface of the artwork and surfaces outside of art; implying that boundaries are arbitrary and flexible, and man-made systems such as grids are superimpositions on natural formations; bringing art back to nature and into the world, assuming all the moral responsibilities of life. Perhaps the last of the modernists will someday be separated from the first post-modernists by whether their structure depended on gridding or mapping. But because the substructure of any terrain re-created on another scale depends on lines of longitude and latitude (the grid with which we have ordered the earth), maps are the secret and not-so-secret grids of reality, grids gone back to nature, hugging the earth, delineating content. The graph-paper diagrams of the 60’s reduced the grid to its final stages: it became useful, a blueprint for making instead of a formal device. In our transitional time, the grid – when it is not elaborated into a decorative motif – has become a tool for making scale flexible, a device for mapping the features of an imagery, the memory of an experience, a place somewhere else, or a visionary plan.

The Organic Grid by Edwin Tofslie, January 27, 2004

Introduction

The use of organic elements within a rectilinear grid system is a phenomenon of design that has not been clarified and discussed due to lack of definition and realization. This paper will contain a discussion of a new design principle born out of the World Wide Web and interface design. The purpose of this paper is to reveal and define a current movement that has not been identified in a contemporary context. I title this movement and design phenomenon the Organicgrid.

The building blocks for a designer are principles that he or she has acquired over their many years of education and experience. A designer’s sensibility in each project they construct is something I refer to as designer’s intuition. Intuition is what drives the best designers from past, the present and the future. But this intuition has its roots in the rules of art. Composition, layout, balance and symmetry are examples of the natural rules that govern our decisions in the end.

Many movements in design have been based on these rules. These movements are based on principles discovered to effectively create compelling and visually balanced design pieces. The rectilinear grid system refined and implemented by the Swiss years is a great example of a design movement governed by an overriding principle. Our contemporary layout and design compositions are still based on a grid system.

A grid system is a perfect example of how the designers need to organize information and make it functional led to a design movement. This principle was not always seen as a standard in design. But like many contemporary movements and principles, they were first used for pragmatic reasons but not defined. Many people before the Swiss used a grid system to create layouts. This can be seen in many earlier printed materials. One example of course is the Gutenburg Bible of 1455. This book when printed on a press had a very simple grid based system. Movable type necessitated grid-like thinking with respect to page layout. But why did people that came after this not see this style of layout as a movement or principle? Simple, it was not defined. To have a principle of design, it cannot just be seen and used, it must have a definition. This definition must then be accepted as fact.

After studying the many movements and principles we have come to accept as a reasonable foundation for design, I noticed a stylistic trend that in my eyes is a new design movement. And to become a new design principle, it must be defined. The name I have given this design theory is, The Organicgrid.

An organicgrid is, the combination of a grid based layout and non-grid based elements, or organic based shapes. The resulting design has a tension between chaos and structure that is visually exciting yet orderly.

A Base Definition of Organic

*Having or characterized by a usually flowing asymmetrical shape or outline. Characterized by an unconventional or variable form. Having or being an irregular or asymmetrical shape or design.

The traditional definition of organic is:

*Forming an integral element of a whole, having systematic coordination of parts, having the characteristics of an organism: developing in the manner of a living plant or animal.

What Exactly is an Organic Grid

The reason behind the advent of the organicgrid is my observation of a trend that I have seen surfacing across design disciplines.

To begin to understand the definition of organicgrid we must first address the Internet. First created as a medium for transferring textual information, the web was not built upon a graphic orientation, but much like computers in general, were built for textual information. Over the years designers and users have grown more and more restless. We have demanded more visually pleasing elements in our quest for information on the web. This design was in conflict with the reality of the root of the internet which was based on presenting textual information and not graphic pleasing qualities. Through many new technologies and updates to the underlying structure of the web, graphic artists have been able to change the web not only into a place for data, but into a user-friendly experience. Even though the Internet is still evolving and will require much overhaul to allow us to freely create rich graphic and back-end presentation of content, we are advancing in our ability to present information to the end user faster, friendlier and even more visually pleasing.

So what does this have to do with the organic grid? Simple, The basis of the Internet of course is data presentation. Data is presented in most cases in a grid format for reading. A box is created whenever most textual information is posted on the web simply for ease of use. Also, the pages of today require an easy way to navigate. Most web navigation information structure is based on a grid system. To be quite honest, a grid system is not always the most visually exciting form of design. It may be incredibly efficient and very usable, but the end user and even the designers want more. This is where the organic aspect of the organicgrid comes in.

To efficiently create a website that lets a user navigate quickly and precisely, most navigation is based on a grid system. But the presentation of the data and imagery can be presented differently as well. Free placement of visual and textual information supplies the page with an organic counterpoint to the grid. The need for clear presentation of textual data and an efficient navigation system should not stand in the way of letting the other aspects of a website to break free from grid systems. Hence the organicgrid principle is born.

So to further clarify the concept of the organicgrid: “The combination of a grid based structure for presentation of data and layout, with free-form or organic shaped objects or imagery.”

But does this definition compile all of the necessary data that needs to be included? Maybe not. We need to look at the word organic again to find another avenue the organicgrid encompasses.

Anyone paying attention to the design world over the past few years, you may have noticed the use of organic materials and forms in a print and electronic medium. People have started to use things such as wood grain, paper, cardboard, duct tape, dirt and other organic materials in their design. We see many websites and printed materials that try to recreate a feel of the real-life aspects of our lives. Notable designs include combinations of wood paneling, real looking manila envelopes, navigation using nature elements such as leaves, duct tape holding up paper on a virtual wall and even remakes of whole buildings and rooms to try and bring to life the real in a virtual world.

So why are we using these elements in a virtual world? To bring life to a stale virtual world of textual data presentation. The same reason we see compelling and visually intensive design in the textual data world.

So to amend my earlier definition of the organic grid, I would now say an organicgrid is: “The combination of a grid based structure for presentation of data and layout, with free-form or organic shaped, materials, objects or imagery.”

Benefits and Application

What are the benefits of designing a work around the organicgrid principle? One of the most prominent reasons is to create a design that engages the user while creating a sound understandable environment to present textual information. Before the Internet, many and most design and interface pieces were created based on the grid system, or a very loose free-form structure. To combine the two types of design may seem contradictive to nature, but the way that the organicgrid is used in the end is almost too natural.

Another benefit of using the organicgrid, is almost a reversal of the first concept. The other type of an organicgrid I first talked about was using organic materials such as wood, grass, and other organic materials. But how would one create a grid-based system with these organic materials? Simple, grids are manifested naturally in nature. It is our job to fish them out and see the under lying structure of organic materials. This may seem complicated at first, but the underlying structures in organic materials found in nature are based on some aspect of a grid system. Seen here is a exploration of the patterns and systematical evidence found in organic structures created by Mike Cina.

Rosalind Krauss explains the spatial grid aspect found in nature. “In the spatial sense, the grid states the autonomy of the realm of art. Flattened, geometricized, ordered, it is antinatural, antimimetic, antireal. It is what art looks like when it turns its back no nature. In the flatness that results from its coordinates, the grid is the means of crowding out the dimensions of the real and replacing them with the lateral result not of imitation, but of aesthetic decree. Insofar as its order is that of pure relationship, the grid is a way of abrogating the claims of natural objects to have an order particular to themselves; the relationships in the aesthetic field are shown by the grid to be in a world apart and, with respect to natural objects, to be both prior and final. The grid declares the space of art to be at once autonomous and autotelic.”

This section claims that a grid system abolishes the claims that natural objects have order. This is absurd. The very building blocks of life and materials are based on a grid system. Patterns can be found in nature and structure reigns in organic forms.

“Structure in Nature is a Strategy for Design” by MIT’s Peter Pearce provides us wonderful evidence to contradict Rosalind Krauss’s statements. His study of the underlying triangular grid systems found in nature to accomplish adaptive, structurally sound and economical environments is compelling and based on study and experimentation. He quotes, “...a building strategy with which diversity and change can be accomplished by modular systems...which consist of some minimum inventory of component types which can be alternatively combined to yield a great diversity of efficient structural form.”

Nature, I believe, is based on structure. The reason for compelling beauty and symmetry in nature, is due to its manifestation in the underlying elements and even molecular mathematical patterns.

A second way to create a grid on an organic surface is by layering or overlay. Many designers seem to start with a white canvas or maybe another color as their canvas. The closest method to this that has been done in design in the past is overlaying text on photos. This can be seen as one branch of the organicgrid. Many people overlay text on images without a grid structure. But remember, to make it an organic grid, there must be an overlaying grid system invoked. One example of this photographic organic grid is seen in my website pictured below.

Current and Future Application and Use

The first application of the organicgrid, to create a design that engages the user while creating a sound understandable environment to present textual information, is very broad. I will now try and explain in depth this method with visual examples.

The application of the organicgrid into my own work has just begun. One of the most recent uses of this technique can be seen in a website I recently created for a band called Pivitplex.

The first element that was taken from the organicgrid was of course the grid system seen in all aspects of this site. It is used to separate areas, create formal relations between elements and unify the separate elements of this site. It creates an excellent format for presentation of textual and even other forms of individual imagery.

The second application of the organicgrid dealt with organic materials and even photography with a grid system overlaid. This can be seen here, and even more on the real website when the boxes are rolled over with the mouse.

The black and white vector imagery in the lower left is part of the first application of the organicgrid, “Organic/Freeform shapes used in a grid environment”. Granted they are vectorized photographs, but their basic structure is that of a negative space creating freeform objects.

Again I will turn to Mike Cina who I have found to be one the in the forefront of this practice of an organicgrid type approach to design. As stated in his interview with Adobe, Mike tells us many things that I fine similar to the principles of the organicgrid. First of all we see in this interview that, “As a stylist, he relies heavily on the grid-based system of Swiss designer. Cina begins every project by opening Illustrator, turning on the grid, and activating the Snap to Grid setting. From there, he normally builds animations layer by layer, always making sure to stick within the clear, mathematical outlines he'd set up in the beginning.” This in itself is of course a key point in the creation of an organicgrid. But as we read further we see a hint of style that can be seen as organic structures. He calls it his “own design sensibilities.” But as you read the description of this image and see the actual image, you will realize that his “own design sensibilities” fall within the style and principle of the organicgrid.

The future of design is based on trends, the current environment and happenings and sometimes a design movement. Trends include 45 degree lines, neon colors, use of a certain font, type of imagery used, an underground culture’s aspect on life and even politics can sway trends. But what makes a movement? A new discovery or an implementation of how we design. One major movement was the Swiss Movement, which dealt with the structure and the rigid rules of the grid. The movement to break away from the structure of the grid was based on elements such as bent lines, getting rid of white space, layering, texture, collage, and montage. David Carson is one of the contemporary day people who started a movement that deals with intuition, broken text, unreadable text that actually does not stop the message from being conveyed. Why are these movements, because they have a definition. In my eyes, the creation of the World Wide Web has started a new movement. This movement is based on usability, presentation of textual information and the use of other non-structured elements to bring life to this data. The future of the organicgrid can only go forward from today. I have tried to simply define this design principle so that, I believe, may be heralded as a movement. The future of design is that of the presentation of data, navigation and even tools we use to display information to effectively let the user navigate and receive information with great ease. The need for the organicgrid will be to create this ease of use with compelling graphics and a positive user experience that simply, will please the end viewer and give the world a unique experience not found in the presentation of good clean grid based structured textual data.

The reason I have decided to talk about the self-made term organicgrid was to define a movement that I am witnessing and participating in. The reason to define a movement is for validity, so that it may become a principle for the future designers to come. I see great possibilities for the organicgrid and wanted to give the design world a simple yet compelling explanation of this movement. With this simple definition, I want other designers to take it, use it, build upon it and explore the possibilities of using the organicgrid in their own design.

As for me, the next step is to personally explore my definition with my own work. I want to build upon my findings and dig deeper into the unknown area of the organicgrid, and also create work that hopefully will be and inspiration for all.

Edwin Tofslie is a traditional and new media designer and theorist currently working at AKQA of San Francisco.

Credits

Krauss, Rosalind. The Originality of the Avant-Garde and Other Modernist Myths.
The MIT Press, 1985

Shepter, Joe (2001). Web Gallery: Mike Cina. [12 pages].
Retrieved April 7, 2002 from http://www.pacific.adobe.com

Kroeger, Michael (1997). MK Graphic Design. [1 page].
Retrieved April 8, 2002 from http://www.mkgraphic.com/weingartdq.html