Booklet

author

Teo Almonte

Design

Best Grid System For Ul Or Ux

design

Design

|

BEST GRID SYSTEM FOR Ul/UX (AND DEVS)

8-POINT GRID
The 8-point grid is one of the most versatile systems for building modern and scalable user interfaces. It's built on a simple rule: use multiples of 8 to define patterns.
Everything from margins, spacing, typography, and more can have this rule applied. This solution makes decision making easier and the process effortless.

The popularity of the 8-point grid system is unrivaled. It's widely supported by the design community. A lot of big names in the industry are also constantly improving and adapting it to their needs.
Dive deeper into these companies grid systems to gain more insights into their decisions.

KEY BENEFITS
using the 8-point grid system provides you with an easy way to compose components together elegantly and consistently. It also eliminates a lot of the guesswork and in return rewards you with less fatigue.
Choosing this system also helps creates beautiful visual rhythm as the constraints simplify decision making.

DESIGN COMPATIBILITY
The 8-point grid system has one of the highest device compatibilities. Most popular devices are divisible by 8 which makes designing pixel-perfect designs a breeze.
With such a high compatibility rate, this vastly improves the chances users won't see that annoying offset pixel usually experienced on retina displays.

DESIGN PATTERNS
A solid grid system is the foundation of any design pattern and is also one of the easiest ways to achieve an organized design.
With the 8-point grid in place, it not only makes the designers' job easier but it's also good for the user. It's simply an easy win for any design system.

BREAK THE RULES
And always remember to rely on your instincts as a designer; using a grid system doesn't mean rules can't be broken. It's ultimately up to you to make decisions.

Take Action. How are you going to level up your grid skills?
THANK YOU!
Drop your questions & comments below

More booklets by Teo Almonte

  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images

More Design booklets

Your recently viewed booklets

  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
See all booklets