Grid systems have long been a part of design’s backbone. Its origins date back to early book design. However, if you look around, grids establish order where there would otherwise be a slew of unpredictabilities.
Certainly, just as is the case in other grid instances, you can get away with eyeballing and creating the illusion of order and alignment without being pixel-perfect, as an untrained eye would most likely not notice– but grids are more valuable than you think. Here are a few reasons why:
Grids Create and Facilitate Consistency
Be it shopping online, reading blog posts, or navigating through our phone apps– all these now mundane interactions are intuitive to us because of the underlying guidance that grids provide. (Of course, it is also because many other things are working together, but grids are a very foundational and an invisible aspect.) Not only do they guide the user’s eye by carving out paths and assigning priority by giving certain blocks more real estate than others, but they are such a helpful tool for designers as well. Which takes us to the next point.
More Effective Designer Collaboration
The parameters that grids establish is not to box the work in (as there are a number of grids to use and there is infinite creativity in working within them), but to create an ordered and mathematical plan. This becomes especially helpful when designers are collaborating on an interface design. By using grids, the next designer knows the exact proportions, spacing, placement, and margins to carry forth throughout screens, eliminating the inconsistencies and back and forth of different hands working on the same project. When using grids, the guesswork of where to place elements and how to align them is removed by using these systems as a guide– really bringing in a formulaic process to the otherwise subjective and freeform world of design.
Essential for Responsive Design
By now, it’s no surprise how many different devices users interact with on digital interfaces. The days of having to design for one fixed size are long gone. Digital design is now all about fluidity, and what better way to design for fluidity than with the help of grids– no, really. By using these rules, we can define the behavior at the multiple breakpoints our designs will be interacted with. Rather than having a design spill into all the wrong areas, we create control so it will have its intended structure, regardless of screen size.
There are many pieces to creating a product that brings value to your user. When it comes to the design aspect of the bigger picture, grids are there to create order, not only to the user but also to designers and developers. They are an invisible hero, and though it may take time to understand their value or get comfortable with them, they are a huge determining factor between good and amateur design. Not all designs will require a grid, but when it comes to arranging different sections of content on a page, they become pretty crucial.
Hopefully, this helped shed some light on this often ignored element of design. We will discuss the how’s of grids (how to choose and work with the appropriate grids) in the next post.
