There is a basic term in designing, which is often sidelined and forgotten: Space. It is an important factor in design and brings a lot of difference to all the elements used. This article talks about the importance of negative space and its usage.
Let’s understand a little about space
Illusion is a part of how a human brain works. What our eyes see and how the brain interprets is not always the same as what the truth is. An optical illusion is the best example of how a brain misinterprets what the eyes see, as compared to what exists in reality.
Let’s take the Kanizsa triangle for example. Named after the Italian psychologist Gaetano Kanizsa, who developed it in 1955, this example illustrates illusion perfectly.
What do you see? At first, you probably see a triangle with a black border in the background and an upside-down, white triangle on top of it. Of course, that’s not really what’s there, is it? In reality, there are merely lines and partial circles. Your brain creates the shape of an upside-down triangle out of the empty space because that’s what it expects to see.
This demonstrates negative spacing used in most designs. A few logos like FedEx show us how well the illusions play with the human brain, creating the arrow between E and X.
This way, we can easily trick the brain into thinking what we want it to think.
Negative space is vital in a design
Negative space plays a significant role in designing and acts as an important design tool. Space holds your design together. It augments the object of the design and brings it into focus. Negative space is not redundant space or a white background. The background could be a blurred image, patterns, or anything else. Everything around the object of a design is negative space or white space, which is another term. Negative space is of two types: micro and macro. Micro negative space is the space between the smaller elements of the design. Things like the space between paragraphs, individual lines of type, even the space between letters and words. Macro negative space is the space between the larger, core elements of the design such as your header and footer.
Now that we are clear about what negative space is, let’s get to the usage.
Macro always gets more attention than micro
A human eye would see a larger area more prominently as compared to minute spaces. However, even with macro spacing, people usually tend to clutter their available space. While designing a website, for instance, it would be their headers and footers. They fail to provide breathing space, which results in a suffocated visitor experience. It is important to keep only the key elements in the design. The more adequate the room and spacing is, the more relevant the inclusions seem. Not just with headers or footers, this also goes for the menu or sidebar on your design layout. Below is a great example of good usage of macro as well as micro negative space for Pingometer created by 17Seven:
For micro spacing, it is important to keep an adequate amount of space between the word blocks. It increases readability and highlights content wherever necessary. The spacing shouldn’t be abrupt or crowded. It should be aesthetically well balanced. But, be careful, too much or too little of spacing can make it all go wrong.
Here are a few examples of designs that demonstrate negative space in the best possible way:
Logo designs
Bullet
Bullets tearing into the letter
Wine Forest
Branches of trees shape wine bottles
Cork Champaign Bar
C that shapes the cork
Martini House
Two wine glasses make a house
Award-winning website designs
Feed
A simple design with ample space, which justifies all the elements equally
Minimums
A segregated grid-based design with a proper call to action right at the top. It takes a very bold approach with big, well-spaced typography and big images.
Apple
The site has a very clean layout with a smooth flow and a proper CTA
World of Swiss
A well-spaced airline website design. The site pays good attention to both micro and macro spacing
Using negative space is all about strategic placement of elements in a website layout like objects, content, and images and hence should be a part of UI and UX strategy. Minimalism is the best way to go about any design and negative space plays a significant role in achieving this.
Try playing around and let us know how it helped your design.
