constructs the visual hierarchy of the interface, with significant color levels, pictures, text sizes, and the most basic organization of content.
structure design refers to the process of grouping the contents of the interface, designing and structuring the information and data in the interface.
good structure design can make the interface information communicate more clearly and quickly. So, what if the structure is designed,
structure design — content grouping
uses lines, boxes, and background colors to group
, the most common grouping method, has a long history of UI design.
uses lines to group
uses boxes to group
uses background color grouping
is not line, box, or background color, are visible borders, originally introduced the visible boundary of the purpose is to make the information presented more clearly, but add these visual elements in a certain extent also increased the sense of messy interface. As a result, more and more space will be used to group the content of the interface.
uses spatial proximity to group the content of the interface
from XP to win7, the change is obvious.
web design is the same, more and more new interface with minimalist ideas, only few lines and background color, more time is passed between the distance to pull big block block.
people who like to go deep may ask why there is no visible boundary, and we can clearly group the information according to the distance.
about this phenomenon, in the early twentieth Century, a team of German psychologists studied the work of human vision in an attempt to explain the principles of human vision. They observed many visual phenomena and proposed the Gestalt principle (Gestalt). In view of this phenomenon, the principle of proximity is one of them.
Gestalt principle: proximity
says is that the relative distance between objects directly affects how we perceive them and how they are organized together. Objects that are close to each other seem to belong to a group, and those that are far away are not.