In graphic design, as in architecture, the guts of a finished product are held up by an underlying support structure that—more often than not—is invisible to the viewer, but can just as easily make or break a design.
While architectural masterpieces ranging from the Empire State Building to the Centre Pompidou make use of steel beams to hold a building design together, graphic designers use a similar structure for the page called a grid system—or more simply, a grid.
At its simplest, a grid system is a series of evenly spaced blocks that help the designer organize and structure their designs in a way that is optimized for the visual flow of information. As a result, working with grids saves the designer time and enables a number of other benefits ranging from more seamless team collaborations to enhancing a visual hierarchy.
Like many other early examples of design and layout, the earliest traces of the grid system can be traced back to the Ancient Greeks—particularly, the golden section.
Derived from the golden ratio, the golden section has been used over the past two-thousand years in art, architecture, and design as a way to produce the most visually satisfying of all geometric forms.
This method of providing visual harmony was later applied to some of the earliest handwritten manuscripts to balance text on a page—particularly early religious scriptures produced by scribes. As demand for books steadily increased, so did the number of variations for type layout as interpreted by those creating the books laboriously by hand.
Also Read: The Disrupt Factor – What Makes Great Design So Disruptive?
When the Industrial Revolution took off in the late 18th century, mass production gave way to more refined print production processes which ultimately gave way to the birth of graphic design. As machines churned out products as fast as humans could make them, the need to stand out in the marketplace became a growing importance. As a result, graphic design surged as print production took off and became the ideal medium for communication as the general public became increasingly more literate and sensitive to design.
Over the next century, advances in print production continued to rise with the introduction of new printing technologies and designs—most notably the Arts and Crafts Movement led by author and publisher William Morris.
But it wasn’t until the early 1900s when a new generation of artists, designers, and thinkers began to truly question the relevance of conventional page layout and look elsewhere for new forms and philosophies.
During this time, the De Stijl and Bauhaus movements in Europe helped usher in a new way of thinking about art, design, and writing — particularly as they were inspired by the idea of functionalism. As this new function-based approach to design worked its way over to the printed page, layout elements began to follow suit as simple designs and clean use of typography became the new standard in graphic design. However, it wasn’t until the end of World War II that grid-based graphic design really began to take off with the introduction of the Swiss International Style led graphic designer Josef Müller-Brockmann.
Heavily inspired by the function-forward design ideals established during the De Stijl and Bauhaus movements before they were sidelined due to World War II, Müller-Brockmann went on to create a body of work over the following decades that employed the use of grid systems to guide simple-yet-effective designs. However, it wasn’t until 1961 that Müller-Brockmann created what is perhaps his most widely-known piece of work.
In that year, the designer effectively condensed thousands of years of layout evolution into a digestible layout guide for a new generation of graphic designers—including those that would go on to create many of the most iconic logos and other graphic designs of our time.
Considered to be one of the most influential books in the history of design, Grid Systems in Graphic Design: A Visual Communication Manual for Graphic Designers, Typographers and Three Dimensional Designers was the first text of its kind to establish design principles based on organized grid systems.
To this day, even the most modern digital design tools and web frameworks incorporate layout tools that follow the grid system principles outlined by Müller-Brockmann in the book.
But just as important as it is to understand how we’ve arrived at grid systems to provide crystal-clear frameworks for our content, it’s equally as important for designers to understand how and why to use them.
“As a designer, the grid is a great starting point for my work,” explains Julia Sloane, a New York City-based graphic designer. “The grid—for me—serves as a guide, but not an absolute. I think every designer can find a different solution within the grid based on the individual project needs to create a clear product while working with their own personal style.”
Without a doubt, the most valuable reason to use a grid system in a modern design is that it brings order to chaos and provides a nearly fail-proof way to keep your content organized. While there is an art to understanding grid systems in such a way that you can bend the rules and play within the boundaries, the key is to organize images and text in such a way that it communicates a design effectively.
Working within the constraints of a grid can also speed up the designer’s workflow—both in the time it takes to create a final piece as well as communicating design intent to other designers. Similar to how an architect might approach the bare bones of a building structure differently if he or she already knew the constraints they were working in, the same holds true for graphic designers.
Finally, working with grid systems can help balance your designs and enhance visual hierarchies with mathematical precision that is proven to be the most aesthetically rewarding for your viewer. After all, the greatest painters and photographers in the history of the world have employed the use of golden ratio-based grid systems for centuries.
“In my opinion, graphic design has two roles,” says graphic designer Martin Flores, also of New York City. “First, graphic design should organize data in a way that makes it easy for the user to understand. Second, graphic design should reward the user for paying attention. Grids are a tool that help accomplish both of these goals.”
But perhaps most importantly, while grid systems can be helpful for building out and enhancing layouts with clever design, they are just one tool among many that should both be considered and used creatively with restraint.
“Grids can organize a mass amount of information into something understandable and legible while also establishing a pattern for the user to follow,” adds Flores. “Sort of like establishing rules for a game. And games are most fun when you do really clever things within the rules. Grids are the same way.”
Whether you’re developing the UI for a website or an app, creating the spread for a magazine, sketching out a poster design, or simply just want to create a visually harmonious doodle, the key is to approach the grid as a strong suggestion—but not as a standard.
“The grid system is an aid, not a guarantee,” wrote Müller-Brockmann in Grid Systems in Graphic Design. “It permits a number of possible uses and each designer can look for a solution appropriate to his personal style. But one must learn how to use the grid; it is an art that requires practice.”
hbspt.cta.load(403603, ’90c77495-f7ed-4bd6-a47f-0e033381ac7b’);
