Use space to group related elements

In the example, the lack of space between content makes the design look cluttered and difficult to understand. Increasing spacing helps to clearly group content, making it more organized and easier to understand.

Breaking up information into smaller groups of related elements helps to structure and organize an interface. This makes it faster and easier for people to understand and remember.

You can group related elements using the following methods:

Place related elements in the same container
Space related elements close together
Make related elements look similar
Align related elements in a continuous line

Using containers is the strongest visual cue to group interface elements, but it can add unnecessary clutter.

Look for opportunities to use other grouping methods, they’re often more subtle and can help simplify designs.

Using space in particular is a very effective and simple way to group related elements.

You can also combine grouping methods to help display groupings more clearly.